Question

For the UI of my app, I want a Gridview above two lines if Textviews, as shown in the image.

My desired layout

I can manage to get one textview to sit nicely below the gridview (using this method) but I cannot work out how to get the second one to display properly. It always seem to be off the bottom of the screen or incredibly thin down the right hand side of the full height of the screen.

Code:

<GridView
    android:id="@+id/gridview"
    android:layout_alignParentTop="true"
    android:layout_above="@+id/textLinearLayout"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:columnWidth="135dp"
    android:numColumns="auto_fit"
    android:verticalSpacing="10dp"
    android:horizontalSpacing="10dp"
    android:stretchMode="columnWidth"
    android:gravity="center"
    />
<LinearLayout
    android:id="@+id/textLinearLayout"
    android:layout_alignParentBottom="true"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_margin="10dp"
    >
    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content">
        <TextView
            android:id="@+id/textviewTimerLabel"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Elapsed time: "/>
        <TextView
            android:id="@+id/textviewTimerTime"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginRight="10dp"
            android:text="00:00:00"/>
        <TextView
            android:id="@+id/textviewPCUTotalLabel"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Total PCU's: "/>
        <TextView
            android:id="@+id/textviewPCUTotal"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="0"/>
    </LinearLayout>
</LinearLayout>

Was it helpful?

Solution 2

<LinearLayout
    ...>
    <GridView
        ...
        />
    <LinearLayout
        ...
        android:orientation="vertical"
        >
        <TextView
            ...
            />
        <TextView
            ...
            />
        <TextView
            ...
            />
    </LinearLayout>
</LinearLayout>

I'm not sure exactly why you're nesting two LinearLayouts together when one should suffice, but all you should need is to set the LinearLayout's orientation to vertical.

OTHER TIPS

put the grid layout and other two text fieltds in a linear layout. Then make all of their layout_width attributes match_parent. Finally add weight to the views so that the grid layout has twice as much space as the text fields have. for example grid layout gets weight=2 and the text views get weight=1 each

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top