Making icons right aligned in Android

Question

I am trying to set two icons (Share and Heart icon) one after the other and right aligned strangely one doesn't get shown. Something like this:

I am trying all the ways but not able achieve it. what could be wrong. The below is what I am looking at:

And the code I have tried:

         <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="390dp"
            android:id="@+id/imageRelativeLayout"
            android:visibility="visible"
            android:background="@android:color/white">

            <TextView
                android:id="@+id/labelProductModel"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginLeft="4dp"
                android:layout_marginTop="4dp"
                android:ellipsize="end"
                android:visibility="visible"
                android:ems="12"
                android:text="Product Code"
                android:textSize="12sp" />

            <TextView
                android:id="@+id/labelProductName"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginLeft="4dp"
                android:layout_below="@+id/labelProductModel"
                android:ellipsize="end"
                android:ems="12"
                android:visibility="visible"
                android:text="Product Name"
                android:textSize="16sp"/>

            <ImageView
                android:id="@+id/imageProduct"
                android:layout_width="match_parent"
                android:layout_height="220dp"
                android:layout_below="@+id/labelProductName"
                android:src="@drawable/action_video"
                android:contentDescription="@string/app_name"
                android:padding="4dp"/>

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="200dp"
                android:layout_alignParentBottom="true"
                android:layout_below="@+id/imageProduct"
                android:gravity="left">

                <android.support.v7.widget.RecyclerView
                    android:id="@+id/listImages"
                    android:layout_width="wrap_content"
                    android:layout_height="200dp"
                    android:paddingLeft="4dp"
                    android:paddingRight="4dp"
                    android:visibility="visible"/>

            </LinearLayout>

            <ImageView
                android:layout_width="35dp"
                android:layout_height="35dp"
                android:id="@+id/shareImage"
                android:paddingTop="5dp"
                android:contentDescription="@string/app_name"
                android:visibility="visible"
                android:src="@drawable/ic_share"/>

            <ImageView
                android:layout_width="35dp"
                android:layout_height="35dp"
                android:contentDescription="@string/app_name"
                android:layout_toRightOf="@+id/shareImage"
                android:id="@+id/favImage"
                android:visibility="visible"
                android:src="@drawable/ic_heart"/>

        </RelativeLayout>

Which icon are you talking about? Could you please take a screenshot and modify it in paint to show us the output you are expecting? — Alok Gupta, Feb 22 '16 at 06:25
@AlokGupta I think she is talking about the share and heart icons — Anoop LL, Feb 22 '16 at 06:28
@AnoopLL Thanks, but is the below image the one that she wants? — Alok Gupta, Feb 22 '16 at 06:29

score 5 · Accepted Answer · answered Feb 22 '16 at 06:31

5

1- align your 'favImage' to the right:

android:layout_alignParentRight="true"

2- set your 'shareImage' to the left of it:

android:layout_toLeftOf="@+id/favImage"

answered Feb 22 '16 at 06:31

derfect

622
2
6
14

kevz · Answer 2 · 2016-02-22T06:38:44.403

try below xml -

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="390dp"
android:id="@+id/imageRelativeLayout"
android:visibility="visible"
android:background="@android:color/white"
xmlns:android="http://schemas.android.com/apk/res/android">

<TextView
    android:id="@+id/labelProductModel"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginLeft="4dp"
    android:layout_marginTop="4dp"
    android:ellipsize="end"
    android:visibility="visible"
    android:ems="12"
    android:text="Product Code"
    android:textSize="12sp" />

<TextView
    android:id="@+id/labelProductName"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginLeft="4dp"
    android:layout_below="@+id/labelProductModel"
    android:ellipsize="end"
    android:ems="12"
    android:visibility="visible"
    android:text="Product Name"
    android:textSize="16sp"/>

<ImageView
    android:id="@+id/imageProduct"
    android:layout_width="match_parent"
    android:layout_height="220dp"
    android:layout_below="@+id/labelProductName"
    android:src="@drawable/action_video"
    android:contentDescription="@string/app_name"
    android:padding="4dp"/>

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="200dp"
    android:layout_alignParentBottom="true"
    android:layout_below="@+id/imageProduct"
    android:gravity="left">

    <android.support.v7.widget.RecyclerView
        android:id="@+id/listImages"
        android:layout_width="wrap_content"
        android:layout_height="200dp"
        android:paddingLeft="4dp"
        android:paddingRight="4dp"
        android:visibility="visible"/>

</LinearLayout>

<ImageView
    android:layout_width="35dp"
    android:layout_height="35dp"
    android:id="@+id/shareImage"
    android:paddingTop="5dp"
    android:contentDescription="@string/app_name"
    android:visibility="visible"
    android:src="@drawable/ic_share"
    android:layout_toLeftOf="@+id/favImage" />

<ImageView
    android:layout_width="35dp"
    android:layout_height="35dp"
    android:contentDescription="@string/app_name"
    android:id="@+id/favImage"
    android:visibility="visible"
    android:src="@drawable/ic_heart"
    android:layout_alignParentRight="true" />

I am looking at an output similar to what I have posted I don't want the image to be below productName. :( — Sanjana Nair, Feb 22 '16 at 06:31
@SanjanaNair: I have corrected the answer. My bad I didn't checked if its properly aligned. — kevz, Feb 22 '16 at 06:46

Making icons right aligned in Android

2 Answers2