why android:layout_gravity="right" not working here in android xml - android

my xml code for list view's row is
<?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:baselineAligned="false"
android:orientation="horizontal" >
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="5"
android:orientation="vertical" >
<TextView
android:id="#+id/tv_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp" />
<TextView
android:id="#+id/tv_time"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp" />
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_weight="2"
android:gravity="center" >
<ImageView
android:id="#+id/iv_image"
android:layout_width="50dp"
android:layout_height="40dp"
android:background="#drawable/app_icon_17"
android:contentDescription="#string/empty" />
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="right"
android:layout_weight="2"
android:gravity="center" >
<Button
android:id="#+id/btn_delete"
android:layout_width="40dp"
android:layout_height="40dp"
android:background="#drawable/btn_delete_new"
android:focusable="false" />
</LinearLayout>
</LinearLayout>
I want the last button with id btn_delete to stay right aligned. And its showing as I wanted in "graphical layout" while designing. But when I run it, on emulator it's not working.
See the output :
So why the delete button not getting right aligned?

Use this, using relative layout
<?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:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true" >
<TextView
android:id="#+id/tv_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp" />
<TextView
android:id="#+id/tv_time"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/tv_name"
android:layout_marginLeft="10dp" />
</RelativeLayout>
<RelativeLayout
android:id="#+id/rl_btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true" >
<Button
android:id="#+id/btn_delete"
android:layout_width="40dp"
android:layout_height="40dp"
android:background="#drawable/btn_delete_new"
android:focusable="false" />
</RelativeLayout>
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="20dp"
android:layout_toLeftOf="#+id/rl_btn" >
<ImageView
android:id="#+id/iv_image"
android:layout_width="50dp"
android:layout_height="40dp"
android:background="#drawable/app_icon_17"
android:contentDescription="#string/empty" />
</RelativeLayout>
</RelativeLayout>

You seem to have misunderstood layouts, those embedded LinearLayouts aren't needed. Use a RelativeLayout, e.g.:
<?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" >
<TextView
android:id="#+id/tv_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_marginLeft="10dp" />
<TextView
android:id="#+id/tv_time"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_marginLeft="10dp" />
<ImageView
android:id="#+id/iv_image"
android:layout_width="50dp"
android:layout_height="40dp"
android:layout_centerVertical="true"
android:layout_marginLeft="10dp"
android:layout_toRightOf="#id/tv_time"
android:background="#drawable/app_icon_17"
android:contentDescription="#string/empty" />
<Button
android:id="#+id/btn_delete"
android:layout_width="40dp"
android:layout_height="40dp"
android:layout_centerVertical="true"
android:layout_alignParentRight="true"
android:background="#drawable/btn_delete_new"
android:focusable="false" />
</RelativeLayout>

As we can see that you have assign weight to your row layout.
If you assign weight your parent layout you just need to set accordingly height or with 0dp.
In your case android:layout_width="0dp"
but when you have child layout of that weighted layout then you must give that layouts property as fill_parent i.e: button's android:layout_height="fill_parent"
So if you don't want to change your parent layout and want to work with existing code you can try below code.
<?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:baselineAligned="false"
android:orientation="horizontal" >
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="5"
android:orientation="vertical" >
<TextView
android:id="#+id/tv_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp" />
<TextView
android:id="#+id/tv_time"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp" />
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="2"
>
<ImageView
android:id="#+id/iv_image"
android:layout_width="fill_parent"
android:layout_height="40dp"
android:background="#drawable/icon"
android:contentDescription="#string/app_name" />
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="2" >
<Button
android:id="#+id/btn_delete"
android:layout_width="fill_parent"
android:layout_height="40dp"
android:background="#drawable/icon"
android:focusable="false" />
</LinearLayout>
</LinearLayout>

Change this
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="right"
android:layout_weight="2"
android:gravity="center" >
<Button
android:id="#+id/btn_delete"
android:layout_width="40dp"
android:layout_height="40dp"
android:background="#drawable/btn_delete_new"
android:focusable="false" />
</LinearLayout>
to
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<Button
android:id="#+id/btn_delete"
android:layout_width="40dp"
android:layout_height="40dp"
android:layout_gravity="right"
android:background="#drawable/btn_delete_new"
android:focusable="false" />
</LinearLayout>
You were applying android:layout_gravity="right" to layout. Instead, you should apply it to a button inside layout. And I don't think you need weight 2 for that layout. But you can add it if its required for you. Hope it helps.

