Android: TableLayout Row Not Centering via XML - android

I'm trying to center a table row using XML in Android, but I'm having a problem where it's over to the right just a smidge too much for two of my rows that only contain two buttons. Here's my code, and I have a screen shot of how it looks
<TableLayout
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">
<TableRow
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:gravity="center">
<ImageView
android:id="#+id/hiragana_multiple_choice_main_image"
android:gravity="center"
android:layout_width="fill_parent"
android:layout_height="match_parent"/>
</TableRow>
<TableRow
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:gravity="center"
android:padding="30dp">
<Button
android:id="#+id/hiragana_multiple_choice_button_1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_weight="1" />
<Button
android:id="#+id/hiragana_multiple_choice_button_2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_weight="1" />
</TableRow>
<TableRow
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:padding="30dp"
android:gravity="center">
<Button
android:id="#+id/hiragana_multiple_choice_button_3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_weight="1" />
<Button
android:id="#+id/hiragana_multiple_choice_button_4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_weight="1" />
</TableRow>
</TableLayout>
http://www.ptrprograms.com/multiple_choice_offset.png
Thanks!


try to use LinearLayout instead of tablelayout, it will fix it to center and also use fillparent and wrap content for best practice.


Try these Way....
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="65dp"
android:src="#drawable/ic_launcher" />
<Button
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="#+id/imageView1"
android:layout_marginTop="59dp"
android:layout_toLeftOf="#+id/imageView1"
android:text="Button" />
<Button
android:id="#+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBaseline="#+id/button1"
android:layout_alignBottom="#+id/button1"
android:layout_alignParentRight="true"
android:layout_toRightOf="#+id/imageView1"
android:text="Button" />
<Button
android:id="#+id/button3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignRight="#+id/button1"
android:layout_below="#+id/button1"
android:layout_marginTop="68dp"
android:text="Button" />
<Button
android:id="#+id/button4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBaseline="#+id/button3"
android:layout_alignBottom="#+id/button3"
android:layout_alignLeft="#+id/button2"
android:layout_alignParentRight="true"
android:text="Button" />
</RelativeLayout>

Related

Center buttons in columns with as little nesting as possible

My goal to achieve the following:
center buttons, as if they are in two 50% width columns. I do this with this xml:
<LinearLayout android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<LinearLayout android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center">
<Button android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="412-77"/>
</LinearLayout>
<LinearLayout android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center">
<Button android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="22222"/>
</LinearLayout>
</LinearLayout>
However I think it's too much nesting. My min sdk 2.2, so i can't use grid layout.
How to reduce nesting in xml?

Try This Code...
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/RelativeLayout1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal" >
<Button
android:id="#+id/button3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:text="Button"
android:visibility="invisible" />
<Button
android:id="#+id/Button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBaseline="#+id/button3"
android:layout_alignBottom="#+id/button3"
android:layout_toRightOf="#+id/button3"
android:text="22222" />
<Button
android:id="#+id/Button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBaseline="#+id/button3"
android:layout_alignBottom="#+id/button3"
android:layout_toLeftOf="#+id/button3"
android:text="412-77" />
</RelativeLayout>
Another Way
This Might Be you Looking for

Check this out:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/RelativeLayout1"
android:layout_width="match_parent"
android:layout_height="match_parent"
<Button
android:id="#+id/Button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingLeft="20dp"
android:alignparentLeft="true"
android:text="412-77" />
<Button
android:id="#+id/Button2"
android:layout_width="wrap_content"
android:paddingLeft="40dp"
android:layout_height="wrap_content"
android:layout_toRightOf="#+id/button1"
android:paddingRight="20dp"
android:alignParentRight="true"
android:text="22222" />
</RelativeLayout>

android relative layout issue with button

I have below relative layout:
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="48dp"
android:paddingTop="5dp" >
<View
android:layout_width="match_parent"
android:layout_height="1dip"
android:layout_alignParentTop="true"
android:layout_marginLeft="4dip"
android:layout_marginRight="4dip" />
<View
android:id="#+id/buttonDivider"
android:layout_width="1dip"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginBottom="4dip"
android:layout_marginTop="4dip" />
<Button
android:id="#+id/btnOpen"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_toLeftOf="#id/buttonDivider"
android:text="Open" />
<Button
android:id="#+id/btnDelete"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentTop="true"
android:text="Delete" />
<Button
android:id="#+id/btnClose"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:layout_toRightOf="#id/buttonDivider"
android:text="Close" />
</RelativeLayout>
And it generates button like this:
I tried modifying properties, given enough time but can't get it right :(
How can I make it so three buttons appear in sequence while equally occupying width from parent (currently they are not equally distributed as shown in image):
Open Delete Close
Thanks for the help

