Align Text and Images Center to Each Other - android

I am displaying text and images in a list format next to each other but I can't get them to line up perfectly center next to each other in a straight line what am I missing
Here is my layout code below
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true" >
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TextView"
android:textSize="14dp"
android:textStyle="bold"
android:layout_gravity="center|right"
android:gravity="center|right"
android:layout_marginLeft="5dp"
android:layout_marginTop="10dp"
/>
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#+id/textView1"
android:layout_gravity="center|right"
android:gravity="center|right"
android:src="#drawable/image_ls"
android:layout_marginLeft="5dp"
android:layout_marginTop="10dp"
/>
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center|right"
android:text="TextView"
android:textSize="14dp"
android:layout_toRightOf="#+id/imageView1"
android:textStyle="bold"
android:gravity="center|right"
android:layout_marginLeft="5dp"
android:layout_marginTop="10dp"
/>
<ImageView
android:id="#+id/imageView2"
android:layout_width="wrap_content"
android:layout_gravity="center|right"
android:layout_height="wrap_content"
android:layout_toRightOf="#+id/textView2"
android:src="#drawable/image_ls"
android:gravity="center|right"
android:layout_marginLeft="5dp"
android:layout_marginTop="10dp"
/>
</RelativeLayout>


This does work:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:padding="5dp"
android:gravity="center_vertical|center_horizontal"
android:background="#color/gray_dark">
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:text="TextView"
android:textSize="14dp"
android:textStyle="bold"
android:layout_gravity="center_vertical|right"
android:gravity="center_vertical|right"
android:layout_marginLeft="5dp"
/>
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_toRightOf="#+id/textView1"
android:layout_gravity="center_vertical|right"
android:gravity="center_vertical|right"
android:src="#drawable/image_ls"
android:layout_marginLeft="5dp"
/>
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="center_vertical|right"
android:text="TextView"
android:textSize="14dp"
android:layout_toRightOf="#+id/imageView1"
android:textStyle="bold"
android:gravity="center_vertical|right"
android:layout_marginLeft="5dp"
/>
<ImageView
android:id="#+id/imageView2"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_toRightOf="#+id/textView2"
android:src="#drawable/image_ls"
android:layout_gravity="center_vertical|right"
android:gravity="center_vertical|right"
android:layout_marginLeft="5dp"
/>
</RelativeLayout>


i would prefer a linear layout over relative for this situation with this simple layout design, it is easier and straight forward you just need to use:
android:layout_gravity="center_vertical"
and play around with weights if any other size restriction is required.
here is the solution hope its what you need:
<?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="vertical"
>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="hello"
android:textStyle="bold"
android:layout_gravity="center_vertical"
android:layout_marginTop="10dp"
/>
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_launcher"
android:layout_gravity="center_vertical"
android:layout_marginTop="10dp"
/>
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="hello"
android:textStyle="bold"
android:layout_gravity="center_vertical"
android:layout_marginTop="10dp"
/>
<ImageView
android:id="#+id/imageView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:src="#drawable/ic_launcher"
android:layout_marginTop="10dp"
/>
</LinearLayout>
</LinearLayout>

Related

Align Text and Images perfectly next to Each Other

