How to Construct this Layout in Android?

Question

How would I construct this Layout in Android?

I want all three elements to be a FrameLayout so at runtime, I can insert a fragment in code I have the code for the round corners and dotted line corners. I'm just having problems positioning the framelayouts on top of each other. Or maybe the 3 elements should be relative layouts??

Answer 1

All three elements should be frame layouts, but the root element should be a relative layout. Also notice, in relative layout elements are positioned as layers from the lowest to the higest. (from top to bottom of xml file) The first element - is the lowest, next is on top of first, etc.

Your layout should look like this:

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

    <FrameLayout
        android:id="@+id/container_square_with_rounded_corners"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true"/>

    <FrameLayout
        android:id="@+id/container_circle"   
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_alignParentBottom="true"/>

    <FrameLayout
        android:id="@+id/container_square"   
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_alignParentBottom="true"/>

</RelativeLayout>