Reputation: 36
HELP I using TableLayout & TableRow, in the picture below I trying to marge No.4 and No.6 together just like No.1 however I had no idea how to do it. For no.1 I was able to do cause I just using Layout-weight to divide the screen into 3row,3col .
<TableLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:stretchColumns="*">
<TableRow
android:layout_weight="2"
android:id="@+id/tableRow1">
<TextView
android:text="1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:gravity="center"
android:background="@android:color/holo_blue_dark" />
<TableLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_span="2"
android:stretchColumns="*"
android:id="@+id/tableLayout1">
<TableRow
android:layout_weight="1"
android:id="@+id/tableRow1"
android:background="@android:color/holo_red_dark">
<TextView
android:text="2"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_span="2"
android:gravity="center" />
</TableRow>
<TableRow
android:layout_weight="1"
android:id="@+id/tableRow3">
<TextView
android:text="3"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:gravity="center" />
<TextView
android:text="4"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:gravity="center" />
</TableRow>
</TableLayout>
</TableRow>
<TableRow
android:layout_weight="1"
android:id="@+id/tableRow1">
<TextView
android:text="5"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_span="2"
android:gravity="center"
android:background="@android:color/holo_green_dark" />
<TextView
android:text="6"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:gravity="right" />
</TableRow>
below img is the result that i wants
Upvotes: 2
Views: 80
Reputation: 4345
Use GridLayout
. Try this following code
<?xml version="1.0" encoding="utf-8"?>
<GridLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:padding="5dp"
android:rowCount="3"
android:columnCount="3"
android:layout_height="wrap_content">
<Button
android:text="1"
android:layout_height="wrap_content"
android:layout_gravity="fill_vertical"
android:layout_rowSpan="2"
android:layout_width="wrap_content"
android:background="#abc012"/>
<Button
android:text="2"
android:layout_columnSpan="2"
android:layout_gravity="fill_horizontal"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:background="#a01012"/>
<Button
android:text="3"
android:layout_gravity="fill"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:background="#10fa5c"/>
<Button
android:text="4"
android:layout_rowSpan="2"
android:layout_gravity="fill_vertical"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:background="#9d34a1"/>
<Button
android:text="5"
android:layout_gravity="fill_horizontal"
android:layout_columnSpan="2"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:background="#f0f53f"/>
</GridLayout>
Screen shot
Edit 1
just replace the
android:layout_height="match_parent"
instead of
android:layout_height="wrap_content"
in <GridLayout>
. Then you will get output as follow as,
Upvotes: 1