GridView with TextView in LinearLayout

I am trying to develop small application for Andr开发者_JAVA百科oid which computes users concentration. My idea is to show a matrix of images where user is forced to select given images in amount of time and compute how accurate user was.

The problem is that I do not know, how to design a layout which combines TextViews and GridViews.

I tried to make UI like this but I was not succesfull.

I thought that it is enough to place TextView1 into LinearLayout, then GridView1, TextView2, GridView2 and button. I tried more combinations which led to my failure.

Could you give me a hint how to desing this layout, please?

This is my layout:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/root"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">

<TextView android:text="@+id/TextView01" 
        android:id="@+id/TextView01" 
        android:layout_width="fill_parent" 
        android:layout_height="wrap_content">
        </TextView>

<LinearLayout
  android:orientation="horizontal"
  android:layout_width="fill_parent"
  android:layout_height="wrap_content">

    <ImageView android:id="@+id/ImageView01" 
    android:layout_width="wrap_content" android:layout_height="wrap_content">
    </ImageView>

    <ImageView android:id="@+id/ImageView02" 
    android:layout_width="wrap_content" android:layout_height="wrap_content">
    </ImageView>

    <ImageView android:id="@+id/ImageView03" 
    android:layout_width="wrap_content" android:layout_height="wrap_content">
    </ImageView>
</LinearLayout>

<TextView android:text="@+id/TextView02" 
        android:id="@+id/TextView02" 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content">
</TextView>
<LinearLayout
  android:orientation="horizontal"
  android:layout_width="fill_parent"
  android:layout_height="fill_parent"
  android:layout_weight="0.4">

    <GridView android:id="@+id/GridView01" 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content"
        android:numColumns="auto_fit"
        android:columnWidth="25px"
        android:stretchMode="none">
    </GridView>
</LinearLayout>
<LinearLayout android:id="@+id/LinearLayout01" 
          android:layout_width="wrap_content" 
          android:layout_height="wrap_content">

          <Button android:text="@+id/Button01" 
                  android:id="@+id/Button01" 
                  android:layout_width="wrap_content" 
                  android:layout_height="wrap_content"></Button>
          <Button android:text="@+id/Button02" 
                  android:id="@+id/Button02" 
                  android:layout_width="wrap_content" 
                  android:layout_height="wrap_content"></Button>
</LinearLayout>

I've managed to have more columns in gridview and get there to a single row as many images as I can. But I can't set the height of a row, only width of a column. Images in gridview are magnified and I can't see a method to set them to their original size.

I would suggest to nest all thing to a Linear Layout then put 3 Linear Layout

the first will have the upper bar (button s textview etc) the second will have the Gridview The third will have the lower bar (button s textview etc) You can also put in the Linear Layouts fill parent on both height and width and put Layout weight to first 1 to second 0.5 and third 1 and it will put them in the percentage of height you show us in the picture... Try it and tell us

I recommend spending a bit of time reading about Common Layout Objects. Another good resource is Hello, Views, a collection of many good tutorials for how to use different layouts.