I am trying to line up the text and images next to each other in a perfect line but cant quite get it center.
As you see with the image it's almost center next to each other but not perfectly what am I missing
<?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:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true" >
<TextView
android:id="#+id/textView1"
android:textSize="14dp"
android:textStyle="bold"
android:gravity="center_vertical"
android:layout_gravity="center_vertical"
android:layout_marginLeft="5dp"
android:layout_marginTop="10dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TextView" />
<ImageView
android:id="#+id/imageView1"
android:layout_marginLeft="5dp"
android:layout_marginTop="10dp"
android:layout_toRightOf="#+id/textView1"
android:layout_gravity="center_vertical|right"
android:gravity="center_vertical|right"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/image_ls"
/>
<TextView
android:id="#+id/textView2"
android:textSize="14dp"
android:layout_marginLeft="5dp"
android:layout_marginTop="10dp"
android:textStyle="bold"
android:layout_toRightOf="#+id/imageView1"
android:layout_gravity="center_vertical|right"
android:gravity="center_vertical|right"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TextView"
/>
<ImageView
android:id="#+id/imageView2"
android:layout_marginLeft="5dp"
android:layout_marginTop="10dp"
android:layout_toRightOf="#+id/textView2"
android:layout_gravity="center_vertical|right"
android:gravity="center_vertical|right"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/image_ls"
/>
<TextView
android:id="#+id/textView3"
android:layout_toRightOf="#+id/imageView2"
android:layout_gravity="center_vertical|right"
android:gravity="center_vertical|right"
android:layout_marginLeft="5dp"
android:layout_marginTop="10dp"
android:textSize="14dp"
android:textStyle="bold"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TextView"
/>
</RelativeLayout>

<?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="match_parent"
android:paddingTop="10dp">
<TextView
android:id="#+id/textView1"
android:textSize="14dp"
android:textStyle="bold"
android:gravity="center_vertical"
android:layout_gravity="center_vertical"
android:layout_marginLeft="5dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TextView" />
<ImageView
android:id="#+id/imageView1"
android:layout_marginLeft="5dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:src="#drawable/image_ls" />
<TextView
android:id="#+id/textView2"
android:textSize="14dp"
android:layout_marginLeft="5dp"
android:textStyle="bold"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:text="TextView" />
<ImageView
android:id="#+id/imageView2"
android:layout_marginLeft="5dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:src="#drawable/image_ls" />
<TextView
android:id="#+id/textView3"
android:textSize="14dp"
android:textStyle="bold"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:text="TextView" />
</LinearLayout>

Try This 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"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true" >
<TextView
android:id="#+id/textView1"
android:textSize="14dp"
android:textStyle="bold"
android:gravity="center"
android:layout_centerVertical="true"
android:layout_marginLeft="5dp"
android:layout_marginTop="10dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TextView" />
<ImageView
android:id="#+id/imageView1"
android:layout_marginLeft="5dp"
android:layout_marginTop="10dp"
android:layout_toRightOf="#+id/textView1"
android:layout_centerVertical="true"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/image_ls"
/>
<TextView
android:id="#+id/textView2"
android:textSize="14dp"
android:layout_marginLeft="5dp"
android:layout_marginTop="10dp"
android:textStyle="bold"
android:layout_toRightOf="#+id/imageView1"
android:layout_centerVertical="true"
android:gravity="center"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TextView"
/>
<ImageView
android:id="#+id/imageView2"
android:layout_marginLeft="5dp"
android:layout_marginTop="10dp"
android:layout_toRightOf="#+id/textView2"
android:layout_centerVertical="true"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/image_ls"
/>
<TextView
android:id="#+id/textView3"
android:layout_toRightOf="#+id/imageView2"
android:layout_centerVertical="true"
android:gravity="center_vertical|right"
android:layout_marginLeft="5dp"
android:layout_marginTop="10dp"
android:textSize="14dp"
android:textStyle="bold"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TextView"
/>
</RelativeLayout>

<?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:gravity="center" >
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:gravity="center_vertical"
android:text="TextView"
android:textSize="14dp"
android:textStyle="bold" />
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center_vertical|right"
android:src="#drawable/ic_launcher" />
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical|right"
android:text="TextView"
android:textSize="14dp"
android:textStyle="bold" />
<ImageView
android:id="#+id/imageView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical|right"
android:gravity="center_vertical|right"
android:src="#drawable/ic_launcher" />
<TextView
android:id="#+id/textView3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical|right"
android:text="TextView"
android:textSize="14dp"
android:textStyle="bold" />
</LinearLayout>

