Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Keep ImageView on the right size of the text and yet prevent long text to push it out of view?

The situation is the same no matter if I use LinearLayout or RelativeLayout. I think this is a old Android XMl bug, but I have no idea why it still exists.

Namely, in a layout where an ImageView is on the right side of a TextView can disappear from the screen when text becomes too long. It simply pushes it off the screen. I must NOT make TextView single line.

Here is the XML.

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
          android:layout_width="match_parent"
          android:layout_height="match_parent"
>

<TextView
    android:id="@+id/txt"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="some long text blahblahblahblahblah"
    android:textAppearance="?android:attr/textAppearanceMedium"
    android:textSize="17sp"
    android:layout_marginRight="10dp"
    android:layout_centerVertical="true"
    />

<ImageView
    android:layout_toRightOf="@+id/txt"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:src="@drawable/key"
    android:layout_centerVertical="true"
    />
</RelativeLayout>

I cannot use layout_weight attribute as image will then stick to the right side of the screen. It HAS to be on the right side of the text.

Anyone has any ideas how to solve this bug?

Check images when the text is short and long. On the 2nd image the text is long and the image is being pushed away from the screen.

like image 874
sandalone Avatar asked Sep 02 '25 14:09

sandalone


1 Answers

You can achieve your task, if you use the layout_weight properly. Please refer the code below:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content"
    android:layout_height="match_parent"
    android:orientation="horizontal"
    >

    <TextView
        android:id="@+id/txt"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:text="The quick brown fox jumps over the lazy dog. As you can see it easily handles the long length of the text"
        android:textAppearance="?android:attr/textAppearanceMedium"
        android:textSize="17sp"
        android:layout_marginRight="10dp"

        />

    <ImageView

        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/ic_launcher"
        />
</LinearLayout>

The output for long text:Output for long text

The output for short text: enter image description here

EDIT: This works because of the layout whose width is set as wrap_content. If it were match_parent then in all cases, all the extra space would have been given to TextView because of it's layout_weight but since the parent is wrap_content, there is no extra space for the TextView to fill when the text is small. But when the text is large, the weight property is applied to the TextView but since there is no layout_weight for the ImageView hence, it takes only the amount of space it has to.

like image 83
Eric B. Avatar answered Sep 05 '25 03:09

Eric B.



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!