put button in one line with same space between all button - android

i want to put five button in bottom but all button should be with same space means
below is image
Here you can see that second and third image is not in center below is my code i know that i have put padding but still my problem is not solving, i have tried using linearlayout also in that i have done by using weight=1 and width =0 but button is stretching
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:ads="http://schemas.android.com/apk/lib/com.google.ads"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<ImageView
android:id="#+id/wall"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:drawingCacheQuality="high"
android:scaleType="fitXY" />
<Button
android:id="#+id/butRight"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:layout_marginRight="10dp"
android:background="#drawable/check_right" />
<Button
android:id="#+id/butfav"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:background="#drawable/fvrt1" />
<Button
android:id="#+id/butLeft"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_marginLeft="10dp"
android:background="#drawable/check_left" />
<Button
android:id="#+id/butSetWallpaper"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_marginLeft="39dp"
android:layout_toRightOf="#+id/butLeft"
android:background="#drawable/chek_wallpaper" />
<Button
android:id="#+id/butSetRingTone"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_marginRight="36dp"
android:layout_toLeftOf="#+id/butRight"
android:background="#drawable/check_ringtone" />
can anybody help me?


I always use LinearLayout to achieve this and instead Buttons I'm using ImageView.


I have tried below code it's worked for me try this, just replace with your RelativeLayout
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="50dp"
android:layout_alignParentBottom="true" >
<ImageView
android:id="#+id/butLeft"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/check_left" />
<View
android:id="#+id/butOne"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:src="#drawable/check_right" />
<ImageView
android:id="#+id/butSetWallpaper"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/chek_wallpaper" />
<View
android:id="#+id/butTwo"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:src="#drawable/check_right" />
<ImageView
android:id="#+id/butfav"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/fvrt1" />
<View
android:id="#+id/butThree"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:src="#drawable/check_right" />
<ImageView
android:id="#+id/butSetRingTone"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/check_ringtone" />
<View
android:id="#+id/butFour"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:src="#drawable/check_right" />
<ImageView
android:id="#+id/butRight"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/check_right" />
</LinearLayout>
out put will be generated as you wish


Its a bit dirty solution but It'll work :
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal" >
<LinearLayout
android:id="#+id/aaaa"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:orientation="vertical" >
<Button
android:id="#+id/butRight"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/ic_launcher"
android:gravity="center"
android:minWidth="48dp" />
</LinearLayout>
<LinearLayout
android:id="#+id/bbbb"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:orientation="vertical" >
<Button
android:id="#+id/butfav"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/ic_launcher"
android:gravity="center"
android:minWidth="48dp" />
</LinearLayout>
<LinearLayout
android:id="#+id/cccc"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:minWidth="48dp"
android:orientation="vertical" >
<Button
android:id="#+id/butLeft"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/ic_launcher"
android:gravity="center"
android:minWidth="48dp" />
</LinearLayout>
<LinearLayout
android:id="#+id/ddd"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:orientation="vertical" >
<Button
android:id="#+id/butSetWallpaper"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/ic_launcher"
android:gravity="center"
android:minWidth="48dp" />
</LinearLayout>
<LinearLayout
android:id="#+id/gggg"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:orientation="vertical" >
<Button
android:id="#+id/butSetRingTone"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/ic_launcher"
android:minWidth="48dp" />
</LinearLayout>
</LinearLayout>


