How to create a table by using TableLayout in Android Studio?
Asked Answered
L

3

21

Can some one provides a sample code for me to reference? I want to create the table which likes the photo below.

TABLE:

enter image description here

Loch answered 30/11, 2015 at 10:6 Comment(3)
#2108956 Refer This AnswerCone
did you find solution, check below with screenshot made in android studioErnaline
I had seen the solutions. Thanks for all.Loch
E
36

enter image description here

layout xml file for you just copy paste it and edit according to your choice:

<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"

android:layout_width="fill_parent"
android:layout_height="match_parent"
    android:stretchColumns="0,1,2"
    android:gravity="center">

    <TableRow
        android:background="#FFFFFF"
        android:layout_width="fill_parent"
        android:layout_height="0dp"
        android:layout_margin="1dp"
        android:layout_weight="1"
        >
        <TableRow
            android:background="#000000"
            android:layout_width="fill_parent"
            android:layout_height="0dp"
            android:layout_margin="1dp"
            android:layout_weight="1"
            >



        </TableRow>
    </TableRow>
<TableRow
    android:background="#000000"
    android:layout_width="fill_parent"
    android:layout_height="0dp"
    android:layout_margin="1dp"
    android:layout_weight="1"

    >

    <TextView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:textAppearance="?android:attr/textAppearanceLarge"
        android:text=" Date "
        android:layout_margin="1dp"
        android:layout_column="0"
        android:background="#FFFFFF"
        android:textStyle="bold"
        android:gravity="center"
        />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:textAppearance="?android:attr/textAppearanceLarge"
        android:text="Miles "
        android:layout_margin="1dp"
        android:layout_column="1"
        android:background="#FFFFFF"
        android:gravity="center"
        android:textStyle="bold"
      />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:textAppearance="?android:attr/textAppearanceLarge"
        android:text="Calories"
        android:layout_margin="1dp"
        android:background="#FFFFFF"
        android:gravity="center"
        android:textStyle="bold"
        android:layout_column="2"
       />
</TableRow>

    <TableRow
        android:background="#000000"
        android:layout_width="fill_parent"
        android:layout_height="0dp"
        android:layout_margin="1dp"
        android:layout_weight="1"
        >

        <TextView
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:textAppearance="?android:attr/textAppearanceLarge"
            android:text=" Text"
            android:layout_margin="1dp"
            android:layout_column="0"
            android:background="#FFFFFF"
            android:gravity="center"
            />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:textAppearance="?android:attr/textAppearanceLarge"
            android:text=" Text"
            android:layout_margin="1dp"
            android:layout_column="1"
            android:background="#FFFFFF"
            android:gravity="center"
            />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:textAppearance="?android:attr/textAppearanceLarge"
            android:text=" Text"
            android:layout_margin="1dp"
            android:background="#FFFFFF"
            android:gravity="center"
            android:layout_column="2" />
    </TableRow>



    <TableRow
        android:background="#000000"
        android:layout_width="fill_parent"
        android:layout_height="0dp"
        android:layout_margin="1dp"
        android:layout_weight="1"
        >

        <TextView
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:textAppearance="?android:attr/textAppearanceLarge"
            android:text=" Text"
            android:layout_margin="1dp"
            android:layout_column="0"
            android:background="#FFFFFF"
            android:gravity="center"
            />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:textAppearance="?android:attr/textAppearanceLarge"
            android:text=" Text"
            android:layout_margin="1dp"
            android:layout_column="1"
            android:background="#FFFFFF"
            android:gravity="center"
            />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:textAppearance="?android:attr/textAppearanceLarge"
            android:text=" Text"
            android:layout_margin="1dp"
            android:background="#FFFFFF"
            android:gravity="center"
            android:layout_column="2" />
    </TableRow>

    <TableRow
        android:background="#000000"
        android:layout_width="fill_parent"
        android:layout_height="0dp"
        android:layout_margin="1dp"
        android:layout_weight="1"
        >

        <TextView
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:textAppearance="?android:attr/textAppearanceLarge"
            android:text=" Text"
            android:layout_margin="1dp"
            android:layout_column="0"
            android:background="#FFFFFF"
            android:gravity="center"
            />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:textAppearance="?android:attr/textAppearanceLarge"
            android:text=" Text"
            android:layout_margin="1dp"
            android:layout_column="1"
            android:background="#FFFFFF"
            android:gravity="center"
            />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:textAppearance="?android:attr/textAppearanceLarge"
            android:text=" Text"
            android:layout_margin="1dp"
            android:background="#FFFFFF"
            android:gravity="center"
            android:layout_column="2" />
    </TableRow>


