balaji
balaji

Reputation: 1575

how to design my table layout in 2colum, 2row format?

hi friends I wish to design my xml in table layout but, I am confused..now I am post my current output and screen shot and also expected screen shot. please help me... how to create my expected design...please guide me......

source code: xml

    <?xml version="1.0" encoding="utf-8"?>
<ScrollView
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content">
    <TableLayout
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:stretchColumns="0">
        <TableRow>
            <View
                android:layout_height="80px"
                android:background="@drawable/m7"/>
            <TextView android:text="Name: Tom"
                android:paddingLeft="4px"
                android:layout_gravity="center_vertical" />
                <TextView android:text="Name: Tom1"
                android:paddingLeft="4px"

        android:layout_gravity="right|center_vertical" />
        </TableRow>
        <TableRow>
            <View
                android:layout_height="80px"
                android:background="@drawable/m6" />
            <TextView android:text="Name: Ronald Joy"
                android:paddingLeft="4px"
                android:layout_gravity="center_vertical" />
        </TableRow>
        <TableRow>
            <View
                android:layout_height="80px"
                android:background="@drawable/m5" />
            <TextView android:text="Name: Thomas"
                android:paddingLeft="4px"
                android:layout_gravity="center_vertical" />
        </TableRow>
        <TableRow>
            <View
                android:layout_height="80px"
                android:background="@drawable/m4" />
            <TextView android:text="Name: Steve"
                android:paddingLeft="4px"
                android:layout_gravity="center_vertical" />
        </TableRow>
        <TableRow>
            <View
                android:layout_height="80px"
                android:background="@drawable/m3" />
            <TextView android:text="Name: Jurjen"
                android:paddingLeft="4px"
                android:layout_gravity="center_vertical" />
        </TableRow>
        <TableRow>
            <View
                android:layout_height="80px"
                android:background="@drawable/m2" />
            <TextView android:text="Name: Gabriel"
                android:paddingLeft="4px"
                android:layout_gravity="center_vertical" />

        </TableRow><TableRow>
        <View
                android:layout_height="80px"

                android:background="@drawable/m1" />
            <TextView android:text="Name: Abrahem"
                android:paddingLeft="4px"
                android:layout_gravity="center_vertical" />
                </TableRow>
    </TableLayout>
</ScrollView>

enter image description here Expected design:- enter image description here

enter image description here

Upvotes: 1

Views: 714

Answers (1)

Kannan Suresh
Kannan Suresh

Reputation: 4580

Hope this would help.

<TableLayout
    android:layout_width="fill_parent"
    android:layout_height="wrap_content" 
    android:background="@android:color/darker_gray"
    android:padding="10dp">

    <TableRow
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:gravity="center_horizontal" >

        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" 
            android:background="@android:color/white">

            <ImageView
                android:id="@+id/imgPicture4"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:focusable="true"
                android:src="@drawable/icon" >
            </ImageView>

            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:gravity="left"
                android:orientation="vertical"
                android:paddingLeft="10dp" >

                <TextView
                    android:id="@+id/TextView01"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="Name : Tom"
                    android:textColor="@android:color/black" >
                </TextView>

                <TextView
                    android:id="@+id/TextView01"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="Company : TCS"
                    android:textColor="@android:color/black" >
                </TextView>

                <TextView
                    android:id="@+id/TextView01"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="Phone : 12345"
                    android:textColor="@android:color/black" >
                </TextView>
            </LinearLayout>
        </LinearLayout>

        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" 
            android:layout_marginLeft="10dp"
            android:background="@android:color/white">

            <ImageView
                android:id="@+id/imgPicture4"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:focusable="true"
                android:src="@drawable/icon" >
            </ImageView>

            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:gravity="left"
                android:orientation="vertical"
                android:paddingLeft="10dp" >

                <TextView
                    android:id="@+id/TextView01"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="Name : Tom"
                    android:textColor="@android:color/black" >
                </TextView>

                <TextView
                    android:id="@+id/TextView01"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="Company : Infosys"
                    android:textColor="@android:color/black" >
                </TextView>

                <TextView
                    android:id="@+id/TextView01"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="Phone : 45678"
                    android:textColor="@android:color/black" >
                </TextView>
            </LinearLayout>
        </LinearLayout>
    </TableRow>

     <TableRow
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="10dp"
        android:gravity="center_horizontal" >

        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" 
            android:background="@android:color/white">

            <ImageView
                android:id="@+id/imgPicture4"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:focusable="true"
                android:src="@drawable/icon" >
            </ImageView>

            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:gravity="left"
                android:orientation="vertical"
                android:paddingLeft="10dp" >

                <TextView
                    android:id="@+id/TextView01"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="Name : Tom"
                    android:textColor="@android:color/black" >
                </TextView>

                <TextView
                    android:id="@+id/TextView01"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="Company : TCS"
                    android:textColor="@android:color/black" >
                </TextView>

                <TextView
                    android:id="@+id/TextView01"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="Phone : 12345"
                    android:textColor="@android:color/black" >
                </TextView>
            </LinearLayout>
        </LinearLayout>

        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" 
            android:layout_marginLeft="10dp"
            android:background="@android:color/white">

            <ImageView
                android:id="@+id/imgPicture4"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:focusable="true"
                android:src="@drawable/icon" >
            </ImageView>

            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:gravity="left"
                android:orientation="vertical"
                android:paddingLeft="10dp" >

                <TextView
                    android:id="@+id/TextView01"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="Name : Tom"
                    android:textColor="@android:color/black" >
                </TextView>

                <TextView
                    android:id="@+id/TextView01"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="Company : Infosys"
                    android:textColor="@android:color/black" >
                </TextView>

                <TextView
                    android:id="@+id/TextView01"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="Phone : 45678"
                    android:textColor="@android:color/black" >
                </TextView>
            </LinearLayout>
        </LinearLayout>
    </TableRow>

</TableLayout>

Upvotes: 1

Related Questions