CODEWITHSUNDEEP
javaandroidandroid-layout
André Silva
André Silva

Reputation: 37

TextView disappearing when I try to put it in front of my ImageView

I have a horizontal scroll view with a Relative Layout inside it which has 3 ImageViews. Each image view displays an image of a certain country. My goal is to have a TextView in front of each ImageView displaying the country name. The problem is, whenever I try to put my TextView in front of my ImageView, it disappears... Do you guys have any idea why? Is Relative Layout the best way to handle this?

Here is something to help you guys understand it better: This is an example of the card view. The country displayed is Slovenia.

I want that TextView "Eslovénia" to be at the bottom left of the imageview

I've already tried Relative Layout, Constraint Layout, Linear Layout and Frame Layout. I've seen all the previously asked questions here on StackOverflow and none of them solved my problem. Thanks in advance!

EDIT:

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout 
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/colorWhite"

>

<TextView
    android:id="@+id/txtDescHome3"
    android:layout_width="278dp"
    android:layout_height="26dp"
    android:layout_alignParentStart="true"
    android:layout_alignParentTop="true"
    android:layout_marginStart="32dp"
    android:layout_marginTop="59dp"
    android:text="@string/sloganHome"
    android:textColor="#323B45"
    android:textSize="20sp"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintHorizontal_bias="0.0"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent"
    app:layout_constraintVertical_bias="0.0" />

<TextView
    android:id="@+id/txtTitleHome3"
    android:layout_width="wrap_content"
    android:layout_height="31dp"
    android:layout_above="@+id/txtDescHome3"
    android:layout_alignStart="@+id/txtDescHome3"
    android:layout_marginBottom="-59dp"
    android:text="@string/ExploreTitulo"
    android:textColor="#323B45"
    android:textSize="24sp"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintHorizontal_bias="0.108"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent"
    app:layout_constraintVertical_bias="0.025" />

<HorizontalScrollView
    android:id="@+id/scrlVPrincipal2"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true"
    android:layout_alignParentStart="true"
    android:layout_marginTop="32dp"
    android:scrollbars="none"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintTop_toBottomOf="@+id/txtDescHome3"
    app:layout_constraintVertical_bias="1.0"
    tools:ignore="MissingConstraints"
    tools:layout_editor_absoluteX="0dp">

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal">

        <ImageView
            android:id="@+id/imgCard1"
            android:layout_width="259dp"
            android:layout_height="390dp"
            android:layout_alignParentStart="true"
            android:layout_alignParentTop="true"
            android:layout_weight="2"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintHorizontal_bias="0.504"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            app:layout_constraintVertical_bias="0.801" />

        <TextView
            android:id="@+id/txtNomePais"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentStart="true"
            android:layout_centerVertical="true"
            android:layout_marginStart="53dp"
            android:layout_weight="1"
            android:text="TextView"
            android:textSize="24sp"
            app:layout_constraintBottom_toTopOf="@+id/scrlVPrincipal2"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintHorizontal_bias="0.064"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            app:layout_constraintVertical_bias="1.0" />

        <ImageView
            android:id="@+id/imgCard3"
            android:layout_width="259dp"
            android:layout_height="390dp"
            android:layout_alignParentStart="true"
            android:layout_alignTop="@+id/imgCard1"
            android:layout_marginStart="289dp"
            android:layout_weight="1"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintHorizontal_bias="0.0"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            app:layout_constraintVertical_bias="0.8" />

        <ImageView
            android:id="@+id/imgCard2"
            android:layout_width="259dp"
            android:layout_height="390dp"
            android:layout_alignParentTop="true"
            android:layout_alignStart="@+id/imgCard1"
            android:layout_weight="1"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintHorizontal_bias="0.006"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            app:layout_constraintVertical_bias="0.0" />

    </RelativeLayout>

 </HorizontalScrollView>

</android.support.constraint.ConstraintLayout>

Upvotes: 0

Views: 892

Answers (5)

Sudhir Kumar
Sudhir Kumar

Reputation: 1

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <ImageView
        android:id="@+id/image_view"
        android:layout_width="200dp"
        android:layout_height="300dp"
        android:src="#852"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        />


        <TextView
            android:id="@+id/tv"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginBottom="20dp"
            android:layout_marginRight="6dp"
            android:background="#000"
            android:text="Text......"
            android:paddingTop="5dp"
            android:gravity="center_vertical"
            android:textColor="#fff"
            app:layout_constraintBottom_toBottomOf="@+id/image_view"
            app:layout_constraintEnd_toEndOf="@+id/image_view"
            app:layout_constraintStart_toStartOf="@+id/image_view"
            />

