user1276092
user1276092

Reputation: 513

how to adjust the width of Android TextView dynamically

I have RelativeLayout in which I place a TextView to the left of a button which is alligned parent right. So, when the text to be displayed in TextView increases more than wrap_Content then it overlaps on Button. So, I need a solution to display the exceeded Text in next line. Can anyone help me in sorting out this issue ?
In the below layout if the TextView2's Text is "11111111111111111111111" it will overlap with TextView1 . How to prevent that ?
my layout is as below :

    <ImageView
    android:id="@+id/imageView1"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentLeft="true"
    android:layout_centerVertical="true"
    android:layout_margin="10dp"
    android:scaleType="fitXY"
    android:src="@drawable/icon" >
    </ImageView>

     <TextView
    android:id="@+id/textView1"
    android:layout_width="wrap_content"
      android:layout_height="wrap_content"
    android:layout_alignTop="@+id/imageView1"
    android:layout_margin="5dp"
    android:text="TextView"
    android:textSize="22dp" 
    android:layout_toRightOf="@id/imageView1"
    >
        </TextView>

 <Button
    android:id="@+id/button1"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentRight="true"
    android:focusable="false"
    android:text="Button" 
    android:layout_alignTop="@+id/imageView1"

    >
</Button> 

<TextView
    android:id="@+id/textView2"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_toLeftOf="@id/button1"
    android:text="TextView222"
    android:textSize="22dp"
    android:layout_margin="5dp"
    android:layout_alignTop="@+id/imageView1"
    android:ellipsize="end"
    >
</TextView>


In the above layout if the TextView2's Text is "11111111111111111111111" it will overlap with TextView1 . How to prevent that

Upvotes: 0

Views: 839

Answers (2)

Yuri Popiv
Yuri Popiv

Reputation: 529

based on @Sam solution I added android:layoutDirection="rtl" for desired result

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

                    <TextView
                        android:id="@+id/text"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_toLeftOf="@+id/button"
                        android:text="1111111111111111111111111111111111111"/>

                    <Button
                        android:id="@+id/button"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_alignParentRight="true"
                        android:text="Potatoe"/>

                </RelativeLayout>

Upvotes: 0

Sam
Sam

Reputation: 86948

Simply add android:layout_toLeftOf="@+id/button" to your TextView to keep it from colliding with your Button.

It will look like this:

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

    <TextView
        android:id="@+id/text"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_toLeftOf="@+id/button"
        android:text="11111111111111111111111111111111111111111111111111111111111111111111111111111111111"/>

    <Button
        android:id="@+id/button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:text="Potatoe"/>

</RelativeLayout>

You have changed the question... but I'll answer this new one too. You might be trying to squeeze too much into one row. However let's change your layout to a horizontal LinearLayout and use a couple layout_weight attributes:

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

    <ImageView
        android:id="@+id/imageView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_margin="10dp"
        android:scaleType="fitXY"
        android:src="@drawable/ic_launcher"/>

    <TextView
        android:id="@+id/textView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_margin="5dp"
        android:layout_weight="1"
        android:text="111111111111111111111111111111111"
        android:textSize="22dp"/>

    <TextView
        android:id="@+id/textView2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_margin="5dp"
        android:layout_weight="1"
        android:ellipsize="end"
        android:text="222222222222222222222222222222222"
        android:textSize="22dp"/>

    <Button
        android:id="@+id/button1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:focusable="false"
        android:text="Button"/>

</LinearLayout>

As a note: textView2 does not wrap around to a new line because you used the ellipse attribute. Good luck!

Upvotes: 2

Related Questions