swipe display drawer with flowing & bouncing effects.

Related tags

Layout android-ui
Overview

FlowingDrawer

Android Arsenal travis-ic

Showcase

swipe right to display drawer with flowing effects.

Download

Include the following dependency in your build.gradle file.

Gradle:

    repositories {
        jcenter()
    }

    dependencies {
        implementation 'com.mxn.soul:flowingdrawer-core:2.1.0'
        implementation 'com.nineoldandroids:library:2.4.0'
    }

V2.0.0 Features

  • The menu can be positioned along two edges:left and right .
  • Allows the drawer to be opened by dragging the edge or the entire screen.

Usage

For a working implementation of this project see the app/ folder and check out the sample app

activity_main.xml:

    <com.mxn.soul.flowingdrawer_core.FlowingDrawer
            xmlns:app="http://schemas.android.com/apk/res-auto"
            xmlns:android="http://schemas.android.com/apk/res/android"
            android:id="@+id/drawerlayout"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:clipChildren="false"
            android:clipToPadding="false"
            app:edPosition="1"
            app:edMenuSize="260dp"
            app:edMenuBackground="#dddddd">

        <!--content-->
        <RelativeLayout
                android:id="@+id/content"
                android:layout_width="match_parent"
                android:layout_height="match_parent"/>

        <!--menu-->
        <com.mxn.soul.flowingdrawer_core.FlowingMenuLayout
                android:id="@+id/menulayout"
                android:layout_width="match_parent"
                android:layout_height="match_parent">

            <FrameLayout
                    android:id="@+id/id_container_menu"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"/>

        </com.mxn.soul.flowingdrawer_core.FlowingMenuLayout>

    </com.mxn.soul.flowingdrawer_core.FlowingDrawer>

To use a FlowingDrawer, position FlowingDrawer as the root , position your primary content view as the first child with width and height of match_parent . Add FlowingMenuLayout as child views after the main content view . FlowingMenuLayout commonly use match_parent for height and width.

Don't set any background on FlowingMenuLayout or FlowingMenuLayout's children, it means their background should be transparent.

Don't set FlowingMenuLayout's width with a fixed width, it's not a useful way to change it's width .

You can change menu's attribute in FlowingDrawer layout node use custom attribute,like edMenuBackground,edMenuSize, edPosition.

Use edPosition attribute corresponding to which side of the view you want the drawer to emerge from: left or right.Left menu : edPosition =1 ; Right menu: edPosition =2 .

For more custom attribute ,you can see in attrs.xml.

MainActivity:

     mDrawer = (FlowingDrawer) findViewById(R.id.drawerlayout);
     mDrawer.setTouchMode(ElasticDrawer.TOUCH_MODE_BEZEL);
     mDrawer.setOnDrawerStateChangeListener(new ElasticDrawer.OnDrawerStateChangeListener() {
                 @Override
                 public void onDrawerStateChange(int oldState, int newState) {
                     if (newState == ElasticDrawer.STATE_CLOSED) {
                         Log.i("MainActivity", "Drawer STATE_CLOSED");
                     }
                 }

                 @Override
                 public void onDrawerSlide(float openRatio, int offsetPixels) {
                     Log.i("MainActivity", "openRatio=" + openRatio + " ,offsetPixels=" + offsetPixels);
                 }
             });

setTouchMode can allows the drawer to be opened by dragging the edge or the entire screen. setOnDrawerStateChangeListener can be used to monitor the state and motion of drawer views. Avoid performing expensive operations such as layout during animation as it can cause stuttering. ElasticDrawer.OnDrawerStateChangeListener offers default/no-op implementations of each callback method.

License

Copyright 2015 soul.mxn

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

   http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