<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="2"
android:orientation="vertical" >
<Button
android:id="#+id/btn_delete"
android:layout_width="40dp"
android:layout_height="40dp"
android:layout_gravity="right"
android:gravity="right"
android:background="#drawable/btn_delete_new"
android:focusable="false" />
</LinearLayout>

Related

Two button one close to other at the bottom of RelativeLayout - Android

I am facing a problem with android layout.
I have a relative layout with a textview and an image overlapped and I would like to add two button at the bottom of the view, one close to other and that fill all the width of the view. Here below the manifest.xml
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
android:orientation="vertical"
android:id="#+id/RecordAccelDataLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:android="http://schemas.android.com/apk/res/android">
<ImageView
android:layout_gravity="center"
android:longClickable="false"
android:layout_width="283dp"
android:layout_height="418dp"
android:src="#mipmap/bg_thand"
android:adjustViewBounds="false"
android:alpha="0.1" />
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/rectangle">
<TextView
android:textSize="20sp"
android:gravity="center_horizontal"
android:id="#+id/rec_progress_text"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="30dp"
android:text="#string/title_activity_record_accel_data"
/>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent" >
<com.adrenergic.tremorsense.circleGraph
android:layout_gravity="center"
android:id="#+id/progressgraph"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"/>
<TextView
android:textSize="20sp"
android:id="#+id/accelText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/recording"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:textIsSelectable="true"
/>
<Button
android:textColor="#ffffff"
android:layout_width="100dp"
android:id="#+id/back"
android:layout_height="50dp"
android:text="#string/back"
android:layout_gravity="center"
android:layout_marginBottom="3dip"
android:onClick="goBack"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true" />
<Button
android:textColor="#ffffff"
android:layout_width="100dp"
android:layout_height="50dp"
android:layout_gravity="center"
android:text="#string/stats"
android:onClick="goBack"
android:id="#+id/stats"
android:layout_marginBottom="3dip"
android:layout_centerHorizontal="true"
android:layout_alignParentBottom="true"
android:layout_toRightOf="#+id/back"/>
</RelativeLayout>
</LinearLayout>
</FrameLayout>
The layout appears in this way.
I would like that the two button appear in the same position but centered and that they fill equally the view in width.
Hope you will help me.
Can u modify your button layout impl. with the below sample and try.
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:weightSum="1">
<Button
android:textColor="#ffffff"
android:layout_width="0dp"
android:id="#+id/back"
android:layout_weight="0.5"
android:layout_height="50dp"
android:text="#string/back"
android:layout_gravity="center"
android:layout_marginBottom="3dip"
android:onClick="goBack"/>
<Button
android:textColor="#ffffff"
android:layout_width="0dp"
android:layout_height="50dp"
android:layout_weight="0.5"
android:layout_gravity="center"
android:text="#string/stats"
android:onClick="goBack"
android:id="#+id/stats"
android:layout_marginBottom="3dip"/>
</LinearLayout>
Hi you can put buttons in linear layout and align parent bottom:
<?xml version="1.0" encoding="utf-8"?>
<ImageView
android:layout_width="283dp"
android:layout_height="418dp"
android:layout_gravity="center"
android:adjustViewBounds="false"
android:alpha="0.1"
android:longClickable="false"
android:src="#mipmap/bg_thand" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/rectangle"
android:orientation="vertical">
<TextView
android:id="#+id/rec_progress_text"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="30dp"
android:gravity="center_horizontal"
android:text="#string/title_activity_record_accel_data"
android:textSize="20sp" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<com.adrenergic.tremorsense.circleGraph
android:id="#+id/progressgraph"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:layout_gravity="center" />
<TextView
android:id="#+id/accelText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:text="#string/recording"
android:textIsSelectable="true"
android:textSize="20sp" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:orientation="horizontal">
<Button
android:id="#+id/back"
android:layout_width="0dp"
android:layout_height="50dp"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:layout_gravity="center"
android:layout_marginBottom="3dip"
android:layout_weight="1"
android:onClick="goBack"
android:text="#string/back"
android:textColor="#ffffff" />
<Button
android:id="#+id/stats"
android:layout_width="0dp"
android:layout_height="50dp"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:layout_gravity="center"
android:layout_marginBottom="3dip"
android:layout_toRightOf="#+id/back"
android:layout_weight="1"
android:onClick="goBack"
android:text="#string/stats"
android:textColor="#ffffff" />
</LinearLayout>
</RelativeLayout>
</LinearLayout>
check this it will help.
android:weight is what you may be looking for. Enclose the two buttons inside a linear layout and add android:weight =1 for both of them. An example would be :
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
>
<Button android:id="#+id/button1"
...
android:layout_weight="1"/>
<View
android:id="#+id/space"
...
android:layout_weight=".1"/>
<Button android:id="#+id/button2"
...
android:layout_weight="1"/>
</LinearLayout>
You need to add spacer in in center bottom and align two button to that spacer like this :
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent" >
<com.adrenergic.tremorsense.circleGraph
android:layout_gravity="center"
android:id="#+id/progressgraph"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"/>
<TextView
android:textSize="20sp"
android:id="#+id/accelText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:textIsSelectable="true"
/>
//Aligh Space in center with align to bottom
and set relation of two button to this spacer
<Space
android:layout_width="1px"
android:layout_height="1px"
android:layout_above="#+id/back"
android:layout_centerHorizontal="true"
android:layout_alignParentBottom="true"
android:id="#+id/space"/>
<Button
android:textColor="#ffffff"
android:layout_width="100dp"
android:id="#+id/back"
android:layout_height="50dp"
android:text="Back"
android:layout_gravity="center"
android:onClick="goBack"
android:layout_alignParentBottom="true"
android:layout_alignStart="#+id/accelText"/>
<Button
android:textColor="#ffffff"
android:layout_width="100dp"
android:layout_height="50dp"
android:layout_gravity="center"
android:text="Status"
android:onClick="goBack"
android:id="#+id/stats"
android:layout_alignParentBottom="true"
android:layout_toStartOf="#+id/space"/>
</RelativeLayout>
Use this layout changes made with Button added inside Linear Layout and filled it with weight with android:gravity="bottom" and android:orientation="horizontal".
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/RecordAccelDataLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<ImageView
android:layout_width="283dp"
android:layout_height="418dp"
android:layout_gravity="center"
android:adjustViewBounds="false"
android:alpha="0.1"
android:longClickable="false"
android:src="#drawable/common_ic_googleplayservices" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/common_ic_googleplayservices"
android:orientation="vertical">
<TextView
android:id="#+id/rec_progress_text"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="30dp"
android:gravity="center_horizontal"
android:text="Progress"
android:textSize="20sp" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<com.adrenergic.tremorsense.circleGraph
android:id="#+id/progressgraph"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:layout_gravity="center" />
<TextView
android:id="#+id/accelText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:text="REcording"
android:textIsSelectable="true"
android:textSize="20sp" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="bottom"
android:orientation="horizontal"
android:weightSum="1">
<Button
android:id="#+id/back"
android:layout_width="100dp"
android:layout_height="50dp"
android:layout_weight="0.50"
android:onClick="goBack"
android:text="Back"
android:textColor="#ffffff" />
<Button
android:id="#+id/stats"
android:layout_width="100dp"
android:layout_height="50dp"
android:layout_weight="0.50"
android:onClick="goBack"
android:text="Stats"
android:textColor="#ffffff" />
</LinearLayout>
</RelativeLayout>
</LinearLayout>
</FrameLayout>

