CODEWITHSUNDEEP
androidandroid-tablelayout
Chris
Chris

Reputation: 1766

Center Align Table + Buttons

I want this to work on all screen sizes so I don't think using padding is the best way to solve this. I can centre everything when it is in vertical but when it is horizontal nothing seems to align...

<LinearLayout 
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content" 
android:orientation = "horizontal"
android:layout_gravity = "center">

<TableLayout
    android:layout_height = "wrap_content"
    android:layout_width="wrap_content"
    android:gravity = "center" 
    android:layout_gravity="center_horizontal">
    <TableRow 
    android:id="@+id/tableRow1" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content">
        <TextView 
        android:textSize="24.5sp" 
        android:id="@+id/textView1" 
        android:layout_height="wrap_content" 
        android:gravity="center" 
        android:layout_marginBottom="20dip" 
        android:text="Bubb" 
        android:layout_width="wrap_content">
        </TextView>
    </TableRow>
    <TableRow android:baselineAligned="false">
        <Button
        android:id = "@+id/continue_button"
        android:background="@drawable/and_button" 
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:paddingLeft = "@dimen/pad_horizontal"
        android:paddingRight = "@dimen/pad_horizontal"
        android:paddingTop = "@dimen/pad_vertical"
        android:paddingBottom = "@dimen/pad_vertical"
        android:text = "@string/first_label" 
        android:layout_margin="@dimen/margin"/>
    </TableRow>
    <TableRow>
        <Button
        android:id = "@+id/new_button"
        android:text = "@string/second_label" 
        android:background="@drawable/and_button" 
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:paddingLeft = "@dimen/pad_horizontal"
        android:paddingRight = "@dimen/pad_horizontal"
        android:paddingTop = "@dimen/pad_vertical"
        android:paddingBottom = "@dimen/pad_vertical"
        android:layout_margin="@dimen/margin"/>
    </TableRow>
    <TableRow>
        <Button
        android:id = "@+id/about_button"
        android:text = "@string/third_label" 
        android:background="@drawable/and_button" 
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:paddingLeft = "@dimen/pad_horizontal"
        android:paddingRight = "@dimen/pad_horizontal"
        android:paddingTop = "@dimen/pad_vertical"
        android:paddingBottom = "@dimen/pad_vertical"
        android:layout_margin="@dimen/margin"/>
    </TableRow>
    <TableRow>
        <Button
        android:id = "@+id/exit_button"
        android:text = "@string/fourth_label" 
        android:background="@drawable/and_button" 
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:paddingLeft = "@dimen/pad_horizontal"
        android:paddingRight = "@dimen/pad_horizontal"
        android:paddingTop = "@dimen/pad_vertical"
        android:paddingBottom = "@dimen/pad_vertical"
        android:layout_margin="@dimen/margin"/>
    </TableRow> 
    </TableLayout>

</LinearLayout>

Any help is great.

Upvotes: 0

Views: 7783

Answers (2)

Mark Allison
Mark Allison

Reputation: 21909

It's not clear from your question precisely how you want your layout to look, but I'm guessing (from your XML, at least) that you are after something like this:

enter image description here

I don't have your drawables, so can't include those.

If that's the case, then this layout does the trick:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="fill_parent"
    android:layout_height="fill_parent" android:gravity="center">
    <TextView android:text="Bubb" android:layout_width="wrap_content"
        android:layout_height="wrap_content" />
    <Button android:text="Button" android:id="@+id/button1"
        android:layout_width="wrap_content" android:layout_height="wrap_content"></Button>
    <Button android:text="Button" android:id="@+id/button2"
        android:layout_width="wrap_content" android:layout_height="wrap_content"></Button>
    <Button android:text="Button" android:id="@+id/button3"
        android:layout_width="wrap_content" android:layout_height="wrap_content"></Button>
    <Button android:text="Button" android:id="@+id/button4"
        android:layout_width="wrap_content" android:layout_height="wrap_content"></Button>
</LinearLayout>

EDIT: That aligns in a vertical list when switched to landscape:

enter image description here

If you require a horizonal list, simply copy this layout to "res/layout-land" and change the orientation in the outer LinearLayout to "horizontal" :

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="horizontal" android:layout_width="fill_parent"
    android:layout_height="fill_parent" android:gravity="center">

and you'll get this:

enter image description here

Upvotes: 1

Balaji Khadake
Balaji Khadake

Reputation: 3479

Take TableLayout in RelativeLayout and set property of TableLayout as "Layout center in parent=true" or you can use "Layout center horizontal=true" depending on your requirement.

Upvotes: 0

Related Questions