Do not use relative layout. The solutions is:
Use a horizontal linear layout for the parent layout.
Set android:weightSum="3" for the linear layout.
For each button set android:layout_width="0dp" and android:layout_weight="1". This will distribute them evenly.

You can simply achieve your requirement using LinearLayout with android:layout_weight attribute as follows...
<LinearLayout
android:layout_width="match_parent"
android:layout_height="48dip"
android:orientation="horizontal"
android:paddingTop="5dp"
android:weightSum="3" >
<Button
android:id="#+id/btnOpen"
android:layout_width="0dip"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Open" />
<Button
android:id="#+id/btnDelete"
android:layout_width="0dip"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Delete" />
<Button
android:id="#+id/btnClose"
android:layout_width="0dip"
android:layout_height="match_parent"
android:layout_weight="1"
android:text="Close" />
</LinearLayout>

<RelativeLayout
android:layout_width="match_parent"
android:layout_height="48dp"
android:paddingTop="5dp" >
<View
android:layout_width="match_parent"
android:layout_height="1dip"
android:layout_alignParentTop="true"
android:layout_marginLeft="4dip"
android:layout_marginRight="4dip" />
<View
android:id="#+id/buttonDivider"
android:layout_width="1dip"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginBottom="4dip"
android:layout_marginTop="4dip" />
<Button
android:id="#+id/btnOpen"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_toLeftOf="#id/buttonDivider"
android:text="Open" />
<Button
android:id="#+id/btnDelete"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_toRightOf="#+id/btnOpen"
android:text="Delete" />
<Button
android:id="#+id/btnClose"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_alignParentBottom="true"
android:layout_toRightOf="#+id/btnDelete"
android:text="Close" />

LinearLayout is much easier to use in such case:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="48dp"
android:paddingTop="5dp">
<Button
android:id="#+id/btnOpen"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Open" />
<Button
android:id="#+id/btnDelete"
android:layout_width="wrap_content"
android:layout_weight="1"
android:layout_height="wrap_content"
android:text="Delete" />
<Button
android:id="#+id/btnClose"
android:layout_weight="1"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:text="Close" />
</LinearLayout>

Change the code with following code.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="48dp"
android:paddingTop="5dp" >
<View
android:layout_width="match_parent"
android:layout_height="1dip"
android:layout_alignParentTop="true"
android:layout_marginLeft="4dip"
android:layout_marginRight="4dip" />
<View
android:id="#+id/buttonDivider"
android:layout_width="1dip"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginBottom="4dip"
android:layout_marginTop="4dip" />
<Button
android:id="#+id/btnOpen"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:text="Open" />
<Button
android:id="#+id/btnDelete"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerInParent="true"
android:text="Delete" />
<Button
android:id="#+id/btnClose"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:text="Close" />
</RelativeLayout>

If you want that to be center horizontal or vertical or both give its respective property to the parent relative layout.
Both Center Vertical or Horizontal- android:layout_centerInParent="true"
Horizontal- android:layout_centerHorizontal="true"
Vertical- android:layout_centerVertical="true"

Try this:
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<LinearLayout
android:layout_width="0dp"
android:gravity="center"
android:layout_height="wrap_content"
android:layout_weight="1" >
<Button
android:id="#+id/btnOpen"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Open" />
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:gravity="center"
android:layout_height="wrap_content"
android:layout_weight="1" >
<Button
android:id="#+id/btnDelete"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Delete" />
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:gravity="center"
android:layout_height="wrap_content"
android:layout_weight="1" >
<Button
android:id="#+id/btnClose"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:text="Close" />
</LinearLayout>
</LinearLayout>

Arranging elements in a Relative Layout

I have been trying to find the best way to do this for a while. What I want is something like this:
With the code:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true" >
<Button
android:id="#+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="0.5"
android:text="Button" />
<Button
android:id="#+id/button3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="0.5"
android:text="Button" />
</LinearLayout>
<ProgressBar
android:id="#+id/progressBar1"
style="?android:attr/progressBarStyleLarge"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true" />
<Button
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/progressBar1"
android:layout_centerHorizontal="true"
android:layout_marginTop="50dp"
android:text="Button" />
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="49dp"
android:text="Large Text"
android:textAppearance="?android:attr/textAppearanceLarge" />
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="#+id/progressBar1"
android:layout_centerHorizontal="true"
android:layout_marginBottom="52dp"
android:text="TextView" />
I've got this layout:
The problem here is the margins are fixed amount of dpi. I'd like to get some sort of fluidity to this.
The way I would like this:
Space above progress bar is separated in 3 equal parts, above the
first text, between the 1st and the 2nd texts and between the second
text and progress bar
Indeterminate progress bar - centered in the middle both vertically and horizontally.
Space below progress bar is separated in 2 equal parts - between the progress bar and the button and between the button and the bottom
linear-layout.
Is there a way to do this relatively? I'd prefer doing it in a layout
file, but I could also go for programming and spacing programmaticaly.

