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.

Gulgee

Answer 1

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

Enjoy.

Ariminum

thanks, looks like what i was looking for. I ll give it try and then place the boundy. – Gulgee

Great work. That's exactly what i was looking for, you made the life easier for lots of people out there. I wonder why google kept this for itself. PS: you made my day with the memes in the demo :) – Gulgee

Any chance of adding maven support ? – Mustang

Hey Marco, it's not a library, to use the view, just copy it to your project. – Ariminum

Hey @tokudu, how can I add it to my IntelliJ project? – Fed

You couldnt have found a better way to promote your app; I was looking for a tech solution and now Im downloading a new app :D – Newsreel

How to use it a child of DrawerLayout?? Whenever i am making it child of DrawerLayout it not moving up on dragging remain stick to the bottom. An ideas?? – Pinetum

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

Overshadow

Thank you so much for this hint, I have been searching for a better solution than umanos Sliding Panel. – Stauder

Here's a good tutorial for adding the bottom sheet per google specs. code.tutsplus.com/articles/… – Moraine

The link in the answer is obsolete, but this links to the class: developer.android.com/reference/android/support/design/widget/… – Blench

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.

Karakul