How to avoid overlap view in relative layout in android?
Solution 1
If you are using this kind of design than you should use linear Layout. and use Table Rows in it to display this kind of view.
and also use weight so that your view doesn't et overlap on other views. try like this:
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<TableRow
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:weightSum="10">
<TextView
android:id="@+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:textSize="30sp"
android:text="test"
android:layout_weight="5" />
<TextView
android:id="@+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@id/textView1"
android:textSize="20sp"
android:text="test"
android:layout_weight="5"/>
</TableRow>
</LinearLayout>
</ScrollView>
Hope it Helps!!
Solution 2
Use layout_toStartOf in the first item with second item +id under double quotes
<?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"
android:orientation="horizontal" >
<TextView
android:id="@+id/email"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:layout_toStartOf="@+id/selectaccount"
android:text="very long text which used to overlap over radio button"
android:textAppearance="?android:attr/textAppearanceMedium" />
<RadioButton
android:id="@+id/selectaccount"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true" />
</RelativeLayout>
note this argument in textview
android:layout_toStartOf="@+id/selectaccount"
An XML is read from top to bottom
so this is how the Layout is rendered in Android
- android:layout_toStartOf="@id/item means that item is defined above this line
- android:layout_toStartOf="@+id/item means that item will appear later somewhere below this line
Solution 3
Align the all the textviews to leftOf imageview like lastone :
android:layout_toLeftOf="@id/imageView1"
Solution 4
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:weightSum="1.0" >
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight=".5"
android:orientation="vertical" >
<TextView
android:id="@+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Large Text"
/>
<TextView
android:id="@+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Medium Text"
/>
<TextView
android:id="@+id/textView3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Medium Text"
/>
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight=".5"
android:orientation="vertical" >
<ImageView
android:id="@+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/ic_launcher" />
</LinearLayout>
Solution 5
I had a similar problem and tried pretty much everything suggested here and in other similar threads.
The one additional thing that did it for me was to add:
android:layout_toStartOf="@+id/youroverlappeditem"
so the overlapping item will only run up to the overlapped item.
layout_toLeftOf
was not enough on its own
and of course ellipsize="end"
was needed as appropriate.
Mine was for a recyclerview
with a relative layout.
Related videos on Youtube
Comments
-
user782104 almost 2 years
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" > <RelativeLayout android:layout_width="wrap_content" android:layout_height="wrap_content" > <TextView android:id="@+id/textView1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentTop="true" android:layout_alignParentLeft="true" android:textSize="30sp" /> <TextView android:id="@+id/textView2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_below="@id/textView1" android:textSize="20sp" /> <TextView android:id="@+id/textView3" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_below="@id/textView2" android:textSize="20sp" /> <TextView android:id="@+id/textView4" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_below="@id/textView3" android:textSize="20sp" /> <TextView android:id="@+id/textView5" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_below="@id/textView4" android:textSize="20sp" /> <TextView android:id="@+id/textView6" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_below="@id/textView5" android:textSize="20sp" /> <TextView android:id="@+id/textView7" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_below="@id/textView6" android:textSize="20sp" /> <TextView android:id="@+id/textView8" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_below="@id/textView7" android:textSize="20sp" /> <TextView android:id="@+id/textView9" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_below="@id/textView8" android:textSize="20sp" /> <Button android:id="@+id/button1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_below="@id/textView9" /> <TextView android:id="@+id/textView10" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="商店圖片:" android:textSize="15sp" android:layout_alignParentTop="true" android:layout_alignLeft="@id/imageView1" /> <ImageView android:id="@+id/imageView1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentRight="true" android:layout_below="@id/textView10" android:contentDescription="@string/top" /> </RelativeLayout>
Simple output: textview1 textview9 textview2 imageview1 . . . button1
The above layout is a page that divide horizitonally, for the left side , there is a list of textview and button , for the right side, there is an image view. The problem is: when the textview content is too long, the imageview will overlap the content of it, besides using bringtofront(), are there any way (in xml ) to resize the width of the text view if it overlap with image view?
-
g00dy over 10 yearsWhy don't you try putting
android:layout_alignParentTop="true"
toImageView
andandroid:layout_alignLeft="@id/textView1"
. Then putandroid:layout_below="@id/button1
totextView10
. -
g00dy over 10 yearsWhat's the general idea, you need all the
TextViews
one below the other and at the end aButton
(left column) and only oneImageView
to the right (right column)?
-
-
Harish Godara over 10 yearsYa all textview should be left align of imageview so that none of these textview will overlap the image
-
faizal over 9 yearsAs far as i know, if you are using layout_weight attribute, one of your dimensions(layout_height or layout_width) should be set to 0dp.
-
Armaan Stranger over 9 yearsYup..dats right, But here we didn't needed to set weight.it was just one property that i have showed. If we really want to set weight than we need to set 0dp either height or width.
-
Eric Cochran over 9 years+1 for "@+id/item means that item will appear later somewhere below this line. I never knew you could do that. I always reordered my Views in the xml. Thank you!
-
Vicky Chijwani almost 9 years@HarishGodara he meant you have to use
layout_toLeftOf
rather thanlayout_alignLeft
. I've updated your answer to the correct code. -
Admin almost 6 yearsHey @ArmaanStranger can you please help me with this stackoverflow.com/questions/49952965/…
-
Niall over 5 yearsThat doesn't help at all. Things in the "tools" namespace only affect what you see in the Android Studio visual preview, not what happens in the app running on a device.
-
Niall over 5 yearsIn case anyone's confused by the wording, +id denotes declaration of a new ID, it's not specifically related to things being "above" or "below". It's just like declaring a variable before you use it in code. The first time you want to use an ID, you have to declare it.