Activities MapView overlapping fragments layout

Question

I have been scratching my head on an issue related to Google MapView where a MapView embedded in an activity is overlapping or staying in the foreground over a fragment that also hosts a SupportMapFragment.

Below is the activity.xml file source

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_height="match_parent"
    android:layout_width="match_parent"
    android:background="@color/loginbg">

    <include layout="@layout/tool_bar" android:id="@+id/tbar" />

    <FrameLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_below="@+id/tbar">
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical">
            <RelativeLayout
                android:layout_width="match_parent"
                android:layout_height="0dp"
                android:layout_weight="1">
                <com.google.android.gms.maps.MapView
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:id="@+id/map"
                    android:layout_gravity="center">
                </com.google.android.gms.maps.MapView>
            </RelativeLayout>
            <View
                android:layout_width="match_parent"
                android:layout_height="0dp"
                android:layout_weight="1"/>
        </LinearLayout>
        <FrameLayout
            android:id="@+id/fragment_container"
            android:layout_below="@+id/tbar"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_gravity="center"
            android:visibility="visible" >
        </FrameLayout>
    </FrameLayout>
</RelativeLayout>

The fragment_container above is the container where I am loading a fragment that hosts a SupportMapFragment.

Below is the layout of the fragment.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/ColorPrimaryDarkNew"
    android:gravity="center"
    android:orientation="vertical" >
    <FrameLayout
        android:id="@+id/fragment_container"
        android:layout_width="match_parent"
        android:layout_height="match_parent" >

        <FrameLayout
            android:id="@+id/map_container"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical" >
        </FrameLayout>
        <Button
            android:id="@+id/btnDone"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginTop="10dp"
            android:layout_marginRight="10dp"
            android:layout_gravity="top|right"
            style="@style/BlueButton"
            android:text="Continue"/>
    </FrameLayout>
</LinearLayout>

When I run the app, its showing up as below where top half part of the fragment is getting overlapped by the hosting activities MapView. However one thing I noticed is that the top right button which is part of the fragment is showing up correctly.

https://i.stack.imgur.com/KkDry.png

Any help in this regard would be highly appreciated.

Below is the maps library version I am using

compile 'com.google.android.gms:play-services-maps:9.2.1'