Try this:
Use LinearLayout to fix android widgets in vertical or horizontal.
<?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:layout_marginLeft="5dp"
android:layout_marginTop="10dp"
android:gravity="center_vertical"
android:orientation="horizontal" >
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TextView"
android:textSize="14dp"
android:textStyle="bold" />
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:src="#drawable/ic_launcher" />
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TextView"
android:textSize="14dp"
android:textStyle="bold" />
<ImageView
android:id="#+id/imageView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:src="#drawable/ic_launcher" />

layout_marginBottom not working when using match_parent or wrap_content under relativelayout

I am writing this layout code for my listview.
Below is d code
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:padding="5dp" >
<ImageView
android:id="#+id/thumb"
android:layout_width="70dp"
android:layout_height="70dp"
android:layout_marginTop="20dp"
android:layout_marginLeft="15dp"
android:layout_marginRight="10dp"
android:paddingBottom="10dp"
android:contentDescription="#string/app_name" />
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_marginLeft="10dp"
android:layout_marginRight="5dp"
android:layout_toLeftOf="#+id/arrow"
android:layout_toRightOf="#+id/thumb"
android:orientation="vertical" >
<TextView
android:id="#+id/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/title"
android:textSize="18sp"
android:textStyle="bold"
android:textColor="#color/white" />
<TextView
android:id="#+id/desc"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:text="#string/desc"
android:textSize="12sp" />
</LinearLayout>
<ImageView
android:id="#+id/arrow"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:layout_marginRight="5dp"
android:contentDescription="#string/app_name"
android:src="#drawable/ic_action_arrow_next" />
</RelativeLayout>
In the parent element of RelativeLayout the first child element ImageView is where the problem resides, in which all the layout margin properties except layout_marginBottom is working.
What could be the problem, if someone can figure it out
Desired Image
What I have right now

Try this layout
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:paddingBottom="12dp"
android:paddingLeft="16dp"
android:paddingRight="16dp"
android:paddingTop="12dp" >
<ImageView
android:id="#+id/thumb"
android:layout_width="70dp"
android:layout_height="70dp"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:contentDescription="#string/app_name" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_marginLeft="22dp"
android:layout_marginRight="16dp"
android:layout_toLeftOf="#+id/arrow"
android:layout_toRightOf="#+id/thumb"
android:orientation="vertical" >
<TextView
android:id="#+id/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/app_name"
android:textColor="#color/white"
android:textSize="18sp"
android:textStyle="bold" />
<TextView
android:id="#+id/desc"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:text="#string/app_name"
android:textSize="12sp" />
</LinearLayout>
<ImageView
android:id="#+id/arrow"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:contentDescription="#string/app_name"
android:src="#drawable/ic_launcher" />
</RelativeLayout>

try this..change ur imageview like this
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:padding="5dp" >
<ImageView
android:id="#+id/thumb"
android:layout_width="70dp"
android:layout_height="70dp"
android:contentDescription="#string/app_name"
android:paddingBottom="10dp"
android:paddingLeft="15dp"
android:paddingRight="10dp"
android:paddingTop="20dp"
android:src="#drawable/ic_launcher" />
<ImageView
android:id="#+id/arrow"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:contentDescription="#string/app_name"
android:src="#drawable/ic_launcher" />
<TextView
android:id="#+id/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="#+id/desc"
android:layout_toRightOf="#+id/thumb"
android:text="titleDsdsadasds"
android:textColor="#000000"
android:textSize="18sp"
android:textStyle="bold" />
<TextView
android:id="#+id/desc"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/arrow"
android:layout_alignLeft="#+id/title"
android:text="descsdfsdfdfsdf"
android:textSize="12sp" />
</RelativeLayout>

well i can see that you have not given any margin bottom to your imageview.Correct me if i'm wrong but i guess you want android:layout_marginBottom="10dp" instead of android:paddingBottom="10dp".So you may want to replace it like below-
<ImageView
android:id="#+id/thumb"
android:layout_width="70dp"
android:layout_height="70dp"
android:layout_marginTop="20dp"
android:layout_marginLeft="15dp"
android:layout_marginRight="10dp"
android:layout_marginBottom="10dp"
android:contentDescription="#string/app_name" />
padding is to give spacing from inside of the view and margin for outside.