display the image in the right corner

I have the following code with which i am trying to display at right corner of the title bar but its getting displayed in center.
<?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="35dip"
android:gravity="center_vertical"
android:background="#drawable/formheader">
<ImageView
android:id="#+id/header"
android:background="#drawable/ic_launcher"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="ShowRoom"
android:textColor="#android:color/black"
android:textStyle="bold"/>
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:clickable="true"
android:background="#drawable/menu"/>
</LinearLayout>
These are the properties of RelativeLayout, So it won't work with LinearLayout.
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
Add android:layout_weight="1" to TextView.
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="ShowRoom"
android:textColor="#android:color/black"
android:textStyle="bold" />
Change it like below :
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="35dip"
android:gravity="center_vertical"
android:orientation="horizontal" >
<ImageView
android:id="#+id/header"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/ic_launcher" />
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:paddingLeft="5dp"
android:paddingRight="5dp"
android:text="ShowRoom"
android:textColor="#android:color/black"
android:textStyle="bold" />
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/ic_launcher"
android:clickable="true" />
</LinearLayout>
You can do it in 2 ways,
Follow #prag's answer if you want to continue with LinearLayout.
Another simplest way is to use RelativeLayout like below,
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="35dip"
android:gravity="center_vertical"
android:background="#drawable/formheader">
<ImageView
android:id="#+id/header"
android:background="#drawable/ic_launcher"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/header"
android:layout_centerVertical="true"
android:text="ShowRoom"
android:textColor="#android:color/black"
android:textStyle="bold"/>
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:clickable="true"
android:background="#drawable/ic_launcher"/>
</RelativeLayout>
Try this layout
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="35dip"
android:orientation="horizontal" >
<ImageView
android:id="#+id/header"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/ic_launcher" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:text="ShowRoom"
android:textColor="#android:color/black"
android:textStyle="bold" />
<View
android:layout_width="0dip"
android:layout_height="wrap_content"
android:layout_weight="1" >
</View>
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="right"
android:background="#drawable/ic_launcher"
android:clickable="true" />
</LinearLayout>
Note: Replace my drawable image with yours. Hope this resolves your problem

