Search code examples
androidandroid-tablelayout

Android tablelayout row padding


I want to create a table with buttons on the right of the rows as shown below. I want to set padding for the right of each row but this "eats into" the right most button. Is there a way of having the padding without compromising the display of the buttons?

Screen shot of the table layout

Here's my layout xml code:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="10dp" >

<TableLayout 
    android:id="@+id/tbl_test"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:background="#000000"
    android:orientation="vertical"
    android:layout_marginTop="1dp"
    android:layout_marginBottom="1dp"
    android:stretchColumns="1"
    >

     <TableRow android:background="#ffffff" android:layout_margin="1dp">

        <TextView android:text="Col 1" android:layout_column="0" />
        <TextView android:text="Col 2" android:layout_column="1" />
        <TextView android:text="Col 3" android:layout_column="2" />
        <TextView android:text="Col 4" android:layout_column="3" />

    </TableRow>

     <TableRow
         android:background="#ffffff"
         android:layout_marginLeft="1dp"
         android:layout_marginRight="1dp"
         android:layout_marginBottom="1dp">

         <TextView android:text="r1" android:layout_column="0" />
         <TextView android:text="padding right 0dp" android:layout_column="1" />
         <Button android:text="edit" />
        <Button android:text="delete" />

    </TableRow>

     <TableRow
         android:background="#ffffff"
         android:layout_marginLeft="1dp"
         android:layout_marginRight="1dp"
         android:layout_marginBottom="1dp"
         android:paddingRight="2dp">

        <TextView android:text="r2" android:layout_column="0" />
        <TextView android:text="padding right 1dp" android:layout_column="1" />
        <Button android:text="edit" />
        <Button android:text="delete" />

    </TableRow>

     <TableRow
         android:background="#ffffff"
         android:layout_marginLeft="1dp"
         android:layout_marginRight="1dp"
         android:layout_marginBottom="1dp"
         android:paddingRight="3dp">

        <TextView android:text="r3" android:layout_column="0" />
        <TextView android:text="padding right 2dp" android:layout_column="1" />
        <Button android:text="edit" />
        <Button android:text="delete" />

    </TableRow>

     <TableRow
         android:background="#ffffff"
         android:layout_marginLeft="1dp"
         android:layout_marginRight="1dp"
         android:layout_marginBottom="1dp"
         android:paddingRight="4dp">

        <TextView android:text="r4" android:layout_column="0" />
        <TextView android:text="padding right 3dp" android:layout_column="1" />
        <Button android:text="edit" />
        <Button android:text="delete" />

    </TableRow>

</TableLayout>

</RelativeLayout>

Solution

  • I don't know why the problem with the clipping happens but one easy way to fix it and obtain the same appearance is to remove the paddingRight attribute from the TableRows and also add the attribute layout_marginRight(set to the padding value) on the last item of the row, the delete Button.