0

I need to get a TableLayout to match the width of it's parent LinearLayout, but I cannot get it to work.

In the first screenshot below, the "Short header" is the first view in a vertical LinearLayout. The "Fields" below are members of a TableLayout which is the second view in the vertical LinearLayout.

When the "Header" text does not require as much width as the TableLayout, everything aligns as intended.

When the "Header" requires more width than the TableLayout, the TableLayout does not match_width with the the "Header", as you can see in the second screenshot.

How can I make the TableLayout match the width of the LinearLayout?

Note: The base LinearLayout needs to "wrap" to the smallest width required to display it's contents, so setting a fixed width is not a solution

Short Header

Long Header

The layout XML for this test:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/mainLayout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context=".MainActivity" >

    <LinearLayout 
       android:id="@+id/baseLinerLayout"
       android:layout_width="wrap_content"
       android:layout_height="wrap_content"
       android:orientation="vertical"
       android:background="#FFAAAAAA" >

       <TextView
           android:layout_width="match_parent"
           android:layout_height="wrap_content"
           android:gravity="center"
           android:padding="10dp"
           android:background="#FF000000"
           android:textColor="#FFFFFFFF"
           android:text="Long header to make base layout wider than table layout" />

          <TableLayout 
            android:id="@+id/tableLayout"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="#33FFFFFF" >

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

                <TextView
                    android:gravity="center"
                    android:padding="10dp"
                    android:background="#44FFFFFF"
                    android:textColor="#FF000000"
                    android:text="Field (0,0)" />

                <TextView
                    android:gravity="center"
                    android:padding="10dp"
                    android:background="#88FFFFFF"
                    android:textColor="#FF000000"
                    android:text="Field (0,1)" />

            </TableRow>

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

                <TextView
                    android:gravity="center"
                    android:padding="10dp"
                    android:background="#88FFFFFF"
                    android:textColor="#FF000000"
                    android:text="Field (0,1)" />

            </TableRow>
        </TableLayout>
   </LinearLayout>
</RelativeLayout>
Sound Conception
  • 5,263
  • 5
  • 30
  • 47

3 Answers3

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

     <TextView
           android:layout_weight="1 --- this worked for me"  
           android:gravity="center"
           android:padding="10dp"
           android:background="#44FFFFFF"
           android:textColor="#FF000000"
           android:text="Field (0,0)" />
    <TextView
           android:layout_weight="1"
           android:gravity="center"
           android:padding="10dp"
           android:background="#88FFFFFF"
           android:textColor="#FF000000"
           android:text="Field (0,1)" />

</TableRow>
Ismail Sahin
  • 2,640
  • 5
  • 31
  • 58
  • 2
    Thanks. I'd tried setting `android:stretchColumns="1"` to get the second column to stretch and fill the empty width of the table, but it made the table fill the width of the screen. Your suggestion of setting the weight of the second view in each row to 1 achieves what I thought `stretchColumns` was meant to do from reading the API docs. It suggests the `stretchColumns` attribute might be a bit broken huh? – Sound Conception Nov 15 '13 at 01:29
  • some times some attributes that are supposed to work but do not. I think it migth be because of some parent style or the worst because of version things – Ismail Sahin Nov 15 '13 at 01:33
1

As you are using TextViews without width set, I'd suggest setting android:layout_width parameter of all your fields to match_parent.

edit: Why do you need the second LinearLayout? It seems useless because it only wraps TableLayout.

Marcin Milejski
  • 479
  • 3
  • 9
  • Thanks for your suggestion. Unfortunately I have already played with setting the layout widths of the fields to `match_parent` or `wrap_content`, but it had no effect. In the API documentation it states that *"The children of a TableLayout cannot specify the layout_width attribute. Width is always MATCH_PARENT."*, so I removed those lines as they are ignored. – Sound Conception Nov 15 '13 at 01:02
  • You are correct. The extra LinearLayout is unnecessary. The XML was simplified for the purpose of testing this issue from a floating dialog which adds other views to the second LinearLayout. I've now edited the code in the question to get rid of it. Thanks – Sound Conception Nov 15 '13 at 01:13
1

you need to get the width of the base linearlayout programatically in java file ...

How to get width ? Check here

after that u can set the width of the table layout with the same width

  TableLayout layout = (TableLayout)findViewById(R.id.tableLayout);
    // Gets the layout params that will allow you to resize the layout

LayoutParams params = layout.getLayoutParams();

// Changes the height and width to the specified *pixels*

params.width = x;

layout.setlayoutparams(params);

x is the width which you get from the linear layout

Community
  • 1
  • 1
Avinash
  • 123
  • 1
  • 12