Xedron
Xedron

Reputation: 19

Android: How to fix the image that is overlapping my text?

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>

SCREENSHOT OF ERROR: Error

Upvotes: 1

Views: 1952

Answers (3)

nhoxbypass
nhoxbypass

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

josedlujan
josedlujan

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

Brian
Brian

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

Related Questions