Android show one layout element over another

Question

I know this type of problem already discussed here so many times . But in my case none of them working for me . I am using AndroidSlidingUpPanel in my project with navigation drawer. The problem is sliding panel layout always showing over navigation drawer , but what I want is reverse . Here is the current condition

As you can see I can't see the navigation drawer items . Sliding panel layout hides the navigation drawer .

Here is my code

<?xml version="1.0" encoding="utf-8"?>

<com.sothree.slidinguppanel.SlidingUpPanelLayout xmlns:sothree="http://schemas.android.com/apk/res-auto"
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/sliding_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="bottom"
    sothree:umanoDragView="@+id/dragView"
    sothree:umanoOverlay="false"
    sothree:umanoPanelHeight="68dp"
    sothree:umanoParalaxOffset="100dp"
    sothree:umanoShadowHeight="4dp">


    <android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/drawerMainActivity"
        android:layout_width="match_parent"
        android:layout_alignParentBottom="true"
        android:layout_height="match_parent">



        <FrameLayout
            android:orientation="vertical"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:id="@+id/containerView">

            <android.support.v7.widget.Toolbar
                xmlns:android="http://schemas.android.com/apk/res/android"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:minHeight="?android:attr/actionBarSize"
                android:background="?attr/colorPrimary"
                android:id="@+id/toolBar"
                android:fitsSystemWindows="true"
                android:theme="@style/ThemeOverlay.AppCompat.Dark"
                />

        </FrameLayout>


        <android.support.v7.widget.RecyclerView
            android:layout_width="240dp"
            android:layout_height="match_parent"
            android:id="@+id/recyclerView"
            android:scrollbars="vertical"
            android:background="#FFFFFF"
            android:layout_gravity="left"
            />

     </android.support.v4.widget.DrawerLayout>


    <!-- SLIDING LAYOUT -->
    <LinearLayout
        android:id="@+id/dragView"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="#ffffff"
        android:clickable="true"
        android:focusable="false"

        android:orientation="vertical">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal">

            <TextView
                android:id="@+id/name"
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight="1"
                android:textColor="@android:color/holo_green_dark"
                android:gravity="center_vertical"
                android:paddingLeft="10dp"
                android:text="@string/slide"
                android:textSize="14sp" />

            <Button
                android:id="@+id/btn_hide"
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:gravity="center_vertical|right"
                android:paddingLeft="10dp"
                android:paddingRight="10dp"
                android:text="@string/hide"
                android:textSize="14sp" />

        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="#FFCCCC">

            <ImageView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_margin="10dp"
                android:layout_weight="1"
                android:scaleType="centerCrop"
                android:src="@drawable/image" />
        </LinearLayout>
    </LinearLayout>


</com.sothree.slidinguppanel.SlidingUpPanelLayout>

How can I solve this problem ? So that navigation drawer always comes top over sliding panel layout .

Answer 1

Set your DrawerLayout as the root element, instead of your SlidingUpPanelLayout

Answer 2

To set the Z-axis you have to order the tree. From the documentation

View.html#Drawing

The tree is largely recorded and drawn in order, with parents drawn before (i.e., behind) their children, with siblings drawn in the order they appear in the tree. If you set a background drawable for a View, then the View will draw it before calling back to its onDraw() method. The child drawing order can be overridden with custom child drawing order in a ViewGroup, and with setZ(float) custom Z values} set on Views.

So basically set the Drawerlayout as last.