Comments
  • How can I make the drawer overlap the title bar ?

    How can I make the drawer overlap the title bar ?

    Hi,

    I wonder how can I make the drawer to fit all the screen height so it overlaps the title bar and also the status bar.

    This is how it looks now: drawer

    I want the drawer to be all the way up overlapping the title bar.

    Thanks.

    opened by tudor07 9
  • A scrimColor / shadow issue

    A scrimColor / shadow issue

    I can't find a way to implement any activity shadowing as in your example gif, setScrimColor method is not available for FlowingDrawer object. Can you please help me?

    enhancement 
    opened by qbai22 7
  • Drawer Issue

    Drawer Issue

    error

    Please check the attached screen shot. There is white line at the right side left after drawer is opened. This line is random in shape and size and depends on at which speed you are opening the drawer.

    Device : LG L7

    bug 
    opened by sanjaykumarm 7
  • Android P devices

    Android P devices

    There is a bug which causes that FlowingDrawer is not compatible with Android P devices: just change "canvas.clipPath(mClipPath, Region.Op.REPLACE);" to "canvas.clipPath(mClipPath, Region.Op.INTERSECT);" and it will work like a charm.

    Thank you

    opened by ghost 6
  • [Bug] Child elements do not inherit the bounce effect

    [Bug] Child elements do not inherit the bounce effect

    Hi,

    I think this is a bug. So when the bouncing effect occurs the child elements do not act accordingly.

    Please check the images: http://imgur.com/a/oKY5L

    On the bounce effect the blue square does not bounce too.

    Also when opening the FlowingDrawer you can see the margin line is not smooth and has some outlines from the parent.

    Do you think you can fix this ?

    opened by tudor07 6
  • Glitch while opening the Drawer

    Glitch while opening the Drawer

    I am able to implement everything successfully. The only issue i am facing is a small glitch. I have attached the image of the glitch. Please if anyone has a solution please help me.

    img_20160220_143828387

    bug 
    opened by parthanjaria 6
  • java.lang.IllegalArgumentException: Invalid Region.Op - only INTERSECT and DIFFERENCE are allowed

    java.lang.IllegalArgumentException: Invalid Region.Op - only INTERSECT and DIFFERENCE are allowed

    java.lang.IllegalArgumentException: Invalid Region.Op - only INTERSECT and DIFFERENCE are allowed
    

    cellphone: NEXUS 5X API 28 Android 9

    java.lang.IllegalArgumentException: Invalid Region.Op - only INTERSECT and DIFFERENCE are allowed
            at android.graphics.Canvas.checkValidClipOp(Canvas.java:779)
            at android.graphics.Canvas.clipPath(Canvas.java:1007)
            at com.mxn.soul.flowingdrawer_core.FlowingMenuLayout.dispatchDraw(FlowingMenuLayout.java:109)
            at android.view.View.draw(View.java:20210)
            at android.view.View.updateDisplayListIfDirty(View.java:19082)
            at android.view.View.draw(View.java:19935)
            at android.view.ViewGroup.drawChild(ViewGroup.java:4333)
            at android.view.ViewGroup.dispatchDraw(ViewGroup.java:4112)
            at com.mxn.soul.flowingdrawer_core.BuildLayerFrameLayout.dispatchDraw(BuildLayerFrameLayout.java:81)
            at android.view.View.draw(View.java:20210)
            at android.view.View.updateDisplayListIfDirty(View.java:19082)
            at android.view.View.draw(View.java:19935)
            at android.view.ViewGroup.drawChild(ViewGroup.java:4333)
            at android.view.ViewGroup.dispatchDraw(ViewGroup.java:4112)
            at com.mxn.soul.flowingdrawer_core.ElasticDrawer.dispatchDraw(ElasticDrawer.java:775)
            at android.view.View.draw(View.java:20210)
            at android.view.View.updateDisplayListIfDirty(View.java:19082)
            at android.view.View.draw(View.java:19935)
            at android.view.ViewGroup.drawChild(ViewGroup.java:4333)
            at android.view.ViewGroup.dispatchDraw(ViewGroup.java:4112)
            at android.view.View.updateDisplayListIfDirty(View.java:19073)
            at android.view.View.draw(View.java:19935)
            at android.view.ViewGroup.drawChild(ViewGroup.java:4333)
            at android.view.ViewGroup.dispatchDraw(ViewGroup.java:4112)
            at android.view.View.updateDisplayListIfDirty(View.java:19073)
            at android.view.View.draw(View.java:19935)
            at android.view.ViewGroup.drawChild(ViewGroup.java:4333)
            at android.view.ViewGroup.dispatchDraw(ViewGroup.java:4112)
            at android.view.View.updateDisplayListIfDirty(View.java:19073)
            at android.view.View.draw(View.java:19935)
            at android.view.ViewGroup.drawChild(ViewGroup.java:4333)
            at android.view.ViewGroup.dispatchDraw(ViewGroup.java:4112)
            at android.view.View.updateDisplayListIfDirty(View.java:19073)
            at android.view.View.draw(View.java:19935)
            at android.view.ViewGroup.drawChild(ViewGroup.java:4333)
            at android.view.ViewGroup.dispatchDraw(ViewGroup.java:4112)
            at android.view.View.draw(View.java:20210)
            at com.android.internal.policy.DecorView.draw(DecorView.java:780)
            at android.view.View.updateDisplayListIfDirty(View.java:19082)
            at android.view.ThreadedRenderer.updateViewTreeDisplayList(ThreadedRenderer.java:686)
            at android.view.ThreadedRenderer.updateRootDisplayList(ThreadedRenderer.java:692)
            at android.view.ThreadedRenderer.draw(ThreadedRenderer.java:801)
            at android.view.ViewRootImpl.draw(ViewRootImpl.java:3311)
            at android.view.ViewRootImpl.performDraw(ViewRootImpl.java:3115)
            at android.view.ViewRootImpl.performTraversals(ViewRootImpl.java:2484)
            at android.view.ViewRootImpl.doTraversal(ViewRootImpl.java:1460)
            at android.view.ViewRootImpl$TraversalRunnable.run(ViewRootImpl.java:7183)
            at android.view.Choreographer$CallbackRecord.run(Choreographer.java:949)
            at android.view.Choreographer.doCallbacks(Choreographer.java:761)
            at android.view.Choreographer.doFrame(Choreographer.java:696)
            at android.view.Choreographer$FrameDisplayEventReceiver.run(Choreographer.java:935)
            at android.os.Handler.handleCallback(Handler.java:873)
            at android.os.Handler.dispatchMessage(Handler.java:99)
            at android.os.Looper.loop(Looper.java:193)
            at android.app.ActivityThread.main(ActivityThread.java:6669)
            at java.lang.reflect.Method.invoke(Native Method)
            at com.android.internal.os.RuntimeInit$MethodAndArgsCaller.run(RuntimeInit.java:493)
            at `com.android.internal.os.ZygoteInit.main(ZygoteInit.java:858)
    
    opened by CaioHAndradeLima 5
  • close drawer on item click

    close drawer on item click

    Hi... I am trying to close drawer automatically when any item clicked in drawer. Have set new intent on item click and it work fine. But when i add code for close drawer on click of new intent the App crashes.

    opened by virajt71 4
  • Manifest merger failed

    Manifest merger failed

    Unable to have the following in my app manifest: android:allowBackup="false"

    Please fix this by removing the allowBackup attribute, thank you!

    opened by VforViolet 3
  • Failed to find style 'elasticDrawerStyle' in current theme

    Failed to find style 'elasticDrawerStyle' in current theme

    Hi, when i want to add this library to my projects i get these errors:

    --Failed to find style 'elasticDrawerStyle' in current theme --Missing styles. Is the correct theme chosen for this layout? Use the Theme combo box above the layout to choose a different layout, or fix the theme style references. --The graphics preview in the layout editor may not be accurate: - Paint Flags Draw Filters are not supported.

    opened by Yavar007 2
  • Ripple effect not showing

    Ripple effect not showing

    I imported this library using gradle, added its view as shown in sample. but the ripple effect from menu is gone. in sample app its working,but i am implementing the same it is not. Is there any thing i am missing?

    opened by Ashwani270292 2
Owner
mxn
mxn
A pull-down-to-refresh layout inspired by Lollipop overscrolled effects

JellyRefreshLayout A pull-down-to-refresh layout inspired by Lollipop overscrolled effects Preview Download Gradle: repositories { maven {

Y.Chen 628 Oct 26, 2022
Android drawer icon with material design animation

LDrawer Android drawer icon with material design animation Note Basically same as appcompat_v7 version 21, you can use appcompat_v7 compile 'com.andro

Hasan Keklik 1.4k Dec 25, 2022
Navigation Drawer Activity with material design style and simplified methods

MaterialNavigationDrawer Navigation Drawer Activity with material design style and simplified methods       It requires 10+ API and android support v7

Fabio Biola 1.6k Dec 30, 2022
Visual back-port of the rotating drawer-to-arrow drawable from Android L

DrawerArrowDrawable A simple drawable backport of the new drawer-indicator/back-arrow rotating drawable from the upcoming Android L. License Copyright

Chris Renke 827 Nov 25, 2022
The Most Powerful Swipe Layout!

Android Swipe Layout ![Gitter](https://badges.gitter.im/Join Chat.svg) This is the brother of AndroidViewHover. One year ago, I started to make an app

代码家 12.3k Dec 28, 2022
An Android library that help you to build app with swipe back gesture.

SwipeBackLayout An Android library that help you to build app with swipe back gesture. Demo Apk GooglePlay Requirement The latest android-support-v4.j

ike_w0ng 6.1k Dec 29, 2022
Easy, flexible and powerful Swipe Layout for Android

SwipeRevealLayout A layout that you can swipe/slide to show another layout. Demo Overview Drag mode Drag mode normal: Drag mode same_level: Features F

Chau Thai 1.5k Jan 4, 2023
An Android library that help you to build app with swipe back gesture.

SwipeBackLayout An Android library that help you to build app with swipe back gesture. Demo Apk GooglePlay Requirement The latest android-support-v4.j

ike_w0ng 6.1k Jan 3, 2023
VoronoiView is a view (ViewGroup) that allows you to add and display views inside Voronoi diagram regions.

Vorolay VoronoiView is a view (ViewGroup) that allows you to add and display views inside Voronoi diagram regions. [Voronoi diagram] (https://en.wikip

Daniil Jurjev 918 Dec 4, 2022
[UNMAINTAINED]: AndroidMosaicLayout is android layout to display group of views as grid consists of different asymmetric patterns (90 different patterns).

AndroidMosaicLayout AndroidMosaicLayout is android layout to display group of views in more that 90 different patterns. What is AndroidMosaicLayout? I

Adham Enaya 474 Nov 12, 2022
CircularStats - Custom Widget to display stats of any thing

CircularStats This is a custom widget made with Jetpack Compose for displaying s

null 14 Jul 2, 2022
swipe display drawer with flowing & bouncing effects.

FlowingDrawer swipe right to display drawer with flowing effects. Download Include the following dependency in your build.gradle file. Gradle: rep

mxn 2.6k Jan 3, 2023
Customizable bouncing dots for smooth loading effect. Mostly used in chat bubbles to indicate the other person is typing.

LoadingDots for Android Customizable bouncing dots view for smooth loading effect. Mostly used in chat bubbles to indicate the other person is typing.

Eyal Biran 162 Dec 2, 2022
A menu consisting of icons (ImageViews) and metaball bouncing selection to give a blob effect. Inspired by Material design

Metaball-Menu A menu consisting of icons (ImageViews) and metaball bouncing selection to give a blob effect. Inspired by Material design ScreenShot Us

AbYsMeL 198 Sep 15, 2022
A Tinder-like Android library to create the swipe cards effect. You can swipe left or right to like or dislike the content.

Swipecards Travis master: A Tinder-like cards effect as of August 2014. You can swipe left or right to like or dislike the content. The library create

Dionysis Lorentzos 2.3k Dec 9, 2022
the library is a loop RecyclerView(expression), can show some effects when display

CircleRecyclerView the library is a loop RecyclerView, can show some effects when display screenshot CircularViewMode ScaleXViewMode & ScaleYViewMode

Matt Yao 704 Jan 5, 2023
Display's information about SpaceX crew members and ships by consuming a rest api and storing the data to display when the user is offline.

Space-X App Display's information about SpaceX crew members(look for ‘Crew’ section in rest api docs) and ships (look for ‘Ships’ section in rest api

krishna chaitanya 2 Apr 8, 2022
Allows the easy creation of animated transition effects when the state of Android UI has changed

android-transition Android-Transition allows the easy creation of view transitions that reacts to user inputs. The library is designed to be general e

Kai 615 Nov 14, 2022
Allows the easy creation of animated transition effects when the state of Android UI has changed

android-transition Android-Transition allows the easy creation of view transitions that reacts to user inputs. The library is designed to be general e

Kai 615 Nov 14, 2022
Custom Tabs with Material Design effects

MaterialTabs Custom Tabs with Material Design animations for pre-Lollipop devices       Download example apk It requires 14+ API and android support v

Fabio Biola 1.4k Dec 29, 2022