Wrap the buttons in a LinearLayout and put spacings between each button (i also added one at the beginning and one after the last one, remove them if you don't want it).
assign a layout_weight for each spacing, don't set a weightSum on the LinearLayout.
Enjoy.
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:ads="http://schemas.android.com/apk/lib/com.google.ads"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<ImageView
android:id="#+id/wall"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:drawingCacheQuality="high"
android:scaleType="fitXY" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal" >
<!-- this is for the spacing -->
<View
android:layout_width="0px"
android:layout_height="match_parent"
android:layout_weight="1" />
<Button
android:id="#+id/butRight"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/check_right" />
<!-- this is for the spacing -->
<View
android:layout_width="0px"
android:layout_height="match_parent"
android:layout_weight="1" />
<Button
android:id="#+id/butfav"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/fvrt1" />
<!-- this is for the spacing -->
<View
android:layout_width="0px"
android:layout_height="match_parent"
android:layout_weight="1" />
<Button
android:id="#+id/butLeft"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/check_left" />
<!-- this is for the spacing -->
<View
android:layout_width="0px"
android:layout_height="match_parent"
android:layout_weight="1" />
<Button
android:id="#+id/butSetWallpaper"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/chek_wallpaper" />
<!-- this is for the spacing -->
<View
android:layout_width="0px"
android:layout_height="match_parent"
android:layout_weight="1" />
<Button
android:id="#+id/butSetRingTone"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/check_ringtone" />
<!-- this is for the spacing -->
<View
android:layout_width="0px"
android:layout_height="match_parent"
android:layout_weight="1" />
</LinearLayout>
</FrameLayout>


Why all of you doing trick with code. In android coding there is option available to give space between item.
<Space
android:id="#+id/space1"
android:layout_below="#+id/textView1"
android:layout_width="fill_parent"
android:layout_height="40dp"
/>
Just use this whenever you want. simple. hope this will help you.

Related

Layout issue in high resolution device android

I want to make below listview row file
So I have set layout row file code as below
<?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">
<RelativeLayout
android:id="#+id/rel_items"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="#dimen/margin_5dp"
android:background="#drawable/rect_white">
<LinearLayout
android:id="#+id/ll_main"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:weightSum="100">
<LinearLayout
android:id="#+id/ll_left"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="70">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<CheckBox
android:id="#+id/ckh"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_marginLeft="#dimen/margin_5dp" />
<customtext.BoldText
android:id="#+id/task_title"
style="#style/NormalTextView"
android:layout_marginLeft="#dimen/margin_2dp"
android:layout_marginRight="#dimen/margin_5dp"
android:layout_marginTop="#dimen/margin_10dp"
android:layout_toRightOf="#+id/ckh"
android:singleLine="false"
android:text="Title"
android:textColor="#android:color/black"
android:textSize="#dimen/text_11" />
<customtext.RegularText
android:id="#+id/task_assign"
style="#style/NormalTextView"
android:layout_alignLeft="#+id/task_title"
android:layout_below="#+id/task_title"
android:layout_marginTop="#dimen/margin_2dp"
android:layout_toRightOf="#+id/ckh"
android:background="#drawable/rect_full"
android:padding="#dimen/margin_2dp"
android:text="Title"
android:textColor="#android:color/white"
android:textSize="#dimen/text_8" />
<customtext.RegularText
android:id="#+id/task_date"
style="#style/NormalTextView"
android:layout_alignLeft="#+id/task_assign"
android:layout_below="#+id/task_assign"
android:paddingBottom="#dimen/margin_5dp"
android:text="Title"
android:layout_marginTop="#dimen/margin_2dp"
android:textColor="#color/dark_gray"
android:textSize="#dimen/text_10" />
</RelativeLayout>
</LinearLayout>
<LinearLayout
android:id="#+id/ll_right"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_marginBottom="1.5dp"
android:layout_marginRight="1.5dp"
android:layout_marginTop="1.5dp"
android:layout_weight="30"
android:background="#drawable/rect_task_edit_delete"
android:gravity="center|right">
<ImageView
android:id="#+id/img_edit"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="#dimen/margin_20dp"
android:src="#drawable/edit" />
<ImageView
android:id="#+id/img_delete"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="#dimen/margin_10dp"
android:src="#drawable/delete" />
</LinearLayout>
</LinearLayout>
</RelativeLayout>
</RelativeLayout>
When I run this in normal device like 480x800 than it will give output like below image
And when I run this in high resolution device like 1080x1920 with (320dpi)(Sony xperia z Ultra) at that time i give below output
So any idea how can I maintain this layout in very high resolution devices?

I have updated your code with images and variables in one of my projects. I recommend you to change the LinearLayout with the weight sum of 100 to a relative layout and put the item you want to fix the size to align parent right. Here is an example which work. You can fix the relativelayout root height. Hope it help
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<RelativeLayout
android:id="#+id/rel_items"
android:layout_width="match_parent"
android:layout_height="80dp"
android:layout_margin="5dp"
android:background="#android:color/white">
<RelativeLayout
android:id="#+id/ll_main"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:id="#+id/ll_right"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_marginBottom="1.5dp"
android:layout_marginRight="1.5dp"
android:layout_alignParentRight="true"
android:padding="10dp"
android:layout_marginTop="1.5dp"
android:background="#drawable/button_connexion"
android:gravity="center|right">
<ImageView
android:id="#+id/img_edit"
android:layout_width="20dp"
android:layout_height="20dp"
android:layout_marginRight="20dp"
android:src="#drawable/statut_presence_jaune" />
<ImageView
android:id="#+id/img_delete"
android:layout_width="20dp"
android:layout_height="20dp"
android:src="#drawable/statut_presence_vert" />
</LinearLayout>
<LinearLayout
android:id="#+id/ll_left"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<CheckBox
android:id="#+id/ckh"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_marginLeft="5dp" />
<TextView
android:id="#+id/task_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="2dp"
android:layout_marginRight="5dp"
android:layout_marginTop="20dp"
android:layout_toRightOf="#+id/ckh"
android:singleLine="false"
android:text="Title"
android:textColor="#android:color/black"
android:textSize="11sp" />
<TextView
android:id="#+id/task_assign"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/task_title"
android:layout_below="#+id/task_title"
android:layout_marginTop="2dp"
android:layout_toRightOf="#+id/ckh"
android:background="#android:color/holo_blue_bright"
android:padding="2dp"
android:text="Title"
android:textColor="#android:color/white"
android:textSize="8sp" />
<TextView
android:id="#+id/task_date"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/task_assign"
android:layout_below="#+id/task_assign"
android:paddingBottom="5dp"
android:text="Title"
android:layout_marginTop="2dp"
android:textColor="#android:color/darker_gray"
android:textSize="10sp" />
</RelativeLayout>
</LinearLayout>
</RelativeLayout>
</RelativeLayout>

change weight for your view with id
android:id="#+id/ll_left"
to 1. And delete your view with id
android:id="#+id/ll_right"
and replace it with following line of code:
<LinearLayout
android:id="#+id/ll_img_edit"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_margin="2dp"
android:background="#drawable/rect_task_edit_delete"
android:gravity="center">
<ImageView
android:id="#+id/img_edit"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/edit" />
</LinearLayout>
<LinearLayout
android:id="#+id/ll_img_delete"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_margin="2dp"
android:background="#drawable/rect_task_edit_delete"
android:gravity="center">
<ImageView
android:id="#+id/img_delete"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/delete" />
</LinearLayout>
in this you can change margin value as per your requirement.

In your LinearLayout which contains Imageviews delete and edit.You have specified right margin to them remove that and weight sum here.

Just change your second layout by below,
<LinearLayout
android:id="#+id/ll_right"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_marginBottom="1.5dp"
android:layout_marginRight="1.5dp"
android:layout_marginTop="1.5dp"
android:layout_weight="30"
android:background="#android:color/transparent"
android:gravity="center|right">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:background="#drawable/rect_task_edit_delete"
android:gravity="center|right">
<ImageView
android:id="#+id/img_edit"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="#dimen/margin_20dp"
android:src="#drawable/edit" />
<ImageView
android:id="#+id/img_delete"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="#dimen/margin_10dp"
android:src="#drawable/delete" />
</LinearLayout>
</LinearLayout>

Use weightSum property with second Layout.
<LinearLayout
android:id="#+id/ll_right"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_marginBottom="1.5dp"
android:weighSum = "1"
android:layout_marginRight="1.5dp"
android:layout_marginTop="1.5dp"
android:layout_weight="30"
android:background="#drawable/rect_task_edit_delete"
android:gravity="center|right">
<ImageView
android:id="#+id/img_edit"
android:layout_width="0dp"
android:layout_weight="0.5"
android:layout_height="wrap_content"
android:layout_marginRight="#dimen/margin_20dp"
android:src="#drawable/edit" />
<ImageView
android:id="#+id/img_delete"
android:layout_weight="0.5"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginRight="#dimen/margin_10dp"
android:src="#drawable/delete" />
</LinearLayout>

just add both ImageView weight property like below way. So it will take equal width to both ImageView.
<ImageView
android:id="#+id/img_edit"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="#dimen/margin_20dp"
android:src="#drawable/edit"
android:layout_weight="1" />
<ImageView
android:id="#+id/img_delete"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="#dimen/margin_10dp"
android:src="#drawable/delete"
android:layout_weight="1" />
</LinearLayout>

instead of this
<LinearLayout
android:id="#+id/ll_right"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_marginBottom="1.5dp"
android:layout_marginRight="1.5dp"
android:layout_marginTop="1.5dp"
android:layout_weight="30"
android:background="#drawable/rect_task_edit_delete"
android:gravity="center|right">
<ImageView
android:id="#+id/img_edit"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="#dimen/margin_20dp"
android:src="#drawable/edit" />
<ImageView
android:id="#+id/img_delete"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="#dimen/margin_10dp"
android:src="#drawable/delete" />
</LinearLayout>
use this for the image Linear layout your problem will be solved...
<LinearLayout
android:id="#+id/ll_right"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_marginBottom="1.5dp"
android:layout_marginRight="1.5dp"
android:layout_marginTop="1.5dp"
android:layout_weight="30"
android:background="#drawable/rect_task_edit_delete"
android:gravity="center|right">
<ImageView
android:id="#+id/img_edit"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:layout_marginRight="#dimen/margin_20dp"
android:src="#drawable/edit" />
<ImageView
android:id="#+id/img_delete"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:layout_marginRight="#dimen/margin_10dp"
android:src="#drawable/delete" />
</LinearLayout>
Note:-This issue due to you make it imageView wrap-content and Linear Layout with weight so Linear layout adjust due to its weight But imageView is wrap content.So it vary device to device .....

why is my relativeLayout doesn't appear below its sibling linearLayout?

I have the following xml
<?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="wrap_content"
android:background="#color/blue_bg">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:orientation="vertical" >
<com.my.view.text.MyTextView
android:id="#+id/whyResgisterHeaderText"
style="#style/textOnBg"
android:layout_marginTop="25dp"
android:text="WHY REGISTER?"
android:textStyle="bold" />
<com.my.view.text.MyTextView
android:id="#+id/whyResgisterBodyText"
style="#style/textOnBg"
android:text="Help us keep your account safe"
android:textStyle="normal" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="10dp"
android:layout_marginTop="5dp"
android:src="#drawable/signup_illu_why" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center" >
<Button
android:id="#+id/gotItButton"
android:layout_width="250dp"
android:layout_height="50dp"
android:layout_gravity="center"
android:layout_marginTop="5dp"
android:background="#drawable/btn_selector"
android:padding="0dp" />
<com.my.view.text.MyTextView
android:id="#+id/gotItText"
style="#style/textOnBg"
android:layout_marginTop="25dp"
android:text="Got it"
android:textColor="#00bcfe"
android:textSize="16dp"
android:textStyle="italic" />
</RelativeLayout>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:orientation="vertical" >
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="#70a5b3" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<com.my.view.text.MyTextView
style="#style/textOnBg"
android:layout_toLeftOf="#+id/skipIcon"
android:text="Skip"
android:textStyle="normal" />
<ImageView
android:id="#id/skipIcon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:src="#drawable/signup_skip_icon" />
</RelativeLayout>
</LinearLayout>
</RelativeLayout>
I want my screen to look like:
but it looks like:
1) why cannot I see the fotter relativeLayout (with the "skip")
2) how can I center the gotItText textView? why isn't it center with current properties?

