TextView in LinearLayout not wrapping and going under ImageView

Question

There are many similar questions for which the solution is adding layout_weight="1" to the text view. I tried that but it didn't help me. My scenario is different. Don't consider it duplicate.

Below is the layout which I wanted to make. TextView should wrap if there is an image in the image view. If there is no image, it should be as it is.

Below is the code I tried so far

<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="5dp"
app:cardBackgroundColor="@android:color/white"
app:cardCornerRadius="2dp">

<RelativeLayout
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:padding="10dp">
    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="start"
        android:layout_alignParentStart="true"
        android:gravity="start|center_vertical"
        android:orientation="vertical">
        <TextView
            android:id="@+id/textView1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="some text here"/>
        <TextView
            android:id="@+id/textView2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="some text here which should wrap depending upon
            the string length and also considering whether or not there is an image adjacent to it"/>
        <TextView
            android:id="@+id/textView3"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="some text here"/>
    </LinearLayout>
    <ImageView
        android:id="@+id/imageView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerVertical="true"
        android:layout_alignParentEnd="true"
        android:layout_marginEnd="10dp"
        android:adjustViewBounds="true"
        android:src="@drawable/save"/>
</RelativeLayout>
</android.support.v7.widget.CardView>

Below is the result of this code. TextView is going under the ImageView without wrapping.

Is my approach wrong. Could someone help me solve this. I'm using AndroidStudio 3.0 developing with min api level 21(if at all this matters). Thanks in advance

Answer 1

Change the RelativeLayout to LinearLayout and add orientation as horizontal. If it still not works, add weight to ImageView. It should work .

Answer 2

This will work exactly what you need. You don't need relative layout. change this relative layout with linearlayout as horizontal. then change vertical linearlayout width 0dp and add weight: 1

XML Code:

<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_margin="5dp"
    app:cardBackgroundColor="@android:color/white"
    app:cardCornerRadius="2dp">

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal">
        <LinearLayout
            android:layout_width="0dp"
            android:layout_weight="1"
            android:layout_height="wrap_content"
            android:orientation="vertical">
            <TextView
                android:id="@+id/textView1"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="some text here"
                android:layout_weight="1"/>
            <TextView
                android:id="@+id/textView2"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="some text here which should wrap depending upon
            the string length and also considering whether or not there is an image adjacent to it"/>
            <TextView
                android:id="@+id/textView3"
                android:layout_width="wrap_content"
                android:layout_weight="1"
                android:layout_height="wrap_content"
                android:text="some text here"/>
        </LinearLayout>

        <ImageView
            android:id="@+id/imageView"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:layout_marginStart="10dp"
            android:layout_marginEnd="10dp"
            android:adjustViewBounds="true"
            android:src="@mipmap/ic_launcher"/>
    </LinearLayout>
</android.support.v7.widget.CardView>

Answer 3

I don't think you need relative layout.

You should use this linear layout 5 times.

<?xml version="1.0" encoding="utf-8"?>
    <LinearLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto"

        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="start"
        android:orientation="horizontal">
        <TextView
            android:id="@+id/textView1"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:text="some text here which should wrap depending upon
        the string length and also considering whether or not there is an image adjacent to it"
            android:layout_weight="1"
            />
        <ImageView
            android:id="@+id/imageView"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerVertical="true"
            android:adjustViewBounds="true"
            android:src="@drawable/ic_launcher_background"
            />
    </LinearLayout> 

If there is no picture the textview it will work as you want