swipe display drawer with flowing & bouncing effects.

Related tags

Menu 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
Animations for Android L drawer, back, dismiss and check icons

Material Menu Morphing Android menu, back, dismiss and check buttons Have full control of the animation: Including in your project compile 'com.balysv

Balys Valentukevicius 2.5k Dec 30, 2022
Android - Blur Navigation Drawer like Etsy app.

Blur Navigation Drawer Library[DEPRECATED] Blur Navigation Drawer like Etsy app. Demo You can download a demo here. Updates Version 1.1 Add support fo

Vasilis Charalampakis 414 Nov 23, 2022
Simple library which enable you to add a drawer(slide-out) navigation to your android application

SimpleSideDrawer is an android library to add a drawer navigation into your android application. This library has high affinity with other libraries l

null 217 Nov 25, 2022
Kai Liao 2.2k Jan 3, 2023
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
Render After Effects animations natively on Android and iOS, Web, and React Native

Lottie for Android, iOS, React Native, Web, and Windows Lottie is a mobile library for Android and iOS that parses Adobe After Effects animations expo

Airbnb 33.5k Jan 4, 2023
Chandrasekar Kuppusamy 799 Nov 14, 2022
Create parallax and any other transformation effects on scrolling android ImageView

Android Parallax Image View Creates effect such as vertical parallax, horizontal parallax etc. on android ImageView when it's being vertically or hori

Aris 164 Dec 7, 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
AndroidPhotoFilters aims to provide fast, powerful and flexible image processing instrument for creating awesome effects on any image media.

PhotoFiltersSDK PhotoFiltersSDK aims to provide fast, powerful and flexible image processing instrument for creating awesome effects on any image medi

Zomato 2.5k Dec 30, 2022
A cool Open Source CoverFlow view for Android with several fancy effects.

FancyCoverFlow THIS PROJECT IS NO LONGER MAINTAINED! What is FancyCoverFlow? FancyCoverFlow is a flexible Android widget providing out of the box view

David Schreiber-Ranner 1.1k Nov 10, 2022
effects for android notifications

#NiftyNotification effects for android notifications.base on (Crouton) ScreenShot Usage NiftyNotificationView.build(this,msg, effect,R.id.mLyout)

李涛 1.1k Nov 10, 2022