TextView Width is not adjusting as the content inside it even after wrap content

Question

I have a text inside TextView which I want to be in single line on larger screen sizes devices and two lines on smaller screen size devices. I also have an image on right of it.

Now the issue is the size of TextView is coming bigger than the content inside it, even it is a wrap content, which creates extra unnecessary space between textview and image view.

My Code :

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

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="60dp"
        android:background="#FFFFFF"
        android:gravity="center"
        android:paddingLeft="40dp"
        android:paddingRight="40dp"
        >


        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Please Fit my width according tothecontentinsideme"
            android:textColor="#000000"
            android:background="#11DDFF"
            android:textSize="22sp"
            android:fontFamily="din-condensed"
            android:layout_centerVertical="true"
            android:layout_toLeftOf="@+id/rightArrowImage"
            android:textStyle="bold"/>

        <ImageView
            android:id="@+id/rightArrowImage"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="10dp"
            android:src="@drawable/scoretracker_reedem_rewards_arrow"
            android:layout_centerVertical="true"
            android:layout_alignParentRight="true"
            />


    </RelativeLayout>

</RelativeLayout>

Output :

UPDATE

I tried what dieter_h suggested

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

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="60dp"
        android:background="#FFFFFF"
        android:gravity="center"
        android:paddingLeft="40dp"
        android:paddingRight="40dp"
        android:orientation="horizontal"
        >


        <TextView
            android:id="@+id/textView"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Please Fit my width according tothecontentinsideme"
            android:textColor="#000000"
            android:background="#11DDFF"
            android:textSize="22sp"
            android:textStyle="bold"/>

        <ImageView
            android:id="@+id/rightArrowImage"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="10dp"
            android:src="@drawable/scoretracker_reedem_rewards_arrow"
            />


    </LinearLayout>

</RelativeLayout>

OUTPUT NOW :

In which layout , Linear one or Relative one ? BTW I have tried in both same results no difference. — Piyush Agarwal, Aug 23 '15 at 10:50
The longer I look at the pictures the more I think that the width of TextView measured with wrap_content is simply not enough to fit into the room left after ImageView's width and margins all together. By me it's an expected behavior which is not observed once the text size is smaller. Say, are those pictures taken from a phone screen in portrait mode? — Onik, Aug 23 '15 at 15:15
Well, if I'm right, without overriding any methods of View, you could decrease margins and text size, or create different layouts for different screen sizes, letting a single line of text for bigger sizes and 2 lines for smaller ones. — Onik, Aug 23 '15 at 15:44

Skizo-ozᴉʞS ツ · Answer 1 · 2015-08-23T12:27:47.090

Try this xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="60dp"
        android:background="#FFFFFF"
        android:gravity="center"
        android:paddingLeft="20dp"
        android:paddingRight="20dp"
        android:orientation="horizontal"
        >
        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content">
        <TextView
            android:layout_width="301dp"
            android:layout_height="wrap_content"
            android:text="Please Fit my width according tothecontentinsideme"
            android:textColor="#000000"
            android:id="@+id/TextView2"
            android:background="#11DDFF"
            android:textSize="22sp"
            android:textStyle="bold"/></LinearLayout>
        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content">
    <ImageView
        android:id="@+id/rightArrowImage"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@mipmap/ic_launcher"

        />
        </LinearLayout>
    </LinearLayout>
</RelativeLayout>

This is how it looks :

Final EDIT

I made a new xml try this out

    <?xml version='1.0' encoding='utf-8'?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:background="#fff"
    android:paddingLeft="20dp"
    android:paddingRight="20dp"
    android:layout_gravity="center_horizontal"
    android:orientation="horizontal" >

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:background="#fff"
        android:gravity="center"
        android:orientation="horizontal"
        tools:ignore="DisableBaselineAlignment" >



        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:gravity="center"

            android:layout_weight="0.5"
            android:orientation="horizontal"
            >

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:textColor="#000"
                android:textStyle="bold"
                android:textSize="15sp"
                android:background="#11DDFF"
                android:text="Please Fit my width according tothecontentinsideme"
                tools:ignore="HardcodedText"
                android:id="@+id/textViewTitleDialog"
                />

        </LinearLayout>
        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"

            android:gravity="center"
            android:orientation="horizontal" >

            <ImageView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:contentDescription="@string/app_name"

                android:src="@mipmap/ic_launcher"
                android:id="@+id/asd" />
        </LinearLayout>
    </LinearLayout>

</LinearLayout>

This is the output

Hope it is what you want :)

Thank you, I have copy pasted your code as it is, but here results are same as my earlier one. I am wondering why ? Put your entire xml once . — Piyush Agarwal, Aug 23 '15 at 11:57
Hey you have fixed the width, I knew this trick but the problem is it will not come in single line for bigger screen size, which is what I require. — Piyush Agarwal, Aug 23 '15 at 12:07
No, I dont want this way. The extra space in left image I don't want. Width should be till the text ends. I think with xml we cannot solve this. Need to override TextView onMeasure(), But I have no idea how can I achieve my required results doing that. — Piyush Agarwal, Aug 23 '15 at 12:55
well.. I tried my best I'm out of ideas... if you want to override the onMeasure() just take a look on this answers [this](http://stackoverflow.com/questions/9494037/how-to-set-text-size-of-textview-dynamically-for-different-screens), [this](http://stackoverflow.com/a/15323079/4385913) — Skizo-ozᴉʞS ツ, Aug 23 '15 at 12:59

TextView Width is not adjusting as the content inside it even after wrap content

1 Answers1

Final EDIT