BCK
BCK

Reputation: 617

Android Layout Percentage/Proportion Resize

I have 3 layouts. First and third ones are RelativeLayout and the middle one is TableLayout. What I want is the TableLayout should lay over 80% of screen. And 10% for the others. How could I do this? android:layout_weight did not help me. Please could you put a code for this solution?

Upvotes: 0

Views: 2142

Answers (1)

Graham Smith
Graham Smith

Reputation: 25757

Ok here are some steps:

  • set to the relative and table layouts android:layout_width to 0dp
  • in the parent layout add android:weightSum to 10
  • in each of the 3 child layouts add android:layout_weight and set the first & third to the value of 1 and the middle table layout to 8.

Here is the code and screenshot:

graphical editor view

<?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="horizontal"
    android:weightSum="10" >

    <RelativeLayout
        android:id="@+id/leftPane"
        android:layout_width="0dp"
        android:layout_height="fill_parent"
        android:background="#336699"
        android:layout_weight="1">

        <TextView
        android:id="@+id/textView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="10% wide"
        android:textAppearance="?android:attr/textAppearanceLarge" />

    </RelativeLayout>

    <TableLayout
        android:id="@+id/tableLayout1"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="8">

            <TableRow
                android:id="@+id/tableRow1"
                android:layout_width="wrap_content"
                android:layout_height="fill_parent" 
                android:background="#00FFFF">

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="row 1" />

            </TableRow>

            <TableRow
                android:id="@+id/tableRow2"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:background="#33FFFF" >

                                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="row 2" />
            </TableRow>

            <TableRow
                android:id="@+id/tableRow3"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:background="#66FFFF" >

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="row 3" />

            </TableRow>

            <TableRow
                android:id="@+id/tableRow4"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:background="#99FFFF" >

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="row 4" />

            </TableRow>

        </TableLayout>

    <RelativeLayout
        android:id="@+id/rightPane"
        android:layout_width="0dp"
        android:layout_height="fill_parent"
        android:background="#336699"
        android:layout_weight="1">

        <TextView
        android:id="@+id/textView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="10% wide"
        android:textAppearance="?android:attr/textAppearanceLarge" />

    </RelativeLayout>

</LinearLayout>

Upvotes: 1

Related Questions