Try This
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
android:paddingTop="15dp"
android:paddingBottom="15dp" >
<ImageView
android:id="#+id/thumb"
android:layout_width="70dp"
android:layout_height="70dp"
android:layout_centerVertical="true"
android:layout_marginLeft="15dp"
android:layout_marginRight="10dp"
android:contentDescription="#string/app_name"
android:paddingBottom="10dp" />
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_marginLeft="10dp"
android:layout_marginRight="5dp"
android:layout_toLeftOf="#+id/arrow"
android:layout_toRightOf="#+id/thumb"
android:orientation="vertical" >
<TextView
android:id="#+id/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="ddd"
android:textSize="18sp"
android:textStyle="bold" />
<TextView
android:id="#+id/desc"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:text="AAAAAA"
android:textSize="12sp" />
</LinearLayout>
<ImageView
android:id="#+id/arrow"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:layout_marginRight="5dp"
android:contentDescription="AAAAAAAAAAA"
android:src="#drawable/ic_launcher" />

Creating a layout with image extending the list item - Android XML

I am trying to create the following layout in android.
I am unable to achieve the layout as shown in the image.Please ignore the image on the extreme left.
<LinearLayout
android:id="#+id/ll_groups_list_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_marginLeft="10dp"
android:layout_weight="1.0"
android:background="#drawable/normal_white_bg"
android:gravity="center"
android:orientation="vertical" >
<TextView
android:id="#+id/groups_list_name"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:singleLine="true"
android:text="Group name"
android:textAppearance="?android:attr/textAppearanceMedium" />
<TextView
android:id="#+id/groups_list_description"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:ellipsize="end"
android:singleLine="true"
android:text="Group Description may come for two lines" />
</LinearLayout>
<ImageView
android:id="#+id/groups_list_image"
android:layout_width="70dp"
android:layout_height="70dp"
android:padding="3dip"
android:src="#drawable/logo" />

this may helpful to you,
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:padding="2dp" >
<ImageView
android:id="#+id/image"
android:layout_width="120dp"
android:layout_height="120dp"
android:contentDescription="#string/news" />
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="60dp"
android:layout_centerVertical="true"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:layout_toLeftOf="#+id/arrow"
android:layout_toRightOf="#+id/thumb"
android:orientation="vertical" >
<TextView
android:id="#+id/text1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:ellipsize="end"
android:maxLines="1"
android:text="#string/text1"
android:textSize="25dp"
android:textStyle="bold" />
<TextView
android:id="#+id/text2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:layout_marginTop="25dp"
android:padding="2dp"
android:paddingTop="20dp"
android:text="#string/text2"
android:textColor="#7F7F7F"
android:textSize="10sp" />
</RelativeLayout>
<ImageView
android:id="#+id/textImage"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:layout_marginRight="5dp"
android:src="#drawable/image_source" />
</RelativeLayout>

Try this way,hope this will help you to solve your problem.
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#FFFF00"
android:padding="5dp">
<LinearLayout
android:id="#+id/ll_groups_list_text"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="match_parent"
android:background="#FFFFFF"
android:orientation="vertical"
android:layout_marginTop="5dp"
android:layout_marginBottom="5dp"
android:gravity="center_vertical"
android:padding="5dp">
<TextView
android:id="#+id/groups_list_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:singleLine="true"
android:text="Group name"
android:textColor="#000000"
android:textAppearance="?android:attr/textAppearanceMedium" />
<TextView
android:id="#+id/groups_list_description"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:ellipsize="end"
android:singleLine="true"
android:textColor="#000000"
android:layout_marginTop="5dp"
android:text="Group Description may come for two lines" />
</LinearLayout>
<ImageView
android:id="#+id/groups_list_image"
android:layout_width="70dp"
android:layout_height="70dp"
android:padding="3dip"
android:background="#FFFFFF"
android:src="#drawable/ic_launcher" />
</LinearLayout>

