Reputation: 19
How do I fix this error. Basically, the image is overlapping the text. Can we fix this in XML ?
Here's the code (Of course, it's incomplete).
<?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:background="#FFCC0000"
>
<TextView
android:background="#55000000"
android:id="@+id/centerButton"
android:text="RELATIVE LAYOUT RULES!"
android:textSize="33dp"
android:textColor="#FFFFFF"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"/>
<Button
android:layout_margin="40dp"
android:padding="20dp"
android:layout_below="@+id/centerButton"
android:layout_centerInParent="true"
android:text="PUSH ME!"
android:textSize="30dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/button4" />
<ImageView
android:scaleType="centerInside"
android:id="@+id/imageView3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/Cat"
android:layout_above="@+id/centerButton"
android:layout_alignParentStart="true"
android:layout_marginBottom="39dp" />
</RelativeLayout>
Upvotes: 1
Views: 1952
Reputation: 10152
Android draw the layout in other of the other from top to bottom in XML file. If you want your TextView draw above, you need to bring it to the bottom.
Upvotes: 0
Reputation: 5600
Change the order TextView -> ImageView to ImageView -> TextView
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#FFCC0000"
>
<ImageView
android:scaleType="centerInside"
android:id="@+id/imageView3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/Cat"
android:layout_above="@+id/centerButton"
android:layout_alignParentStart="true"
android:layout_marginBottom="39dp" />
<TextView
android:background="#55000000"
android:id="@+id/centerButton"
android:text="RELATIVE LAYOUT RULES!"
android:textSize="33dp"
android:textColor="#FFFFFF"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"/>
<Button
android:layout_margin="40dp"
android:padding="20dp"
android:layout_below="@+id/centerButton"
android:layout_centerInParent="true"
android:text="PUSH ME!"
android:textSize="30dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/button4" />
</RelativeLayout>
Upvotes: 1
Reputation: 8095
Not sure what you're exactly looking for but I can think of two quick solutions:
First off, you need to change the TextView
's id
tag to something else, it currently has the same id
as your Button
which is not good. I think you mean centerText
.
1. You want the TextView
to appear over the ImageView
To achieve that you actually just need to move the TextView
XML element below the ImageView
element. Because Views are "layered" in top to bottom order in terms of the XML layout, this will place the TextView
on top of the ImageView
.
2. You want the ImageView
to simply not overlap the TextView
You could change android:layout_above="@+id/centerButton"
to android:layout_above="@+id/centerText"
where centerText
is your TextView
with the corrected id
tag of course.
Hopefully that solves your problem! If not, please be a bit more specific about what you're looking to achieve!
Upvotes: 1