vertical DrawerLayout or SlidingPaneLayout

Question

The latest Android Support Library introduced the DrawerLayout to implement the common UX pattern where you slide right or left to show a navigation menu.

What I'd love to have is a vertical DrawerLayout with the same API, that can be pulled down/up from the top/bottom of my layout.

Since 4.2 the old SlidingDrawer has been deprecated and I haven't heard about some new Widget that implements the same functionality.

Can the DrawerLayout be extended somehow to implement the vertical swipe UX pattern? Does google provide some different widget to implement it?

Google Music for instance has something very similar to what I'm looking to implement to pull up the player.

Answer 1

We have recently implemented this in the Umano App and open sourced: https://github.com/umano/AndroidSlidingUpPanel

Enjoy.

Answer 2

The Android support library now has the bottom sheets behavior to do that.

Check out this link for more info https://material.google.com/components/bottom-sheets.html

Answer 3

Nowadays, it makes more sense to use the BottomSheetBehavior that you can find more information on how setting it up on https://code.tutsplus.com/articles/how-to-use-bottom-sheets-with-the-design-support-library--cms-26031

Basically, you need to set your main content, and your sliding content. The BottomSheetBehavior would only work for panels that you slide from the bottom to the top.

It has a quite simple set up and the BottomSheetBehavior could even work out of the box. Only by writing a android.support.design.widget.CoordinatorLayout layout, with another View inside (with even wrap_content as a value in the layout_height parameter), for instance a LinearLayout like this one:

<android.support.design.widget.CoordinatorLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        app:behavior_hideable="true"
        app:behavior_peekHeight="56dp"
        app:layout_behavior="android.support.design.widget.BottomSheetBehavior">

        <!-- Your content goes here -->

    </LinearLayout>

</android.support.design.widget.CoordinatorLayout>

In my case, I inflate this layout in a Fragment and add it to the Activity where you want to enable the SlidingSheetBehavior.