5

I have 2 ImageButons like this

enter image description here

I have tried everything to make it align properly in center of screen. As being new to android i don't have any other clues of what to do. How can i achieve my goal of aligning these 2 Imagebuttons in center of screen

This is my layout xml

<TableLayout android:id="@+id/TableLayout01"
        android:layout_width="fill_parent" android:layout_height="wrap_content"
        android:stretchColumns="1">
        <TableRow android:id="@+id/TableRow01" android:layout_width="fill_parent"
            android:layout_height="wrap_content">

            <ImageButton android:id="@+id/btn_Show"
                android:layout_width="wrap_content" android:layout_height="wrap_content"
                android:text="Show" android:src="@drawable/cmd_result_show"
                android:layout_gravity="right" android:background="@android:color/transparent" />

            <ImageButton android:id="@+id/btn_showAll"
                android:layout_width="wrap_content" android:layout_height="wrap_content"
                android:text="Detailed Show" android:layout_gravity="center"
                android:src="@drawable/cmd_result_details" android:background="@android:color/transparent" />
        </TableRow>
    </TableLayout>
David
  • 15,894
  • 22
  • 55
  • 66
Sarfarosh Lakhan
  • 53
  • 1
  • 1
  • 5
  • Please add comments for which one worked for you, or u have any issues...Also accept the right answer. – Anju Mar 16 '11 at 05:56

3 Answers3

7

I hope you have images for these buttons directly. So this setting text attribute is of no use. Use RelativeLayout for easy development of these kind of screens.

Below I have attached the code. Please have a look and add comment if there is any issues.

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent" android:layout_height="fill_parent"
    android:gravity="center_horizontal">

    <ImageButton android:id="@+id/btn_Show"
        android:layout_width="wrap_content" android:layout_height="wrap_content"
        android:background="@drawable/cmd_result_show" />

    <ImageButton android:id="@+id/btn_showAll"
        android:layout_toRightOf="@id/btn_Show" android:layout_width="wrap_content"
        android:layout_height="wrap_content" android:background="@drawable/cmd_result_details" />
</RelativeLayout>
Anju
  • 9,379
  • 14
  • 55
  • 94
  • Thanks..worked perfectly. I added a blank TextView in between to give some gap between those imagebutton. Thanks – Sarfarosh Lakhan Mar 16 '11 at 06:01
  • 2
    if you want to add space, no need to add a textview for that...add margin attribute...that will be enough. For ur first button give something like android:layout_marginRight="30dp"...it will add margins and hence spacing will get increased... – Anju Mar 16 '11 at 06:06
0
    <?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"
    android:gravity="center">
  <TableLayout android:id="@+id/TableLayout01"
    android:stretchColumns="1" android:layout_height="wrap_content"
    android:layout_width="wrap_content" >
    <TableRow android:id="@+id/TableRow01" android:layout_width="wrap_content"
        android:layout_height="wrap_content" >
        <ImageButton android:id="@+id/btn_Show"
            android:layout_width="wrap_content" android:layout_height="wrap_content"
            android:text="Show" android:src="@drawable/cmd_result_show"
            android:layout_gravity="right" android:background="@android:color/transparent" />
        <ImageButton android:id="@+id/btn_showAll"
            android:layout_width="wrap_content" android:layout_height="wrap_content"
            android:text="Detailed Show" android:layout_gravity="center"
            android:src="@drawable/cmd_result_details" android:background="@android:color/transparent" />
    </TableRow>
</TableLayout>

Enjoy!!

Harshad
  • 7,904
  • 3
  • 24
  • 42
0

You have put the ImageButtons inside the tablerow. The tablerow will always occupy the first layer of the screen. Do you want the buttons to be centre aligned but at the top position?

Shaista Naaz
  • 8,281
  • 9
  • 37
  • 50