</TableLayout>
Ernaline answered 30/11, 2015 at 10:37 Comment(1)
Concisely, simply and efficiently. If I could give more than one point I would.Haller
B
3

A layout that arranges its children into rows and columns. A TableLayout consists of a number of TableRow objects, each defining a row (actually, you can have other children, which will be explained below). TableLayout containers do not display border lines for their rows, columns, or cells.

<TableLayout
            xmlns:android="http://schemas.android.com/apk/res/android"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:shrinkColumns="*"  android:stretchColumns="*" android:background="#ffffff">


                        <!-- Row 1 with single column -->
                        <TableRow
                            android:layout_height="wrap_content"
                            android:layout_width="fill_parent"
                            android:gravity="center_horizontal">





                       </TableRow>

                        <!-- Row 2 with 3 columns -->


                        <TableRow
                            android:id="@+id/tableRow1"
                            android:layout_height="wrap_content"
                            android:layout_width="match_parent">

                            <TextView
                                android:id="@+id/TextView04" android:text="DATE"
                                android:layout_weight="1" android:background="#dcdcdc"
                                android:textColor="#000000"
                                android:padding="20dip" android:gravity="center"/>

                            <TextView
                                android:id="@+id/TextView04" android:text="Miles"
                                android:layout_weight="1" android:background="#d3d3d3"
                                android:textColor="#000000"
                                android:padding="20dip" android:gravity="center"/>

                            <TextView
                                android:id="@+id/TextView04" android:text="Calories"
                                android:layout_weight="1" android:background="#cac9c9"
                                android:textColor="#000000"
                                android:padding="20dip" android:gravity="center"/>

                        </TableRow>

<!-- Row 3 with 3 columns -->


                        <TableRow
                            android:id="@+id/tableRow2"
                            android:layout_height="wrap_content"
                            android:layout_width="match_parent">

                            <TextView
                                android:text=""
                                android:layout_weight="1" android:background="#dcdcdc"
                                android:textColor="#000000"
                                android:padding="20dip" android:gravity="center"/>

                            <TextView
                                android:text=""
                                android:layout_weight="1" android:background="#d3d3d3"
                                android:textColor="#000000"
                                android:padding="20dip" android:gravity="center"/>

                            <TextView

                                android:layout_weight="1" android:background="#cac9c9"
                                android:textColor="#000000"
                                android:padding="20dip" android:gravity="center"/>

                        </TableRow>



      </TableLayout>
Banshee answered 30/11, 2015 at 10:32 Comment(0)
G
2

try this code it will help you

simple_tablelayout.xml

<?xml version="1.0" encoding="utf-8"?><LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<TableLayout
    android:id="@+id/tabla_cuerpo"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content">
    <TableRow
        android:id="@+id/tableRow1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
        <TextView
            android:id="@+id/id_cad_details_dialog_key"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="@drawable/cell_shape"
            android:padding="5dp"
            android:textColor="#000"
            android:text="TextView">
        </TextView>
        <TextView
            android:id="@+id/id_cad_details_dialog_value"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="@drawable/cell_shape"
            android:padding="5dp"
            android:text="TextView"
            android:textAppearance="?android:attr/textAppearanceMedium">
        </TextView>
    </TableRow>
</TableLayout>

cell_shape.xml

<shape
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape= "rectangle"  >
    <solid android:color="#fff"/>
    <stroke android:width="1dp"
        android:color="#000"/>
</shape>
Ghassan answered 26/2, 2018 at 11:13 Comment(0)

© 2022 - 2024 — McMap. All rights reserved.