Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Android: how to center view within column of TableLayout?

I am trying to create a TabeLayout with a grid of CheckBoxes. Across the top are 2 headers, and each additional row consists of a label and 2 CheckBoxes. I would like the table to fill all available space, the first column to be oriented to the left, and the CheckBoxes and their headers to be centered within their columns. In the below layout, the headers appear centered properly, but the CheckBoxes are not. I added a background color to one of the CheckBoxes, this demonstrates that the CheckBox actually grew to fill its column (which is why it won't center as desired); despite the "wrap_content" layout param.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="center_horizontal"
    android:orientation="vertical">
    <TableLayout 
        android:stretchColumns="1,2"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent">

        <TableRow>
            <TextView 
                android:text="" 
                android:gravity="center_horizontal"
                android:layout_width="wrap_content" 
                android:layout_height="wrap_content">
            </TextView>
            <TextView 
                android:text="First category" 
                android:gravity="center_horizontal"
                android:layout_width="wrap_content" 
                android:layout_height="wrap_content">
            </TextView>
            <TextView 
                android:text="2nd category" 
                android:gravity="center_horizontal"
                android:layout_width="wrap_content" 
                android:layout_height="wrap_content">
            </TextView>
        </TableRow>
        <TableRow>
            <TextView 
                android:text="Row 1: " 
                android:layout_width="wrap_content" 
                android:layout_height="wrap_content">
            </TextView>
            <CheckBox
                android:background="#FF001122"
                android:layout_height="50dip"
                android:layout_width="wrap_content" 
                android:gravity="center_horizontal">
            </CheckBox>
            <CheckBox
                android:layout_height="50dip"
                android:layout_width="wrap_content" 
                android:gravity="center_horizontal">
            </CheckBox>
        </TableRow>
    </TableLayout>
</LinearLayout>

enter image description here

like image 679
ab11 Avatar asked Apr 01 '11 15:04

ab11


People also ask

How do I center a view in XML?

You can apply a centering to any View, including a Layout, by using the XML attribute android:layout_gravity". You probably want to give it the value "center".

How do I center Textview in TableRow android?

give android:gravity="center" to TableRow . Works like charm!

Which layout Aligns each child View in either a vertical or a horizontal Line?

LinearLayout is a view group that aligns all children in a single direction, vertically or horizontally. You can specify the layout direction with the android:orientation attribute.

What is a Table layout in android?

TableLayout is a ViewGroup that displays child View elements in rows and columns. Note: For better performance and tooling support, you should instead build your layout with ConstraintLayout. TableLayout positions its children into rows and columns.


1 Answers

On the CheckBox, instead of setting android:gravity="center_horizontal", you want to set android:layout_gravity="center_horizontal"

android:gravity controls how the view lays out its contents inside its own container, and since you have the width set to "wrap_content", there is no void space for the CheckBox to center itself inside of.

android:layout_weight tells the parent view (in this case the TableRow) how to position the child, so it will center the CheckBox inside the table cell.

like image 77
Brian Cooley Avatar answered Oct 05 '22 06:10

Brian Cooley