Because your root layout is a RelativeLayout.
You should declare an ID for the first LinearLayout, and then use layout_below property on the second one. Remember, their positions are relatives so if you don't specify the location of the second Linear, it will be paint over the first one.
If you want to get one linear below the other automatically use a LinearLayout as main root.

Edited you code, replaced the custom EditTexts, and removed the styles, set new heights to the layout and it seems to be working as you want.
<?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="wrap_content">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:orientation="vertical" >
<TextView
android:id="#+id/whyResgisterHeaderText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="25dp"
android:text="WHY REGISTER?"
android:textStyle="bold" />
<TextView
android:id="#+id/whyResgisterBodyText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Help us keep your account safe"
android:textStyle="normal" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="10dp"
android:layout_marginTop="5dp" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center" >
<Button
android:id="#+id/gotItButton"
android:layout_width="250dp"
android:layout_height="50dp"
android:layout_gravity="center"
android:layout_marginTop="5dp"
android:padding="0dp" />
<TextView
android:id="#+id/gotItText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="25dp"
android:text="Got it"
android:textColor="#00bcfe"
android:textSize="16dp"
android:textStyle="italic" />
</RelativeLayout>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:orientation="vertical" >
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="#70a5b3" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toLeftOf="#+id/skipIcon"
android:text="Skip"
android:textStyle="normal" />
<ImageView
android:id="#id/skipIcon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true" />
</RelativeLayout>
</LinearLayout>
</RelativeLayout>

