0

i created the following layout:

main.xml:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">

    <ImageView
        android:id="@+id/imageView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center_horizontal"
        android:layout_marginTop="20dp"
        android:contentDescription="@string/logo"
        android:src="@drawable/logo" />

    <GridView
        android:id="@+id/gridView1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="20dp"
        android:horizontalSpacing="10dp"
        android:numColumns="auto_fit"
        android:paddingBottom="10dp"
        android:paddingLeft="10dp"
        android:paddingRight="10dp"
        android:verticalSpacing="10dp" >

    </GridView>
</LinearLayout>

gridview_row.xml:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/relativeLayout1"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:background="@drawable/yellow_button"
    android:padding="5dp">

    <ImageView
        android:layout_height="64dp"
        android:id="@+id/imageView1"
        android:layout_width="64dp"      
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true">
    </ImageView>

    <TextView
        android:text="TextView"
        android:layout_height="wrap_content"
        android:id="@+id/textView1"
        android:layout_width="wrap_content"
        android:layout_below="@+id/imageView1"
        android:layout_marginTop="2dp"
        android:layout_centerHorizontal="true"
        android:textSize="18sp"
        android:ellipsize="marquee">
    </TextView>
</RelativeLayout>

and i get this:

enter image description here

Now i would divide this menu in two parts and i would add a label above every part, like this:

enter image description here

Can you please help me to edit these 2 xml file to make me to reach my purpose? Thank you

smartmouse
  • 13,912
  • 34
  • 100
  • 166
  • 3
    You will need **2 GridViews**, for that. One for `Menu 1` and one for `Menu 2`. You may optimize your GridView item by getting rid of the ImageView and including the image as a **compound drawable** inside the TextView. – Phantômaxx Feb 18 '15 at 11:30
  • Ok, now i try to edit my code to make 2 gridviews. How does a compound drawable work? It is the first time that i hear about it. – smartmouse Feb 18 '15 at 11:43
  • in your TextView: `android:drawableTop="@drawable/your_image"` (to set the image on **top** of the text) in Java: `myTxt.setCompoundDrawablesWithIntrinsicBounds(0, your_drawable, 0, 0);` – Phantômaxx Feb 18 '15 at 11:55
  • I see that later. Now i created 2 gridview in Main activity and all works fine... so how to add labels in xml file? – smartmouse Feb 18 '15 at 12:01
  • 1
    Isn't a so-called "label" a simple TextView? – Phantômaxx Feb 18 '15 at 12:02
  • 1
    I did not know it, so now thanks to your hints i solved my problem! Thank you so much :) PS: Since i add more menu items now the two gridviews are not fully shown in the screen. Can you tell me how to add a ScrollBar? I tried to put it before LinearLayout and even before the grids, but it seems not to affect... – smartmouse Feb 18 '15 at 12:16
  • It seems you want to use a ScrollView to contain your LinearLayout, which, in turn will contain the sections with the GridViews. **OR** (just as an alternative design idea) you could use an ExpandableListView. This is better, because it's scrollable and avoids the use of scrollable Views inside a ScrollView. But you have to use custom rows to emulate a GridView. – Phantômaxx Feb 18 '15 at 12:22
  • I do not like ExpandableListView in this case. Do you know how to add the ScrollView? – smartmouse Feb 18 '15 at 12:26
  • 1
    Tutorial: http://examples.javacodegeeks.com/android/core/ui/scrollview/android-scrollview-example/ Just replace `fill_parent` with `match_parent`, since `fill_parent` is deprecated – Phantômaxx Feb 18 '15 at 12:29
  • 1
    I did replaced fill_parent. Now i'm going to deepen your hints: compound drawable and the tutorial. Please stay tuned and thank you for your great support. You seem to be an expert ;) – smartmouse Feb 18 '15 at 12:33
  • Thank you. I'm just a bit experienced. ;) – Phantômaxx Feb 18 '15 at 12:40
  • It doesn't work because "it doesn't work because android dont know with which view he should scroll" as user replied here http://stackoverflow.com/questions/10496804/android-how-to-add-scrollview-into-screen-which-has-some-list-items :( – smartmouse Feb 18 '15 at 12:46
  • Do you know how to set grid on 3 columns? I tried to replace `auto_fit` with `3` but nothing changed... – smartmouse Feb 18 '15 at 12:51
  • Well, adding a scrollable View inside another one is not a preferred way. Because the different scrollings interfere with each other and the scroll is unpredictable. – Phantômaxx Feb 18 '15 at 13:12
  • `android:numColumns="3"` should work. – Phantômaxx Feb 18 '15 at 13:15
  • As i said i tried to do that, but it seems not to affect the layout... what's could be the reason? – smartmouse Feb 18 '15 at 15:08
  • Try setting `android:numColumns="3"` AND `android:stretchMode="spacingWidthUniform"` in your GridViews. – Phantômaxx Feb 18 '15 at 15:41
  • Sorry, i was wrong... it worked. Thank you... What does that setting do? – smartmouse Feb 18 '15 at 15:42
  • 1
    The spacing between each column is uniformly stretched. – Phantômaxx Feb 18 '15 at 15:44

0 Answers0