Reputation: 513
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
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
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