How to center two views within a relative layout?

The task is simple: there are two buttons and a TextView above them. All the widgets shoud be centered within the relative layout. The only one idea I have is create the third widget View and use it as a center axis for the buttons. Any ideas? A redundant layout isn't a good solution.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<TextView
android:id="#+id/tv_progress"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:text="#string/app_name" />
<View
android:id="#+id/view_axis"
android:layout_width="1dp"
android:layout_height="1dp"
android:layout_below="#id/tv_progress"
android:layout_centerInParent="true" />
<Button
android:id="#+id/button_start"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/tv_progress"
android:layout_toLeftOf="#id/view_axis"
android:text="#string/start" />
<Button
android:id="#+id/button_stop"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/tv_progress"
android:layout_toRightOf="#id/view_axis"
android:text="#string/stop" />
</RelativeLayout>

If I understand what you want correctly, you can put the Buttons in a LinearLayout and center that
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<TextView
android:id="#+id/tv_progress"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:text="#string/app_name" />
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_below="#id/tv_progress">
<Button
android:id="#+id/button_start"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/start" />
<Button
android:id="#+id/button_stop"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/stop" />
</LinearLayout>
I'm not sure if that's what you meant by a "redundant layout" but doing this is fine if it gives you what you want.

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<Spinner
android:id="#+id/sp_rooms"
android:layout_toLeftOf="#id/space"
android:layout_centerVertical="true"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<Space
android:id="#+id/space"
android:layout_centerInParent="true"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<Button
android:id="#+id/btn_registration"
android:layout_centerVertical="true"
android:layout_toRightOf="#id/space"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</RelativeLayout>