Please use this
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#FFFF00"
android:padding="2dp" >
<RelativeLayout
android:id="#+id/ll_groups_list_text"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:background="#FFFFFF"
android:orientation="vertical" >
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignTop="#+id/imageView1"
android:text="Text1"
android:textAppearance="?android:attr/textAppearanceMedium" />
<TextView
android:id="#+id/textView3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/imageView1"
android:layout_alignParentLeft="true"
android:text="Text 2"
android:textAppearance="?android:attr/textAppearanceMedium" />
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:src="#drawable/ic_launcher" />
</RelativeLayout>
</LinearLayout>

customized list view with text view and button not support for multiple screen?

In my app am using customized listed view with text view and Buttons.The screen size is 4.65" 720p(720X1280 : xhdpi),device take this resolution from layout-large folder.when i run it on device.the list view item and header display not fit to the screen like image shown below,some empty space in the end of row.Its not able to fit to the screen.Can any one know please help me to solve this issue.
Header XML Coding
<RelativeLayout
android:id="#+id/relativeLayout1"
android:layout_width="wrap_content"
android:layout_height="20dp"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:layout_below="#+id/search_lay"
android:layout_marginTop="1dp"
android:background="#e8e8e8" >
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:layout_marginLeft="32dp"
android:text="Item(s)"
android:textColor="#dd1713"
android:textSize="13sp" />
<TextView
android:id="#+id/textView3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_marginLeft="48dp"
android:layout_toRightOf="#+id/textView1"
android:text="Price(Rs.)"
android:textColor="#dd1713"
android:textSize="13sp" />
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_marginLeft="18dp"
android:layout_toRightOf="#+id/textView3"
android:text="Qty"
android:textColor="#dd1713"
android:textSize="13sp" />
<TextView
android:id="#+id/textView4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:layout_marginLeft="28dp"
android:layout_toRightOf="#+id/textView2"
android:text="Total(Rs.)"
android:textColor="#dd1713"
android:textSize="13sp" />
<TextView
android:id="#+id/textView5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:layout_marginLeft="3dp"
android:text="Fav"
android:textColor="#dd1713"
android:textSize="13sp" />
</RelativeLayout>
Customized List-view XML Coding
<?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/linearLayout1"
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:background="#ffffff" >
<TextView
android:id="#+id/orderlist_product_id"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TextView"
android:visibility="gone" />
<RelativeLayout
android:layout_width="30dp"
android:layout_height="match_parent" >
<ImageView
android:id="#+id/fav_img"
android:layout_width="30dp"
android:layout_height="30dp"
android:background="#drawable/fav_order_list_btn" />
<Button
android:id="#+id/special_inst_btn"
android:layout_width="25dp"
android:layout_height="18dp"
android:layout_below="#+id/fav_img"
android:layout_centerHorizontal="true"
android:background="#drawable/special_inst_btn_in_orderlist"
android:gravity="center"
android:text="+"
android:textColor="#ffffff"
android:textSize="14sp" />
</RelativeLayout>
<TextView
android:id="#+id/order_list_itemname"
android:layout_width="95dp"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginLeft="1dp"
android:text="Item name"
android:textColor="#000000"
android:textSize="12sp"
android:typeface="serif" />
<RelativeLayout
android:layout_width="34dp"
android:layout_height="match_parent"
android:layout_marginLeft="2dp" >
<TextView
android:id="#+id/orderlist_offer"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="4dp"
android:gravity="center"
android:textColor="#298616"
android:textSize="10sp" />
<TextView
android:id="#+id/orderlist_price"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:gravity="right"
android:text="200.00"
android:textColor="#000000"
android:textSize="10sp"
android:typeface="serif" />
</RelativeLayout>
<Button
android:id="#+id/orderlist_minus"
android:layout_width="25dp"
android:layout_height="25dp"
android:layout_gravity="center"
android:layout_marginLeft="5dp"
android:layout_marginTop="1dp"
android:background="#drawable/sub_button_click" />
<EditText
android:id="#+id/order_list_quantity"
android:layout_width="27dp"
android:layout_height="25dp"
android:layout_marginTop="13dp"
android:background="#drawable/et_bg"
android:ems="10"
android:focusable="false"
android:focusableInTouchMode="false"
android:gravity="center"
android:inputType="number"
android:textColor="#000000"
android:textSize="12dp"
android:typeface="serif" >
<requestFocus />
</EditText>
<Button
android:id="#+id/orderlist_plus"
android:layout_width="25dp"
android:layout_height="25dp"
android:layout_gravity="center"
android:layout_marginTop="1dp"
android:background="#drawable/plus_btn_click" />
<TextView
android:id="#+id/orderlist_total"
android:layout_width="43dp"
android:layout_height="wrap_content"
android:layout_marginLeft="3dp"
android:layout_marginTop="13dp"
android:gravity="right"
android:text="1000.00"
android:textColor="#000000"
android:textSize="11sp"
android:typeface="serif" />
<Button
android:id="#+id/orderlist_delete"
android:layout_width="23dp"
android:layout_height="23dp"
android:layout_gravity="center"
android:layout_marginLeft="3dp"
android:layout_marginTop="1dp"
android:background="#drawable/order_list_delete" />
</LinearLayout>
</RelativeLayout>

