Tuesday, October 12, 2010

TableLayout columns equal width

Something easy like columns of equal width in a TableLayout shouldn't be difficult. It's not, but there is a trick to getting the desired layout. layout_width="0dip" and layout_weight="1" tags must be set in your XML layout. Here's an example:

<tablelayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:stretchColumns="1">

    <TableRow>
      <!-- Column 1 -->
      <TextView
         android:id="@+id/tbl_txt1"
         android:layout_width="0dip"
         android:layout_height="wrap_content"
         android:background="@color/red"
         android:textColor="@color/white"
         android:padding="10dip"
         android:layout_margin="4dip"
         android:layout_weight="1"
         android:text="Column 1" />
         
      <!-- Column 2 -->
      <TextView
         android:id="@+id/tbl_txt2"
         android:layout_width="0dip"
         android:layout_height="wrap_content"
         android:background="@color/red"
         android:textColor="@color/white"
         android:padding="10dip"
         android:layout_margin="4dip"
         android:layout_weight="1"
         android:text="Column 2" />
         
      <!-- Column 3 -->
      <TextView
         android:id="@+id/tbl_txt3"
         android:layout_width="0dip"
         android:layout_height="wrap_content"
         android:background="@color/red"
         android:textColor="@color/white"
         android:padding="10dip"
         android:layout_margin="4dip"
         android:layout_weight="1"
         android:text="Column 3" />
    </TableRow>
</TableLayout>

33 comments:

  1. Best of the best! You do not know how many people are searching for this! Thanks a lot.

    ReplyDelete
  2. Perfect! width=0 and weight=1 did the job. Also without stretchColumns="1".

    Many thanks
    Hans

    ReplyDelete
  3. thanks a million !!! Been Stuck on this layout problem for awhile...I had try many combinations with nested layouts...

    ReplyDelete
  4. this seems to only work if the text in the TextViews is the same width. if not, the table does fill the width of the view, but the column widths seem to be proportional to their contained text widths (if that makes any sense :-) )

    ReplyDelete
  5. I just use this tip!
    Thanks a lot!!!

    ReplyDelete
  6. Works perfect... Thanks a lot... :)

    ReplyDelete
  7. Wow... this is grate. lot of problems solved. Thanks a lot

    ReplyDelete
  8. thx man... that is exactly what I was looking for! :)

    ReplyDelete
  9. Hi

    Am creating Textview in Runtime. For this i need to set the columns width as fixed one. i don't have have any Textview inside my table layout

    TableRow tR = new TableRow(this);
    //adding textViews to each Table cell
    TextView tV_txt1 = new TextView(this);
    TextView tV_txt2 = new TextView(this);
    TextView tV_txt3 = new TextView(this);

    for this how can i fix the width..?

    ReplyDelete
  10. This is simple but a guaranteed treasure!

    ReplyDelete
  11. I have text views with borders. So when I do this, there are jagged borders.....how do i solve that

    ReplyDelete
  12. This comment has been removed by the author.

    ReplyDelete
  13. Excellent......... post..... Thanks... a lot.. It helped me very much...

    ReplyDelete
  14. Check out my blog. The following post includes a video that shows you how to create an Android smartphone application that displays a vertically scrolling list of countries on the screen. The application is created using the Eclipse IDE and Android SDK. It features an “OK” button at the bottom of the screen that, when pressed, terminates the application.

    In the process of making this Android application you will encounter the following SDK object types, etc:
    • ScrollView,
    • Button,
    • View,
    • TableLayout,
    • TableRow,
    • OnClickListener,
    • TextView,
    • Colours in Android represented by hexadecimal numbers.

    http://androidprogrammeringcorner.blogspot.com/2015/03/pak-longs-android-programming-corner.html

    Best regards,

    Philip

    ReplyDelete
  15. thanks dude ! you save my life !

    ReplyDelete
  16. Thank you so much for this! It's perfect!

    ReplyDelete
  17. Awesome. Thanks. Worked perfectly for me :)

    ReplyDelete
  18. Thanks.

    was stupid enough to invoke a relative layout inside table row and gave layout_weight.never knew that layout weight works in tablerow
    Thanks a ton

    ReplyDelete