Put Image over LinearLayout in Android

Question

I am using LinearLayout and ImageView inside FrameLayout. I change the order of LinearLayout and ImageView but image is always showing up in the background. A screenshot is attached herewith for your consideration. I want to put LinearLayout to the back of ImageView. Changing the position of ImageView is not helping me out. Any help or guidance on that will be much appreciated. Thanks!

layout.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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:id="@+id/itemOuter"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_centerInParent="true"
    android:layout_gravity="center|center_vertical"
    android:gravity="center|center_vertical"
    android:paddingVertical="0dp"
    android:paddingHorizontal="15dp"
    android:background="@color/colorWhite"
    android:orientation="horizontal">

    <RelativeLayout
        android:id="@+id/outer"
        android:layout_width="match_parent"
        android:layout_height="158dp"
        android:gravity="left"
        android:orientation="horizontal"
        android:layout_marginVertical="25dp"
        android:layout_marginHorizontal="10dp"
        android:paddingLeft="0dp"
        >
        <FrameLayout
            android:id="@+id/col1"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:gravity="bottom"
            android:orientation="horizontal">


            <LinearLayout
                android:id="@+id/shadowOuter"
                android:gravity="center_vertical"
                android:layout_gravity="center_vertical"
                android:orientation="vertical"
                android:layout_width="match_parent"
                android:paddingLeft="125dp"
                android:layout_height="135dp"
                android:elevation="8dp"
                android:outlineAmbientShadowColor="#014a8f"
                android:outlineSpotShadowColor="#014a8f"
                android:background="@drawable/level_shadow"
                >
                <TextView
                    android:id="@+id/m_step_id"
                    android:layout_width="wrap_content" android:layout_height="wrap_content"
                    android:text="0"
                    android:visibility="gone">
                </TextView>

                <TextView
                    android:id="@+id/name"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:fontFamily="@font/notosanskr_medium"
                    android:includeFontPadding="false"
                    android:text="1단계"
                    android:paddingVertical="2dp"
                    android:textColor="@color/colorGrey"
                    android:textSize="14sp"></TextView>

                <TextView
                    android:id="@+id/description"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:fontFamily="@font/notosanskr_medium"
                    android:includeFontPadding="false"
                    android:text="영어 문장 구조의 기본을 익히자!"
                    android:paddingVertical="2dp"
                    android:textColor="@color/colorGreyLightExtra"
                    android:textSize="11dp"></TextView>

                <TextView
                    android:id="@+id/total"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:fontFamily="@font/notosanskr_medium"
                    android:includeFontPadding="false"
                    android:text="총 6개"
                    android:paddingVertical="2dp"
                    android:textColor="@color/colorGreyLightExtra"
                    android:textSize="11dp"></TextView>

                <Button
                    android:id="@+id/btn_view"
                    android:layout_width="50dp"
                    android:layout_height="20dp"
                    android:layout_gravity="right|center_vertical"
                    android:background="@drawable/btn_outline_orange"
                    android:fontFamily="@font/notosanskr_medium"
                    android:includeFontPadding="false"
                    android:text="시작하기"
                    android:textColor="@color/colorOrangeDark"
                    android:textSize="10dp"
                    android:layout_marginRight="10dp"
                    android:layout_marginTop="10dp"
                    style="?android:attr/borderlessButtonStyle"
                    >
                </Button>
            </LinearLayout>

            <ImageView
                android:id="@+id/photo"
                android:layout_width="115dp"
                android:layout_height="160dp"
                android:paddingRight="5dp"
                android:src="@drawable/big_book"
                android:layout_gravity="bottom">
            </ImageView>
        </FrameLayout>


    </RelativeLayout>


</LinearLayout>

Answer 1

• Either Set android:elevation="10dp" on ImageView to make it visible.
• Or remove LinearLayout elevation

It is because you have set 8db elevation on LinearLayout. Now you need to give ImageView elevation greater than 8db. Or remove LinearLayout elevation.