Android Widget basic design

I am trying to create very simple widget design. For the past two days I am still not able to complete it and I would appreciate your help.
What I am trying to do is something looks like this design:
Please note the size of the image buttons is 16pd for both height and width.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:gravity="center"
android:layout_margin="4dp"
android:background="#drawable/background" >
<TextView
android:id="#+id/tvDisplayer"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="HDisplaer"
android:textSize="25px"
android:gravity="center"/>
<TextView
android:id="#+id/tvsmall"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TextView"
android:textSize="7px"
android:gravity="center"/>
<ImageButton
android:id="#+id/imRefresh"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/refresh"
android:layout_gravity="left" />
<ImageButton
android:id="#+id/imOpen"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/aboutus"
android:layout_gravity="right" />
</LinearLayout>
Wrap the ImageButtons with a RelativeLayout! Otherwise the code seems to be ok.
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<ImageButton
android:id="#+id/imRefresh"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/refresh"
android:layout_alignParentLeft="true" />
<ImageButton
android:id="#+id/imOpen"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/aboutus"
android:layout_alignParentRight="true" />
</RelativeLayout>
If the TextViews are not centered, then wrap them with another RelativeLayout, and add to each TextView this line: android:layout_centerHorizontal="true"
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" >
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/relativeLayout1"
android:layout_width="match_parent"
android:layout_height="50dp" >
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerInParent="true"
android:text="TextView" />
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/textView1"
android:layout_below="#+id/textView1"
android:layout_centerInParent="true"
android:text="TextView" />
</RelativeLayout>
<ImageButton
android:id="#+id/imageButton2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_below="#+id/relativeLayout1"
android:src="#drawable/black" />
<ImageButton
android:id="#+id/imageButton1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignTop="#+id/imageButton2"
android:src="#drawable/black" />
Just increase the height of the 2nd relative layout to bring it down.
Try this:
Just use two LinearLayout one for horizontal and other for vertical.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:gravity="center"
android:layout_margin="4dp"
android:background="#drawable/background" >
<TextView
android:id="#+id/tvDisplayer"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="HDisplaer"
android:textSize="25px"
android:gravity="center"/>
<TextView
android:id="#+id/tvsmall"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TextView"
android:textSize="7px"
android:gravity="center"/>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="horizontal"
android:gravity="center"
android:layout_margin="4dp"
>
<ImageButton
android:id="#+id/imRefresh"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="left" />
<ImageButton
android:id="#+id/imOpen"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="right" />
</LinearLayout>
</LinearLayout>

RelativeLayout position problems

