CODEWITHSUNDEEP
androidandroid-layoutandroid-imageviewandroid-relativelayoutandroid-framelayout
Compaq LE2202x
Compaq LE2202x

Reputation: 2376

How to handle nested FrameLayout properly

I am using FrameLayouts to overlap image over image, but I can't understand in this particular scenario where my inner FrameLayout doesn't show at the front of another image. Here's the theory:

theory

and here's the actual thing:

actual

So here's my XML:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/mypage_container"
android:layout_width="match_parent"
android:layout_height="match_parent" >

<FrameLayout
    android:id="@+id/frame"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content" >

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

        <ImageView
            android:id="@+id/cover_photo"
            android:layout_width="match_parent"
            android:layout_height="180dp"
            android:layout_marginTop="120dp"
            android:scaleType="fitXY"
            android:src="#CCFF0000" />

        <FrameLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_below="@id/cover_photo" >

            <ImageView
                android:layout_width="105dp"
                android:layout_height="90dp"
                android:layout_below="@id/cover_photo"
                android:adjustViewBounds="true"
                android:src="@color/aqua"
                android:translationY="-45dp" />

            <ImageView
                android:layout_width="80dp"
                android:layout_height="80dp"
                android:layout_marginLeft="15dp"
                android:src="@color/green"
                android:translationY="-40dp" />
        </FrameLayout>

    </RelativeLayout>
</FrameLayout>

Have I placed the inner FrameLayout wrong? I don't know how what to do anymore. Any help will be deeply appreciated. Thanks!

Upvotes: 1

Views: 2902

Answers (1)

Koso
Koso

Reputation: 3199

It is because your FrameLayout has this line: android:layout_below="@id/cover_photo". You can have FrameLayout like this: 

<FrameLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginBottom="-40dp"
        android:layout_alignBottom="@id/cover_photo" >

Upvotes: 2

Related Questions