Search code examples
androidandroid-tablelayout

TableLayout placing


How to place TableLayout a grid of buttons 5 on 5 on the screen center?

  <TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
           android:id="@+id/Table5"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent" 
            android:padding="30dp"
            android:weightSum="5"/>

Solution

  • <?xml version="1.0" encoding="utf-8"?>
    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent" >
    
        <TableLayout
            android:id="@+id/tableLayout1"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:layout_centerInParent="true"
            android:layout_margin="10dp"
            android:background="#ffffff"
            android:gravity="center" >
    
            <TableRow
                android:id="@+id/tableRow1"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:gravity="center_horizontal" >
    
                <Button
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="b11" />
    
                <Button
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="b12" />
    
                <Button
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="b13" />
    
                <Button
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="b14" />
    
                <Button
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="b15" />
            </TableRow>
    
            <TableRow
                android:id="@+id/tableRow2"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:gravity="center_horizontal" >
    
                <Button
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="b21" />
    
                <Button
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="b22" />
    
                <Button
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="b23" />
    
                <Button
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="b24" />
    
                <Button
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="b25" />
            </TableRow>
    
            <TableRow
                android:id="@+id/tableRow3"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:gravity="center_horizontal" >
    
                <Button
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="b31" />
    
                <Button
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center"
                    android:text="b32" />
    
                <Button
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="b33" />
    
                <Button
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="b34" />
    
                <Button
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="b35" />
            </TableRow>
    
            <TableRow
                android:id="@+id/tableRow4"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:gravity="center_horizontal" >
    
                <Button
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="b41" />
    
                <Button
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="b42" />
    
                <Button
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="b43" />
    
                <Button
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="b44" />
    
                <Button
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="b45" />
            </TableRow>
    
            <TableRow
                android:id="@+id/tableRow5"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:gravity="center_horizontal" >
    
                <Button
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="b51" />
    
                <Button
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="b52" />
    
                <Button
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="b53" />
    
                <Button
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="b54" />
    
                <Button
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="b55" />
            </TableRow>
        </TableLayout>
    
    </RelativeLayout>
    

    Use the above code in an android layout XML file to create your 5x5 button matrix using a TableLayout