Sticky image at the bottom of other in android

Question

I don't know the proper name of this feature, here is the image to understand my problem better.

I need to create a layout of a image on the border-bottom of another image like the profile image is on the bottom of the big image.

I am using a CardView which contain these 2 images. My Code:

 <android.support.v7.widget.CardView
            android:id="@+id/cardview"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:elevation="100dp"
            card_view:cardCornerRadius="8dp"
            card_view:useCompatPadding="true"
            card_view:cardPreventCornerOverlap="false"
            >
                <ImageView
                   android:layout_width="match_parent"
                   android:layout_height="wrap_content"
                   android:src="@drawable/bigImage"
                   />
                <ImageView
                   android:layout_width="10dp"
                   android:layout_height="10dp"
                   android:src="@drawable/smallImage"
                   />
        </android.support.v7.widget.CardView>

Can any one help me out with this?

Answer 1

This will do what you want, with either an image of fixed height, or calculated programatically.

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

        <RelativeLayout
            android:id="@+id/layoutTop"
            android:layout_width="match_parent"
            android:layout_height="200dp" >
        </RelativeLayout>

        <RelativeLayout
            android:id="@+id/layoutBottom"
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_alignParentBottom="true"
            android:layout_below="@id/layoutTop" >
        </RelativeLayout>

        <ImageView
            android:id="@+id/overlapImage"
            android:layout_width="wrap_content"
            android:layout_height="40dp"
            android:layout_above="@id/layoutBottom"
            android:layout_centerHorizontal="true"
            android:layout_marginBottom="-20dp" <!-- This should be always half the height, can also be calculated and added programtically -->
            android:adjustViewBounds="true"
            android:src="@drawable/ic_launcher" />

    </RelativeLayout>