Here is a rough layout with RelativeLayout:
<RelativeLayout>
<TextView
android:id="#+id/textView1"
android:layout_above="#+id/textView2" />
<TextView
android:id="#+id/textView2"
android:layout_above="#+id/progressBar1" />
<ProgressBar
android:id="#+id/progressBar1" />
<Button
android:id="#+id/button1"
android:layout_below="#+id/progressBar1" />
<TableRow
android:layout_below="#+id/button1"
android:weightSum="1.0">
<Button
android:layout_weight="0.5" />
<Button
android:layout_weight="0.5" />
</TableRow>
</RelativeLayout>
NOTE: With reference to ProgressBar in center you can arrange the upper and bottom layout.

<?xml version="1.0" encoding="utf-8"?>
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight="1"
android:gravity="center"
android:text="Large Text"
android:textAppearance="?android:attr/textAppearanceLarge" />
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight="1"
android:gravity="center"
android:text="TextView" />
<LinearLayout
android:id="#+id/pb"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:gravity="center" >
<ProgressBar
android:id="#+id/progressBar1"
style="?android:attr/progressBarStyleLarge"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
<LinearLayout
android:id="#+id/b1"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:gravity="center" >
<Button
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button" />
</LinearLayout>
<LinearLayout
android:id="#+id/b2"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:gravity="center" >
<Button
android:id="#+id/button2"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Button" />
<Button
android:id="#+id/button3"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Button" />
</LinearLayout>

You could try this:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<LinearLayout
android:id="#+id/btn_bar"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true" >
<Button
android:id="#+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="0.5"
android:text="Button" />
<Button
android:id="#+id/button3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="0.5"
android:text="Button" />
</LinearLayout>
<ProgressBar
android:id="#+id/progressBar1"
style="?android:attr/progressBarStyleLarge"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true" />
<RelativeLayout
android:id="#+id/btn_wrapper"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_above="#id/btn_bar"
android:layout_below="#id/progressBar1" >
<Button
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:text="Button" />
</RelativeLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_above="#id/progressBar1"
android:layout_alignParentTop="true"
android:gravity="center_horizontal"
android:orientation="vertical" >
<View
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight="1" />
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="0"
android:text="Large Text"
android:textAppearance="?android:attr/textAppearanceLarge" />
<View
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight="1" />
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="0"
android:text="TextView" />
<View
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight="1" />
</LinearLayout>
</RelativeLayout>

Layout implementation

I wanted to design a UI like this,
But i am unable to add those buttons at the bottom and i am not getting how to bring textview in centre.
Here is my code.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<ImageView
android:id="#+id/poster"
android:layout_width="130dp"
android:layout_height="158dp"
android:scaleType="center"
android:src="#drawable/ic_launcher" />
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="158dp"
android:orientation="vertical" >
<TextView
android:layout_height="wrap_content"
android:id="#+id/titleTextView"
android:text="TextView"
android:layout_width="fill_parent"
android:gravity="center"
android:layout_gravity="center"
android:layout_centerInParent="true"
></TextView>
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="button1"
android:id="#+id/button1button"></Button>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="button2"
android:id="#+id/button1button2"></Button>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="button3"
android:id="#+id/button1button3"></Button>
</LinearLayout>
Here how the output looks.please help me what is the changes to be done in my code

Convert your parent layout to RelativeLayout and start alligning other views relative to each other inside. It will help you to assign views wherever you want on screen regardless of its size.