I have a layout which contains 4 horizontal LinearLayouts with 3 ImageButtons inside each one.
Now I want to convert those LinearLayout to RelativeLayout because I need to add some more elements and I have to use toRightOf, alignParentTop etc.
Here's the code I'm using to do this change:
<?xml version="1.0" encoding="utf-8"?>
<ScrollView
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:background="#drawable/bugbox_wall_port" >
<LinearLayout
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_gravity="center_horizontal"
android:orientation="vertical" >
<Button
android:id="#+id/writeNewMsg"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:text="New" />
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:padding="10dp" >
<ImageButton
android:id="#+id/spyMsgs"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/msgspy" />
<ImageButton
android:id="#+id/playerMsgs"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:background="#drawable/msgplyr"
android:layout_toRightOf="#id/spyMsgs" />
<ImageButton
android:id="#+id/allyMsgs"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/msgally"
android:layout_toRightOf="#id/playerMsgs" />
</RelativeLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:padding="10dp" >
<ImageButton
android:id="#+id/battleMsgs"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/msgbatt" />
<ImageButton
android:id="#+id/skynetMsgs"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:background="#drawable/msgnet" />
<ImageButton
android:id="#+id/transportMsgs"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/msgtrans" />
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:padding="10dp" >
<ImageButton
android:id="#+id/expeditionMsgs"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/msgexp" />
<ImageButton
android:id="#+id/newsMsgs"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:background="#drawable/msgnews" />
<ImageButton
android:id="#+id/buildingMsgs"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/msgbuild" />
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:padding="10dp" >
<ImageButton
android:id="#+id/allMsgs"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/msgall" />
<ImageButton
android:id="#+id/binMsgs"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:background="#drawable/msgbin" />
</LinearLayout>
</LinearLayout>
</ScrollView>
But I do not know why, the RelativeLayout is being problematic.
Here's an image where I explain graphically which's my problem:
http://img811.imageshack.us/img811/5479/stackes.jpg
It is driving me nuts. I do not know why is this happening. I've used RelativesLayout before and they weren't problematic.
So my question is: Why is this happening? and then How can I fix this error?
Thank you in advance!
Try this one. I commented out the linear layouts at the bottom. If the relative layout works the way you want it to then you can adjust the other linears accordingly.
<?xml version="1.0" encoding="utf-8"?>
<ScrollView
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="wrap_content"
android:layout_width="fill_parent"
android:background="#drawable/bugbox_wall_port" >
<LinearLayout
android:layout_height="wrap_content"
android:layout_width="fill_parent"
android:layout_gravity="center_horizontal"
android:orientation="vertical" >
<Button
android:id="#+id/writeNewMsg"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:text="New" />
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:padding="10dp" >
<ImageButton
android:id="#+id/spyMsgs"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/ic_launcher" />
<ImageButton
android:id="#+id/playerMsgs"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:background="#drawable/ic_launcher"
android:layout_toRightOf="#id/spyMsgs" />
<ImageButton
android:id="#+id/allyMsgs"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/ic_launcher"
android:layout_toRightOf="#id/playerMsgs" />
</RelativeLayout>
<!-- <LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:padding="10dp" >
<ImageButton
android:id="#+id/battleMsgs"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/msgbatt" />
<ImageButton
android:id="#+id/skynetMsgs"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:background="#drawable/msgnet" />
<ImageButton
android:id="#+id/transportMsgs"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/msgtrans" />
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:padding="10dp" >
<ImageButton
android:id="#+id/expeditionMsgs"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/msgexp" />
<ImageButton
android:id="#+id/newsMsgs"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:background="#drawable/msgnews" />
<ImageButton
android:id="#+id/buildingMsgs"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/msgbuild" />
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:padding="10dp" >
<ImageButton
android:id="#+id/allMsgs"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/msgall" />
<ImageButton
android:id="#+id/binMsgs"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:background="#drawable/msgbin" />
</LinearLayout> -->
</LinearLayout>
</ScrollView>
Solved. I was setting an ID to the views programatically and I didn't realise...

How to fix the position of views in an Android layout?