This will vertically and horizontally center the whole block consisting of the textview + buttons
<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:orientation="vertical"
android:layout_centerInParent="true">
<TextView
android:id="#+id/tv_progress"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/app_name" />
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<Button
android:id="#+id/button_start"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/start" />
<Button
android:id="#+id/button_stop"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/stop" />
</LinearLayout>
</LinearLayout>
</RelativeLayout>

Two Relative Layouts on the one screen

i want to have 2 Relative Layouts on my screen. One below another. I made this code but it doesn't work. In this case i can see only upper Relative Layout insted of both and this layout take whole space although i set wrap_content.
EDIT!: I put below the second code which fails too.
EDIT 2!: I found problem... That's a bit... sad. Problem lie in my theme. I set background to png file which was too big and when i applied default theme via manifest then this happend. When i removed it all is good.
This version fails too.
New code:
<RelativeLayout 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" >
<RelativeLayout
android:id="#+id/some_id"
android:layout_above="#+id/some_id2"
android:layout_alignParentTop="true"
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<Button
android:id="#+id/main_button_localize"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/main_localize" />
</RelativeLayout>
<RelativeLayout
android:id="#id/some_id2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true" >
<ToggleButton
android:id="#+id/main_help"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</RelativeLayout>
</RelativeLayout>
Old code:
<RelativeLayout
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" >
<RelativeLayout
android:id="#+id/maps_manager_menu"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true" >
<!-- Top -->
<Button
android:id="#+id/maps_manager_top_left"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:contentDescription="#string/empty" />
<Button
android:id="#+id/maps_manager_top_middle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/maps_manager_top_left"
android:contentDescription="#string/empty" />
<Button
android:id="#+id/maps_manager_top_right"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/maps_manager_top_middle"
android:contentDescription="#string/empty" />
<!-- Middle -->
<Button
android:id="#+id/maps_manager_middle_left"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/maps_manager_top_left"
android:contentDescription="#string/empty" />
<Button
android:id="#+id/maps_manager_middle_middle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/maps_manager_middle_left"
android:layout_below="#id/maps_manager_top_middle"
android:contentDescription="#string/empty" />
<Button
android:id="#+id/maps_manager_middle_right"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/maps_manager_middle_middle"
android:layout_below="#id/maps_manager_top_right"
android:contentDescription="#string/empty" />
<!-- Bottom -->
<Button
android:id="#+id/maps_manager_bottom_left"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/maps_manager_middle_left"
android:contentDescription="#string/empty" />
<Button
android:id="#+id/maps_manager_bottom_middle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/maps_manager_bottom_left"
android:layout_below="#id/maps_manager_middle_middle"
android:contentDescription="#string/empty" />
<Button
android:id="#+id/maps_manager_bottom_right"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/maps_manager_bottom_middle"
android:layout_below="#id/maps_manager_middle_right"
android:contentDescription="#string/empty" />
</RelativeLayout>
<RelativeLayout
android:id="#+id/maps_manager_controls"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignBottom="true"
android:layout_below="#id/maps_manager_menu" >
<ToggleButton
android:id="#+id/maps_manager_help"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</RelativeLayout>
</RelativeLayout>

