How to place an image over another image in android

Question

In my android app, I want to display an ImageView over anoher ImageView. In the design tab, I get what I want, But when I run the app, the second ImageVIew disappear, Here's my code, , I add elevation attribute but I don't get what I want as result.

<androidx.constraintlayout.widget.ConstraintLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content">

                <ImageView
                    android:id="@+id/mainImageProduct"
                    android:layout_width="250dp"
                    android:layout_height="250dp"
                    android:layout_marginTop="@dimen/spacing_large"
                    android:visibility="visible"
                    android:scaleType="centerCrop"
                    android:adjustViewBounds="true"
                    app:layout_constraintBottom_toBottomOf="parent"
                    app:layout_constraintEnd_toEndOf="parent"
                    app:layout_constraintStart_toStartOf="parent"
                    app:layout_constraintTop_toTopOf="parent"
                    tools:src="@drawable/image1" />

                <ImageView
                    android:id="@+id/plusOne"
                    android:layout_width="50dp"
                    android:layout_height="50dp"
                    android:elevation="4dp"
                    app:layout_constraintBottom_toBottomOf="@+id/mainImageProduct"
                    app:layout_constraintEnd_toEndOf="@+id/mainImageProduct"
                    app:layout_constraintStart_toEndOf="@+id/mainImageProduct"
                    app:layout_constraintTop_toTopOf="@+id/mainImageProduct"
                    tools:src="@drawable/plus_in_white_circle" />

            </androidx.constraintlayout.widget.ConstraintLayout>

Does this answer your question? [Android ConstraintLayout - Put one view on top of another view](https://stackoverflow.com/questions/44351354/android-constraintlayout-put-one-view-on-top-of-another-view) — Taslim Oseni, Nov 26 '20 at 14:10
@Lina, rather than using ConstraintLayout use RelativeLayout or FrameLayout with no more parameters you will achieve this... — piyushpk, Nov 26 '20 at 14:20

Bogdan Android · Accepted Answer · 2020-11-26T14:22:38.997

The problem is that you are using the tools keyword when you set your drawable, that is used for testing purposes and has no effect at runtime.

Use android:src :

<androidx.constraintlayout.widget.ConstraintLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content">

                <ImageView
                    android:id="@+id/mainImageProduct"
                    android:layout_width="250dp"
                    android:layout_height="250dp"
                    android:layout_marginTop="@dimen/spacing_large"
                    android:visibility="visible"
                    android:scaleType="centerCrop"
                    android:adjustViewBounds="true"
                    app:layout_constraintBottom_toBottomOf="parent"
                    app:layout_constraintEnd_toEndOf="parent"
                    app:layout_constraintStart_toStartOf="parent"
                    app:layout_constraintTop_toTopOf="parent"
                    android:src="@drawable/image1" />

                <ImageView
                    android:id="@+id/plusOne"
                    android:layout_width="50dp"
                    android:layout_height="50dp"
                    android:elevation="4dp"
                    app:layout_constraintBottom_toBottomOf="@+id/mainImageProduct"
                    app:layout_constraintEnd_toEndOf="@+id/mainImageProduct"
                    app:layout_constraintStart_toEndOf="@+id/mainImageProduct"
                    app:layout_constraintTop_toTopOf="@+id/mainImageProduct"
                    android:src="@drawable/plus_in_white_circle" />

            </androidx.constraintlayout.widget.ConstraintLayout>

How to place an image over another image in android

1 Answers1