may be this will help you, try it
<LinearLayout android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<TableLayout
android:id="#+id/tblLayout"
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<TableRow
android:id="#+id/tblLayout_tableRow1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center" >
<TableLayout
android:id="#+id/tblLayout_tableRow1_tbllayout1"
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<TableRow
android:id="#+id/tblLayout_tableRow1_tbllayout1_tableRow1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center" >
<TextView
android:id="#+id/tblLayout_tableRow1_tbllayout1_tableRow1_txtviewspace"
android:layout_width="150px"
android:layout_height="20px" />
</TableRow>
<TableRow
android:id="#+id/tblLayout_tableRow1_tbllayout1_tableRow2"
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<TextView
android:id="#+id/tblLayout_tableRow1_tbllayout1_tableRow2_tbltxtviewspace"
android:layout_width="30px"
android:layout_height="40px" />
</TableRow>
</TableLayout>
</TableRow>
<TableRow
android:id="#+id/tblLayout_tableRow2"
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<TableLayout
android:id="#+id/tblLayout_tableRow2_tblLayout1_tableRow2_tblLayout1"
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<TableRow
android:id="#+id/tblLayout_tableRow2_tblLayout1_tableRow2_tblLayout1_tableRow2"
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<ImageView
android:id="#+id/poster"
android:layout_width="130dp"
android:layout_height="158dp"
android:scaleType="center"
android:src="#drawable/ic_launcher" />
</TableRow>
</TableLayout>
</TableRow>
<TableRow
android:id="#+id/tblLayout_tableRow3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center" >
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="button1"
android:id="#+id/button1button"></Button>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="button2"
android:id="#+id/button1button2"></Button>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="button3"
android:id="#+id/button1button3"></Button>
</TableRow>
</TableLayout>
</LinearLayout>

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<TextView android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:layout_marginTop="10dp"
android:text="Dummy text" />
<ImageView android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="#+id/textView1"
android:layout_marginTop="36dp"
android:src="#drawable/chilly" />
<TextView android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:layout_marginRight="76dp"
android:text="Dummy Text" />
<Button android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_marginLeft="202dp"
android:text="Button3" />
<Button android:id="#+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_marginLeft="88dp"
android:text="Button2" />
<Button android:id="#+id/button3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_toRightOf="#+id/button1"
android:text="Button1" />

How to manage Layout In android

I had just started working on android. Actually I had created a calculator application.
The problem I have faced is to manage the layout. I have two rows of buttons. In each row are 4 buttons. When I run the application the space between the first row and the second row is quite large. So can anyone tell me how can I decrease the space between these two rows?
The code I have written:
<?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">
<LinearLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1">
<TextView
android:id="#+id/label"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="Calculator Application"/>
<EditText
android:id="#+id/entry"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#android:drawable/editbox_background"
android:layout_below="#id/label"/>
<LinearLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1">
<LinearLayout
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1">
<Button
android:id="#+id/one"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_marginLeft="10dip"
android:text="1" />
<Button
android:id="#+id/two"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_marginLeft="10dip"
android:text="2" />
<Button
android:id="#+id/three"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_marginLeft="10dip"
android:text="3" />
<Button
android:id="#+id/plus"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_marginLeft="10dip"
android:text="+" />
</LinearLayout>
</LinearLayout>
<LinearLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1">
<LinearLayout
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1">
<Button
android:id="#+id/four"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_marginLeft="10dip"
android:text="4" />
<Button
android:id="#+id/five"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_marginLeft="10dip"
android:text="5" />
<Button
android:id="#+id/six"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_marginLeft="10dip"
android:text="6" />
<Button
android:id="#+id/minus"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_marginLeft="10dip"
android:text="-" />
</LinearLayout>
</LinearLayout>
<LinearLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1">
<LinearLayout
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1">
<Button
android:id="#+id/seven"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_marginLeft="10dip"
android:text="7" />
<Button
android:id="#+id/eight"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_marginLeft="10dip"
android:text="8" />
<Button
android:id="#+id/nine"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_marginLeft="10dip"
android:text="9" />
<Button
android:id="#+id/multiply"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_marginLeft="10dip"
android:text="*" />
</LinearLayout>
</LinearLayout>
<LinearLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1">
<LinearLayout
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1">
<Button
android:id="#+id/zero"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_marginLeft="10dip"
android:text="0" />
<Button
android:id="#+id/clr"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_marginLeft="10dip"
android:text="c" />
<Button
android:id="#+id/equal"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_marginLeft="10dip"
android:text="=" />
<Button
android:id="#+id/divide"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_marginLeft="10dip"
android:text="/" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
</LinearLayout>
Regards
Anshuman

Replace all of the
android:layout_height="fill_parent" calls to
android:layout_height="wrap_content"
(apart from the parent layout, which should be fill_parent)
I have verified that this works.
EDIT: To make the buttons fill the screen horizontally, (and all be equally sized), add this to each button:
android:layout_width="0dp"
android:layout_weight="1"

the better way is u can use grid layout.try this links
http://www.edumobile.org/android/android-beginner-tutorials/draw-menu-in-grid-view/
http://www.firstdroid.com/2011/02/06/android-tutorial-gridview-with-icon-and-text/

As CaspNZ suggested use android:layout_height="wrap_content" also using top padding may help.

Categories

Resources