Better you take LinearLayout with vertical orientation as Parent for two child RelativeLayouts. If you can put 80:20 height weights for the RelativeLayouts then it would fit to the entire screen.

<ScrollView
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<RelativeLayout
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" >
<RelativeLayout
android:id="#+id/maps_manager_menu"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true" >
<!-- Top -->
<Button
android:id="#+id/maps_manager_top_left"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:contentDescription="#string/empty" />
<Button
android:id="#+id/maps_manager_top_middle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/maps_manager_top_left"
android:contentDescription="#string/empty" />
<Button
android:id="#+id/maps_manager_top_right"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/maps_manager_top_middle"
android:contentDescription="#string/empty" />
<!-- Middle -->
<Button
android:id="#+id/maps_manager_middle_left"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/maps_manager_top_left"
android:contentDescription="#string/empty" />
<Button
android:id="#+id/maps_manager_middle_middle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/maps_manager_middle_left"
android:layout_below="#id/maps_manager_top_middle"
android:contentDescription="#string/empty" />
<Button
android:id="#+id/maps_manager_middle_right"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/maps_manager_middle_middle"
android:layout_below="#id/maps_manager_top_right"
android:contentDescription="#string/empty" />
<!-- Bottom -->
<Button
android:id="#+id/maps_manager_bottom_left"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/maps_manager_middle_left"
android:contentDescription="#string/empty" />
<Button
android:id="#+id/maps_manager_bottom_middle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/maps_manager_bottom_left"
android:layout_below="#id/maps_manager_middle_middle"
android:contentDescription="#string/empty" />
<Button
android:id="#+id/maps_manager_bottom_right"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/maps_manager_bottom_middle"
android:layout_below="#id/maps_manager_middle_right"
android:contentDescription="#string/empty" />
</RelativeLayout>
<RelativeLayout
android:id="#+id/maps_manager_controls"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignBottom="true"
android:layout_below="#id/maps_manager_menu" >
<ToggleButton
android:id="#+id/maps_manager_help"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</RelativeLayout>
</RelativeLayout>
</ScrollView>