i m giving u a demo.this layout will work on all size layout,this will definitely help u #Yugesh.
weight works percentage-wise on all screen.
<?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="fill_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical" >
<RelativeLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight=".30"
android:gravity="center_horizontal" >
<ImageView
android:id="#+id/image1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_launcher" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/image1"
android:src="#drawable/ic_launcher" />
</RelativeLayout>
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight=".30"
android:text="30%" />
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight=".20"
android:text="20%" />
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight=".20"
android:text="20%" />
</LinearLayout>
</RelativeLayout>
further more,if there is any query,then please ask...

Can't resize a RelativeLayout inside a ScrollView to fill the whole screen

I am having a weird issue that I am not sure how to fix. I have a RelativeLayout inside a ScrollView and this scrollView has it's height set to fill_parent. So does the RelativeLayout. Still, the contents are not filling the entire screen and it's going only to the wrap_content of the last layout inside this RelativeLayout.
Here is my code:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res/com.pontai"
android:id="#+id/relativeLayout1"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent" >
<RelativeLayout
android:id="#+id/relativeLayout2"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<LinearLayout
android:id="#+id/linearLayout1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/relativeLayout3"
android:layout_alignParentTop="true"
android:layout_alignRight="#+id/relativeLayout5"
android:layout_marginTop="5dp"
android:orientation="horizontal" >
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="How much points you have here:"
android:textAppearance="?android:attr/textAppearanceSmall" />
<TextView
android:id="#+id/textViewTotalPoints1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="120"
android:textAppearance="?android:attr/textAppearanceMedium" />
</LinearLayout>
<RelativeLayout
android:id="#+id/relativeLayout4"
android:layout_width="wrap_content"
android:layout_height="80dp"
android:layout_alignLeft="#+id/relativeLayout3"
android:layout_below="#+id/linearLayout1"
android:layout_marginTop="5dp"
android:layout_toLeftOf="#+id/textView7"
android:orientation="vertical" >
<TextView
android:id="#+id/textView3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="5dp"
android:text="Ratings"
android:textAppearance="?android:attr/textAppearanceMedium" />
<TextView
android:id="#+id/textViewPositivePoints"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:textAppearance="?android:attr/textAppearanceSmall" />
<ImageView
android:id="#+id/imageView2"
android:layout_width="25dp"
android:layout_height="25dp"
android:layout_below="#+id/textView3"
android:layout_toLeftOf="#+id/textView3"
android:src="#drawable/thumbs_up_focused" />
<TextView
android:id="#+id/textViewNegativePoints"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignRight="#+id/textView3"
android:layout_centerVertical="true"
android:layout_marginRight="3dp"
android:text="22"
android:textAppearance="?android:attr/textAppearanceSmall" />
<TextView
android:id="#+id/textView5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBaseline="#+id/textViewNegativePoints"
android:layout_alignBottom="#+id/textViewNegativePoints"
android:layout_alignLeft="#+id/textView3"
android:layout_marginLeft="3dp"
android:text="33"
android:textAppearance="?android:attr/textAppearanceSmall" />
<ImageView
android:id="#+id/imageView3"
android:layout_width="25dp"
android:layout_height="25dp"
android:layout_alignTop="#+id/imageView2"
android:layout_toRightOf="#+id/textViewNegativePoints"
android:src="#drawable/thumbs_down_focused" />
</RelativeLayout>
<RelativeLayout
android:id="#+id/relativeLayout5"
android:layout_width="95dp"
android:layout_height="80dp"
android:layout_alignRight="#+id/relativeLayout3"
android:layout_alignTop="#+id/relativeLayout4"
android:layout_toRightOf="#+id/textView7"
android:orientation="vertical" >
<TextView
android:id="#+id/textView4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="5dp"
android:text="Comments"
android:textAppearance="?android:attr/textAppearanceMedium" />
<ImageView
android:id="#+id/imageView1"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:src="#drawable/speech_bubble" />
</RelativeLayout>
<RelativeLayout
android:id="#+id/relativeLayout3"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/relativeLayout4"
android:layout_centerHorizontal="true"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:layout_marginTop="10dp" >
<TextView
android:id="#+id/textViewOfferName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="10dp"
android:text="Offer Name"
android:textAppearance="?android:attr/textAppearanceLarge" />
<TextView
android:id="#+id/textViewBusinessName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="35dp"
android:text="Business Name"
android:textAppearance="?android:attr/textAppearanceMedium" />
<TextView
android:id="#+id/textViewBusinessAddress"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="60dp"
android:text="Business Address"
android:textAppearance="?android:attr/textAppearanceMedium" />
<TextView
android:id="#+id/textViewNull1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="80dp"
android:textAppearance="?android:attr/textAppearanceLarge" />
<TextView
android:id="#+id/textViewTotalPoints"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/textViewNull1"
android:layout_centerHorizontal="true"
android:text="0/0"
android:textAppearance="?android:attr/textAppearanceLarge" />
<Button
android:id="#+id/buttonUseNow"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/textViewTotalPoints"
android:layout_centerHorizontal="true"
android:layout_marginTop="10dp"
android:text="#string/offer_details_use_now" />
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="#+id/buttonUseNow"
android:layout_marginTop="10dp"
android:text="#string/_terms_and_conditions_"
android:textAppearance="?android:attr/textAppearanceSmall" />
<TextView
android:id="#+id/textViewTermsConditions"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="#+id/textView2"
android:layout_marginTop="2dp"
android:textAppearance="?android:attr/textAppearanceSmall" />
</RelativeLayout>
<TextView
android:id="#+id/textView7"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/relativeLayout5"
android:layout_centerHorizontal="true"
android:layout_marginBottom="30dp"
android:text="e"
android:textAppearance="?android:attr/textAppearanceSmall"
android:visibility="invisible" />
</RelativeLayout>
</ScrollView>
</RelativeLayout>
Anyone have ideas of how I can make the RelativeLayout2 to have the same height as the ScrollView, meaning, I want it to reach the bottom of the screen?
Thanks and regards,
Felipe

I have faced this problem before. Just Use android:fillViewport="true" in your scrollview and it will fill up the screen.
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/scrollView1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:fillViewport="true" >

Categories

Resources