</android.support.constraint.ConstraintLayout>

Upvotes: 0

Zakir hussain
Zakir hussain

Reputation: 392

I have tried as per my understanding and I have also attached screenshot please useenter image description here the below code 

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@android:color/white"

    >

    <TextView
        android:id="@+id/txtDescHome3"
        android:layout_width="0dp"
        android:layout_height="26dp"
        android:layout_alignParentStart="true"
        android:layout_alignParentTop="true"
        android:layout_marginBottom="412dp"
        android:layout_marginEnd="16dp"
        android:layout_marginStart="16dp"
        android:layout_marginTop="16dp"
        android:text="@string/sloganHome"
        android:textColor="#323B45"
        android:textSize="20sp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/txtTitleHome3" />

    <TextView
        android:id="@+id/txtTitleHome3"
        android:layout_width="0dp"
        android:layout_height="31dp"
        android:layout_above="@+id/txtDescHome3"
        android:layout_alignStart="@+id/txtDescHome3"
        android:layout_marginEnd="16dp"
        android:layout_marginStart="16dp"
        android:layout_marginTop="16dp"
        android:text="@string/ExploreTitulo"
        android:textColor="#323B45"
        android:textSize="24sp"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <HorizontalScrollView
        android:id="@+id/horizontalScrollView"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_marginBottom="16dp"
        android:layout_marginEnd="16dp"
        android:layout_marginStart="16dp"
        android:layout_marginTop="16dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.0"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/txtDescHome3"
        app:layout_constraintVertical_bias="0.851">

        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:orientation="horizontal">

            <RelativeLayout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content">


                <ImageView
                    android:id="@+id/imageView"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_alignParentStart="true"
                    android:layout_alignParentTop="true"
                    android:scaleType="fitXY"
                    android:src="@drawable/bg"
                    android:visibility="visible" />


                <TextView
                    android:id="@+id/textView18"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_centerInParent="true"
                    android:text="jbdfjbvjcbvdkjbvdkjb"
                    android:textAppearance="@style/TextAppearance.AppCompat.Title"
                    android:textColor="@android:color/holo_blue_bright"
                    android:textSize="14sp"
                    android:textStyle="bold"
                    android:visibility="visible" />

            </RelativeLayout>

        </LinearLayout>
    </HorizontalScrollView>
</android.support.constraint.ConstraintLayout>

Upvotes: 1

rya
rya

Reputation: 1506

use framelayout as follows:

  <FrameLayout android:layout_height="200dp"
    android:layout_width="200dp">

    <ImageView android:layout_height="match_parent"
        android:layout_width="match_parent"
        android:src="@color/Black"/>
    <TextView android:layout_height="wrap_content"
        android:layout_width="match_parent"
        android:text="asdf"
        android:textColor="#fff"
        android:textAlignment="center"
        android:layout_gravity="bottom"/>
</FrameLayout>

Upvotes: 3

Sahil
Sahil

Reputation: 972

Try putting your textview after imageview in layout xml, for an example :

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


<ImageView
    android:id="@+id/image_splash_screen"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_gravity="center
    android:background="@drawable/splash_bg" />

<TextView
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:textColor="@color/white"
    android:textSize="55dp"
    android:text="sample"/>


</FrameLayout>

Upvotes: 2

Henry
Henry

Reputation: 343

Do a frame layout. In that frame layout, you put an imageView and a relativelayout. The image goes in the imageView and everything else goes in the RelativeLayout. The RelativeLayout will be on top of your image them.

Example (NOT based on your example - just something from one of my projects):

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"

xmlns:ads="http://schemas.android.com/apk/res-auto"

android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.x.x">

<ImageView
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:id="@+id/imageView"
    android:src="@drawable/img"
    android:scaleType = "centerCrop"
    />


<RelativeLayout 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:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="com.x.y">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textAppearance="?android:attr/textAppearanceLarge"

        android:text="YOUR TEXT"

        android:textColor="#f3ffe3"
        android:textSize="50dp"
        android:id="@+id/textView2"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="95dp" />


</RelativeLayout>
</FrameLayout>

Upvotes: 1

Related Questions