<ScrollView 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" >
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<RelativeLayout
android:id="#+id/maps_manager_menu"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true" >
<!-- Top -->
<Button
android:id="#+id/maps_manager_top_left"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:contentDescription="#string/hello_world" />
<Button
android:id="#+id/maps_manager_top_middle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/maps_manager_top_left"
android:contentDescription="#string/hello_world" />
<Button
android:id="#+id/maps_manager_top_right"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/maps_manager_top_middle"
android:contentDescription="#string/hello_world" />
<!-- Middle -->
<Button
android:id="#+id/maps_manager_middle_left"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/maps_manager_top_left"
android:contentDescription="#string/hello_world" />
<Button
android:id="#+id/maps_manager_middle_middle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/maps_manager_middle_left"
android:layout_below="#id/maps_manager_top_middle"
android:contentDescription="#string/hello_world" />
<Button
android:id="#+id/maps_manager_middle_right"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/maps_manager_middle_middle"
android:layout_below="#id/maps_manager_top_right"
android:contentDescription="#string/hello_world" />
<!-- Bottom -->
<Button
android:id="#+id/maps_manager_bottom_left"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/maps_manager_middle_left"
android:contentDescription="#string/hello_world" />
<Button
android:id="#+id/maps_manager_bottom_middle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/maps_manager_bottom_left"
android:layout_below="#id/maps_manager_middle_middle"
android:contentDescription="#string/hello_world" />
<Button
android:id="#+id/maps_manager_bottom_right"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/maps_manager_bottom_middle"
android:layout_below="#id/maps_manager_middle_right"
android:contentDescription="#string/hello_world" />
</RelativeLayout>
<RelativeLayout
android:id="#+id/maps_manager_controls"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/maps_manager_menu" >
<ToggleButton
android:id="#+id/maps_manager_help"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</RelativeLayout>
</RelativeLayout>
</ScrollView>

Follow the following steps:
Add ID to topmost relative layout say: android:id="#+id/rtvlt_first"
In second RelativeLayout remove alignparenttop property.
Add android:tobottomof="#id/rtvlt_first"...
Try this....
Good Luck!

Android + Which layout would you suggest?