I have designed a layout with some views (listview, buttons etc..).
When I install my app into an Android phone, the position of views is not the same as I designed.
Some buttons are only partially visible. Can anyone please tell me how to fix the position of views in the layout?
here is the code I used to design.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent" android:layout_height="fill_parent"
android:background="#drawable/bg4" android:orientation="vertical"
android:scrollbarAlwaysDrawVerticalTrack="true">
<LinearLayout android:id="#+id/linearLayout1"
android:layout_width="fill_parent" android:layout_height="10dp"
android:orientation="horizontal">
<TextView android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="3dp" android:text=" " />
</LinearLayout>
<LinearLayout android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:orientation="horizontal">
<ImageView android:id="#+id/imageView1"
android:layout_width="100dp" android:layout_height="60dp"
android:src="#drawable/logo" />
<TextView android:id="#+id/Loginas"
android:layout_width="120dp" android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:layout_marginBottom="3dp"
android:layout_marginLeft="3dp" android:gravity="center"
android:text="Logged in as..." android:textColor="#802A2A"
android:textSize="18dp" android:typeface="serif" />
<Button android:id="#+id/btnlgout"
android:layout_width="80dp" android:layout_height="30dp"
android:layout_gravity="bottom"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp" android:background="#drawable/logout"
android:onClick="logout" />
</LinearLayout>
<LinearLayout android:id="#+id/linearLayout2"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_marginTop="20dp" android:orientation="horizontal">
<TextView android:id="#+id/count"
android:layout_width="90dp" android:layout_height="25dp"
android:layout_marginLeft="5dp" android:layout_weight="1"
android:text="Count : 4" android:textColor="#802A2A"
android:textSize="15dp" />
<Spinner android:id="#+id/refresh"
android:layout_width="150dp" android:layout_height="25dp"
android:background="#drawable/drop" />
<Button android:id="#+id/btnpreferences"
android:layout_width="90dp" android:layout_height="30dp"
android:layout_marginLeft="10dp" android:background="#drawable/pref"
android:onClick="getPreferences" />
</LinearLayout>
<LinearLayout android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_marginTop="20dp" android:gravity="center_horizontal"
android:orientation="vertical">
<LinearLayout android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:orientation="horizontal">
<TextView android:id="#+id/column1"
android:layout_width="70dp" android:layout_height="wrap_content"
android:text="column1" android:textStyle="bold" />
<TextView android:id="#+id/column2"
android:layout_width="70dp" android:layout_height="wrap_content"
android:text="column2" android:textStyle="bold" />
<TextView android:id="#+id/column3"
android:layout_width="70dp" android:layout_height="wrap_content"
android:text="column3" android:textStyle="bold" />
<TextView android:id="#+id/column4"
android:layout_width="70dp" android:layout_height="wrap_content"
android:text="column4" android:textStyle="bold" />
</LinearLayout>
<ListView android:id="#+id/listViewTickets"
android:layout_width="match_parent"
android:layout_height="200dp" android:layout_gravity="center_horizontal"
android:layout_marginTop="10dp">
</ListView>
</LinearLayout>
<LinearLayout android:id="#+id/linearLayout1"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:layout_weight="1" android:orientation="horizontal">
<TextView android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content" android:text=" " />
</LinearLayout>
<LinearLayout android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="right"
android:layout_marginBottom="80dp" android:orientation="horizontal">
<Button android:id="#+id/btnNew"
android:layout_width="80dp" android:layout_height="30dp"
android:background="#drawable/btnnew" />
<Button android:id="#+id/btnUpdate"
android:layout_width="80dp" android:layout_height="30dp"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp" android:background="#drawable/edit" />
</LinearLayout>
</LinearLayout>
Use ScrollView:
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/ScrollView1"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#color/cherry"
android:orientation="vertical" >
// your components
</RelativeLayout>
</ScrollView>
inside linear layouts in views you used a constant width. It would be better if you use weight-sum for same and provide them width in by weight.
You should read up a few layout practices like Romain Guy's layout tricks, and consider using more efficient containers than the LinearLayout.
You should also position your components relatively to each-other and their parent, this is the way you can achieve a proper layout that looks the same on all screens / resolutions.
Much better if you use RelativeLayout so that you can arrange the views very well.

Categories

Resources