RelativeLayout hides prior LinearLayout

Question

I have an XML representing single line in some app, containing name, grade, and picture.

Name + Grade are vertically set in the line, to the left, and my intention is to get the picture to be on the right side of the line.

I'm trying to use RelativeLayout, in order to align an ImageView to the right side of screen, as I understood this is the correct way to do this, but it hides my other layouts -

Only the image view is visible when using it.

Tried changing the layout width\height to match parent but that didn't help.

What is it i'm misunderstading? What is my incorrect usage here?

XML:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/ll_line"
    android:layout_height="wrap_content"
    android:layout_width="match_parent"
    android:orientation="horizontal"
    android:background="#FF00">

    <LinearLayout
        android:layout_height="wrap_content"
        android:layout_width="wrap_content"
        android:layout_weight="1"
        android:orientation="vertical"
        android:gravity="start|center">

        <TextView
            android:id="@+id/tv_name"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="@string/tv_example"
            android:textSize="25sp"
            android:textStyle="bold"
            android:textAlignment="center"
            android:maxLines="1"
            android:ellipsize="end"
            android:padding="2dp"
            android:background="@color/transparent"
            android:focusable="false">
        </TextView>

        <TextView
            android:id="@+id/tv_grade"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:inputType="number"
            android:text="@string/tv_example"
            android:textSize="20sp"
            android:textStyle="bold|italic"
            android:textAlignment="center"
            android:maxLines="1"
            android:ellipsize="end"
            android:padding="2dp"
            android:background="@color/transparent"
            android:focusable="false">
        </TextView>
    </LinearLayout>

    <RelativeLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content">
        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:id="@+id/iv_pic"
            android:layout_alignParentRight="true"/>
    </RelativeLayout>
</LinearLayout>

Answer 1

Use RelativeLayout make everything become easier

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/ll_line"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:paddingTop="50dp">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_toLeftOf="@+id/iv_pic"
        android:gravity="start|center"
        android:orientation="vertical">

        <TextView
            android:id="@+id/tv_name"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="@android:color/transparent"
            android:ellipsize="end"
            android:focusable="false"
            android:singleLine="true"
            android:padding="2dp"
            android:text="tv_exampleaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa"
            android:textAlignment="center"
            android:textSize="25sp"
            android:textStyle="bold" />

        <TextView
            android:id="@+id/tv_grade"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="@android:color/transparent"
            android:ellipsize="end"
            android:focusable="false"
            android:inputType="number"
            android:singleLine="true"
            android:padding="2dp"
            android:text="tv_example"
            android:textAlignment="center"
            android:textSize="20sp"
            android:textStyle="bold|italic" />
    </LinearLayout>


    <ImageView
        android:id="@+id/iv_pic"
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:layout_alignParentRight="true"
        android:background="#ff0000" />
</RelativeLayout>

Hope this it what you want