I'm laying out a row for use in a ListView and I need a little help. The row will look like this:
Below is what I have so far, the highlight bg is not showing up and the text won't align center (sticks to the top).
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/rl0"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:padding="0dp"
android:layout_margin="0dp"
android:background="#color/grey">
<!-- shine -->
<LinearLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<ImageView
android:id="#+id/imgShine"
android:background="#color/shine"
android:layout_height="0dp"
android:layout_width="fill_parent"
android:layout_weight="1" />
<View
android:layout_height="0dp"
android:layout_width="fill_parent"
android:layout_weight="1" />
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="horizontal"
android:id="#+id/ll"
android:layout_gravity="center_vertical">
<!-- cal graphic -->
<RelativeLayout
android:id="#+id/rl1"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:padding="10dp">
<!-- cal bg -->
<ImageView
android:id="#+id/imageView1"
android:src="#drawable/cal"
android:layout_width="60dp"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:scaleType="fitCenter"
android:layout_centerVertical="true"
android:layout_alignParentLeft="true" />
<!-- month -->
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/tvMonth"
android:textSize="11sp"
android:layout_marginLeft="11dp"
android:layout_marginTop="10dp"
android:textColor="#drawable/list_cal_selector" />
<!-- day -->
<TextView
android:id="#+id/tvDay"
android:textSize="23sp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/tvMonth"
android:layout_marginTop="2dp"
android:layout_centerHorizontal="true"
android:textColor="#drawable/list_cal_selector" />
</RelativeLayout>
<!-- text and button graphic -->
<RelativeLayout
android:id="#+id/rl2"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:gravity="center_vertical"
android:layout_gravity="center_vertical">
<!-- team name -->
<TextView
android:id="#+id/tvTeam"
android:textSize="23dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingBottom="0dp"
android:textColor="#drawable/list_text_selector" />
<TextView
android:id="#+id/tvTime"
android:textSize="12sp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/tvTeam"
android:textColor="#drawable/list_text_selector" />
<TextView
android:id="#+id/tvStation"
android:textSize="12sp"
android:paddingLeft="12dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/tvTeam"
android:layout_toRightOf="#+id/tvTime"
android:textColor="#drawable/list_text_selector" />
<!-- add button -->
<ImageView
android:id="#+id/imgAddBtn"
android:src="#drawable/btn"
android:layout_height="wrap_content"
android:layout_width="60dp"
android:scaleType="fitCenter"
android:layout_centerVertical="true"
android:adjustViewBounds="true"
android:layout_alignParentRight="true"
android:padding="10dp" />
<!-- divider -->
<ImageView
android:id="#+id/imgDivider"
android:src="#drawable/divider"
android:layout_height="fill_parent"
android:layout_width="2dp"
android:layout_toLeftOf="#id/imgAddBtn"
android:cropToPadding="false" />
</RelativeLayout>
</LinearLayout>
</FrameLayout>

I would use just one RelativeLayout. It will avoid the use of various Layouts and
its easier to place componentes on screen.
edit: This solution works, but I don't know if it's the best:
<?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="match_parent"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_alignParentBottom="true"
android:orientation="vertical" >
<View
android:layout_width="1dp"
android:layout_height="0dp"
android:layout_weight="0.25"/>
<ImageView
android:layout_weight="0.5"
android:layout_height="0dp"
android:layout_width="50dp"
android:background="#dedede"/>
<View
android:layout_width="1dp"
android:layout_height="0dp"
android:layout_weight="0.25"/>
</LinearLayout>
<!--
...
-->
</RelativeLayout>

Look at this tutorials you can choose which layout is best. Every layout has own merits and demerits. Only one that layout is not best in android but in most cases Relative layout easy to use because it has move to easy any where of UI.
just like your matches problems, tutorials
http://android-developers.blogspot.com/2009/02/android-layout-tricks-1.html
you can see more layout of in developer.android.con. which has to learn more simply way. here some Best links you can see various layouts.
http://developer.android.com/resources/tutorials/views/hello-relativelayout.html
http://developer.android.com/guide/topics/ui/layout-objects.html
http://mobile.tutsplus.com/tutorials/android/android-user-interface-design-relative-layouts/
http://www.learn-android.com/2010/01/05/android-layout-tutorial/

Check this out
![<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="35dp"
android:orientation="horizontal" >
<ImageView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="2"
android:scaleType="centerInside"
android:src="#drawable/ic_launcher" />
<LinearLayout
android:layout_width="0dp"
android:layout_height="40dp"
android:layout_weight="4"
android:orientation="vertical" >
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="Row 1" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<TextView
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:text="Row 2" />
<TextView
android:layout_marginLeft="10dp"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:text="Row 3" />
</LinearLayout>
</LinearLayout>
<View android:layout_height="match_parent"
android:layout_width="2dp"
android:background="#fff"/>
<ImageView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="2"
android:scaleType="centerInside"
android:src="#drawable/ic_launcher" />
</LinearLayout>

Categories

Resources