Jasper
Jasper

Reputation: 8705

Android: Right-Aligning ImageView in LinearLayout

The imageView is not getting right-aligned in this linearlayout (If it matters this LinearLayout is actually a row in a list).

But if i use a TextView (its commented in code below) instead of ImageView, it successfully gets right-aligned.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:background="#FFFFAA"
    android:orientation="horizontal" >

    <TextView
        android:id="@+id/txtTitle"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Title"
        android:textAppearance="?android:attr/textAppearanceMedium" />

<!--
    <TextView
        android:id="@+id/labelNext"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:gravity="right"
        android:text="> "
        android:textSize="20sp" 
        android:textStyle="bold">
    </TextView>
-->

     <ImageView
        android:id="@+id/iconNext"
        android:layout_width="25dp"
        android:layout_height="25dp"
        android:layout_gravity="right"
        android:layout_weight="1"
        android:gravity="right"
        android:src="@drawable/right_arrow" >
    </ImageView>     
</LinearLayout>

How do i get the imageView to the right-most edge of the LinearLayout row?

Upvotes: 0

Views: 10099

Answers (3)

Lamorak
Lamorak

Reputation: 11137

If you only need a TextView with image on the right consider using a android:drawableRight parameter. Both LinearLayout with weights and RelativeLayout run measurement twice so leaving just TextView will be computationally faster.

<TextView
    android:id="@+id/txtTitle"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:text="Title"
    android:textAppearance="?android:attr/textAppearanceMedium"
    android:drawableRight="@drawable/right_arrow" />

(Also please note that the arrow in ListView is against Android design guidelines)

Upvotes: 3

Palejandro
Palejandro

Reputation: 2351

Or you can add empty view between your imageView and textView that fill empty space between them and your second textview will be "pushed" to right side:

 <View
        android:layout_width="0dp"
        android:layout_height="1dp"
        android:layout_weight="1"/>

Setting width to 0 and weight to 1 causes this view to fill whole available space, that is not used by other views. So it's size will be

width = (screenWidth-(imageView width+textView width))

Upvotes: 3

Harsh Dattani
Harsh Dattani

Reputation: 2129

Use a RelativeLayout instead of LinearLayout because LinearLayout does not support it. Use like this:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:background="#FFFFAA" >

    <TextView
        android:id="@+id/txtTitle"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Title"
        android:textAppearance="?android:attr/textAppearanceMedium" />

     <ImageView
        android:id="@+id/iconNext"
        android:layout_width="25dp"
        android:layout_height="25dp"
        android:layout_gravity="right"
        android:layout_weight="1"
        android:layout_alignParentRight="true"
        android:src="@drawable/right_arrow" >
    </ImageView>     
</RelativeLayout>

Upvotes: 5

Related Questions