Button width in Android TableLayout

Question

I have a TableLayout with a button at the bottom. My problem is that the button stretches to fill the entire width of the column even though I don't want it that wide.

The XML looks like this:

<?xml version="1.0" encoding="utf-8"?>
<TableLayout
  xmlns:android="http://schemas.android.com/apk/res/android"
  android:stretchColumns="*"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content">
   <TableRow android:layout_height="wrap_content"
        android:layout_width="fill_parent"> 
     <CheckBox android:id="@+id/check1"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content" 
      android:text="Some text 1"/>
     <CheckBox android:id="@+id/check2"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="Some text 1"/>
   </TableRow>
   <TableRow android:layout_height="wrap_content"
        android:layout_width="fill_parent">  
     <CheckBox android:id="@+id/check3"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content" 
      android:text="Even some more text 2"/>
     <CheckBox android:id="@+id/check4"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="Even some more text 2"/>
   </TableRow> 
   <TableRow android:layout_height="wrap_content"
        android:layout_width="fill_parent"> 
     <CheckBox android:id="@+id/check5"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content" 
      android:text="An even longer line of text 3"/>
     <CheckBox android:id="@+id/check6"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="Another longer line of text 3"/> 
   </TableRow>

   <EditText
      android:id="@+id/myEditText1"
      android:layout_width="fill_parent" 
      android:layout_height="wrap_content"
      android:inputType="textMultiLine"
      android:singleLine="false"
      android:text="Enter some text"
    />

   <TableRow> 
   <Button android:id="@+id/SaveButton"
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content"
      android:text="Save">
  </Button> 
  </TableRow>       

</TableLayout>

Even if I set an explicit width to the button it ignores it. For example if I have:

   <Button android:id="@+id/SaveButton"
      android:layout_width="100sp"
      android:layout_height="100sp"
      android:text="Save">
  </Button> 

... the button gets taller but the width still stretches to fill the column.

I'd like the button to be about half its current width, centered in the column. Thanks in advance!!

Answer 1

@mbaird is right: android:stretchColumns="*" is always going to stretch the width of the column. However, you can still get the behavior you want inside the column by putting a FrameLayout into the column which stretches the width of the column, and then put your button inside there. Then you can make the size of the button however you like and center it within the FrameLayout:

<TableRow>
    <FrameLayout
        android:layout_height="wrap_content">
        <Button
            android:id="@+id/SaveButton"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:paddingLeft="40dp"
            android:paddingRight="40dp"
            android:text="Save">
        </Button>
    </FrameLayout>
</TableRow>

Answer 2

I'm pretty sure android:stretchColumns="*" is going to always cause the button to be stretched like that. Have you considered placing the button outside the TableLayout?

From the documentation: The children of a TableLayout cannot specify the layout_width attribute. Width is always MATCH_PARENT. However, the layout_height attribute can be defined by a child; default value is WRAP_CONTENT