Question

I’m trying to get a solid understanding of how Android Layouts work. I have a layout that I’d like to create but I have been having a very hard time creating it. I have included the code for the layout as well as an image http://tinypic.com/r/33258hx/7 that represents what I’d like to create.

I’ve been struggling with the layout code below and I’m no where close to getting what it is I planned. Could someone please provide me with suggestions and/or references that may help? Thanks.

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

     <LinearLayout
       android:layout_width="wrap_content"
       android:layout_gravity="center_horizontal"
       android:layout_height="fill_parent">

    <ImageView 
       android:id="@+id/image1"
       android:layout_width="wrap_content"
       android:layout_height="fill_parent"
       android:src="@drawable/image1"
       android:scaleType="fitXY">
     </ImageView>

           <LinearLayout
               android:layout_width="match_parent"
               android:layout_height="match_parent"
               android:scaleType="fitXY"
               android:layout_gravity="center_vertical">               
           <ImageView 
                android:id="@+id/image2"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:src="@drawable/image2"
                android:scaleType="fitXY">
           </ImageView>

           <ImageView 
                android:id="@+id/image3"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:src="@drawable/image3"
                android:scaleType="fitXY">
           </ImageView>

           </LinearLayout>

    </LinearLayout>

    <RelativeLayout
       android:orientation="horizontal"
       android:layout_width="fill_parent"
           android:layout_gravity="bottom"
           android:layout_height="wrap_content">

    <TextView 
        android:id="@+id/text1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:textSize="15sp"
        android:text="text1"/>   

    <ImageView 
        android:id="@+id/imageText1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/ImageText1"
        android:layout_above="@+id/text1"
        android:scaleType="fitXY"/>

           <ImageView
               . . .
                />

     <TextView 
        android:id="@+id/Text2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_toRightOf="@+id/Text1"
        android:layout_above="@+id/ImageText2"
        android:text="Text2"
        android:paddingLeft="70px"
        android:textSize="50sp"/>

     <View android:id="@+id/divider"
         android:background="@drawable/black_white_gradient"
         android:layout_width="fill_parent"
         android:layout_above="@id/current_kw"
         android:layout_height="1dp"/>

    <TextView 
        android:id="@+id/Text3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:paddingLeft="30px"
        android:layout_alignParentBottom="true"
        android:layout_toRightOf="@+id/ImageText3"
        android:textSize="15sp"
        android:text="Text3"/>

    <TextView 
        android:id="@+id/Text4"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:paddingLeft="30px"
        android:layout_above="@+id/ImageText4"
        android:layout_toRightOf="@+id/Text3"
        android:textSize="50sp"
        android:text="Text4"/>

        ...

    </RelativeLayout>

</LinearLayout>

Answer 1

Here is the image & XML code for what you want, exactly. I hope it will serve the purpose:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
 android:layout_width="fill_parent"
 android:layout_height="fill_parent"
 android:orientation="vertical">
 <LinearLayout 
    android:layout_height="fill_parent" 
    android:id="@+id/linearLayout1" 
    android:layout_width="fill_parent"
    android:layout_weight="0.25"
    android:orientation="horizontal">
    <ImageView 
        android:layout_height="fill_parent" 
        android:src="@drawable/icon" 
        android:id="@+id/imageView1" 
        android:layout_width="fill_parent"
        android:layout_weight="1.0">
    </ImageView>
    <LinearLayout
        android:layout_height="fill_parent" 
        android:id="@+id/linearLayout3" 
        android:layout_width="fill_parent" 
        android:orientation="vertical"
        android:layout_weight="1.0">
        <ImageView 
            android:layout_height="fill_parent" 
            android:src="@drawable/icon" 
            android:id="@+id/imageView2" 
            android:layout_width="wrap_content"
            android:layout_weight="1.0"
            android:layout_gravity="center_horizontal">
        </ImageView>
        <ImageView 
            android:layout_height="fill_parent" 
            android:src="@drawable/icon" 
            android:id="@+id/imageView3" 
            android:layout_width="wrap_content"
            android:layout_weight="1.0"
            android:layout_gravity="center_horizontal">
        </ImageView>
        <ImageView 
            android:layout_height="fill_parent" 
            android:src="@drawable/icon" 
            android:id="@+id/imageView4" 
            android:layout_width="wrap_content"
            android:layout_weight="1.0"
            android:layout_gravity="center_horizontal">
        </ImageView>
    </LinearLayout>
</LinearLayout>
<LinearLayout 
    android:layout_height="fill_parent" 
    android:id="@+id/linearLayout2" 
    android:layout_width="fill_parent"
    android:layout_weight="0.75"
    android:orientation="horizontal">
    <LinearLayout 
        android:layout_height="fill_parent"
        android:layout_width="fill_parent"
        android:layout_weight="1.0"
        android:orientation="vertical">
        <ImageView 
            android:id="@+id/iv_img1"
            android:layout_height="fill_parent"
            android:layout_width="wrap_content"
            android:layout_weight="1.0"
            android:src="@drawable/icon"
            android:layout_gravity="center_horizontal"/>
        <TextView 
            android:layout_height="wrap_content"
            android:layout_width="fill_parent"
            android:text="text"
            android:gravity="center_horizontal"/>
    </LinearLayout>
    <LinearLayout 
        android:layout_height="fill_parent"
        android:layout_width="fill_parent"
        android:layout_weight="1.0"
        android:orientation="vertical">
        <ImageView 
            android:id="@+id/iv_img1"
            android:layout_height="fill_parent"
            android:layout_width="wrap_content"
            android:layout_weight="1.0"
            android:src="@drawable/icon"
            android:layout_gravity="center_horizontal"/>
        <TextView 
            android:layout_height="wrap_content"
            android:layout_width="fill_parent"
            android:text="text"
            android:gravity="center_horizontal"/>
    </LinearLayout>
    <LinearLayout 
        android:layout_height="fill_parent"
        android:layout_width="fill_parent"
        android:layout_weight="1.0"
        android:orientation="vertical">
        <ImageView 
            android:id="@+id/iv_img1"
            android:layout_height="fill_parent"
            android:layout_width="wrap_content"
            android:layout_weight="1.0"
            android:src="@drawable/icon"
            android:layout_gravity="center_horizontal"/>
        <TextView 
            android:layout_height="wrap_content"
            android:layout_width="fill_parent"
            android:text="text"
            android:gravity="center_horizontal"/>
    </LinearLayout>
    <LinearLayout 
        android:layout_height="fill_parent"
        android:layout_width="fill_parent"
        android:layout_weight="1.0"
        android:orientation="vertical">
        <ImageView 
            android:id="@+id/iv_img1"
            android:layout_height="fill_parent"
            android:layout_width="wrap_content"
            android:layout_weight="1.0"
            android:src="@drawable/icon"
            android:layout_gravity="center_horizontal"/>
        <TextView 
            android:layout_height="wrap_content"
            android:layout_width="fill_parent"
            android:text="text"
            android:gravity="center_horizontal"/>
    </LinearLayout>
</LinearLayout>