Coder Social home page Coder Social logo

material-menu's Introduction

⚠️ The project is deprecated ⚠️

Any issues or pull requests will not be addressed. Please consider forking your own version if changes are needed.

Material Menu

Morphing Android menu, back, dismiss and check buttons

Demo Image

Have full control of the animation:

Demo Drawer

Including in your project

compile 'com.balysv.materialmenu:material-menu:2.0.0'

Maven Central

Versions up to 2.0 (deprecated)

See README for setting up older versions of the library.

Usage

MaterialMenuDrawable

Use it as a standalone drawable in your Toolbar:

private MaterialMenuDrawable materialMenu;

protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.toolbar);
    Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
    setSupportActionBar(toolbar);
    toolbar.setNavigationOnClickListener(new View.OnClickListener() {
        @Override public void onClick(View v) {
        // Handle your drawable state here
        materialMenu.animateState(newState);
      }
    });
    materialMenu = new MaterialMenuDrawable(this, Color.WHITE, Stroke.THIN);
    toolbar.setNavigationIcon(materialMenu);
}

MaterialMenuView

A plain old View that draws the icon and provides an API to manipulate its state. You can embed it in any layout including a Toolbar.

Customisation is also available through xml attributes:

app:mm_color="color"               // Color of drawable
app:mm_visible="boolean"           // Visible
app:mm_transformDuration="integer" // Transformation animation duration
app:mm_scale="integer"             // Scale factor of drawable
app:mm_strokeWidth="integer"       // Stroke width of icons (can only be 1, 2 or 3)
app:mm_rtlEnabled="boolean"        // Enabled RTL layout support (flips all drawables)
app:mm_iconState="enum"            // Set the intial state of the drawable (burger, arrow, x or check)

API

There are four icon states:

BURGER, ARROW, X, CHECK

To morph the drawable state

MaterialMenu.animateIconState(IconState state)

To change the drawable state without animation

MaterialMenu.setIconState(IconState state)

To animate the drawable manually (i.e. on navigation drawer slide):

MaterialMenu.setTransformationOffset(AnimationState state, float value)

To hide or show the drawable:

MaterialMenu.setVisible(boolean visible)

where AnimationState is one of BURGER_ARROW, BURGER_X, ARROW_X, ARROW_CHECK, BURGER_CHECK, X_CHECK and value is between 0 and 2

Note: The icon state is resolved by current offset value. Make sure you use offset between 0 and 1 for forward animation and 1 and 2 for backwards to correctly save icon state on activity recreation.

NavigationDrawer slide interaction

Implement MaterialMenu into your ActionBar as described above and add a custom DrawerListener:

private DrawerLayout drawerLayout;
private boolean isDrawerOpened;
private MaterialMenuDrawable materialMenu;

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    toolbar = (Toolbar) findViewById(R.id.toolbar);
    setSupportActionBar(toolbar);
    materialMenu = new MaterialMenuDrawable(this, Color.WHITE, Stroke.THIN);
    toolbar.setNavigationIcon(materialMenu);

    drawerLayout = (DrawerLayout) findViewById(R.id.drawer_layout);
    drawerLayout.setDrawerListener(new DrawerLayout.SimpleDrawerListener() {
        @Override
        public void onDrawerSlide(View drawerView, float slideOffset) {
            materialMenu.setTransformationOffset(
                MaterialMenuDrawable.AnimationState.BURGER_ARROW,
                isDrawerOpened ? 2 - slideOffset : slideOffset
            );
        }

        @Override
        public void onDrawerOpened(View drawerView) {
            isDrawerOpened = true;
        }

        @Override
        public void onDrawerClosed(View drawerView) {
            isDrawerOpened = false;
        }
        
        @Override
        public void onDrawerStateChanged(int newState) {
            if(newState == DrawerLayout.STATE_IDLE) {
                if(isDrawerOpened) {
                   menu.setIconState(MaterialMenuDrawable.IconState.ARROW);
                } else {
                   menu.setIconState(MaterialMenuDrawable.IconState.BURGER);
                }
            }
        }
    });
}

Developed By

Balys Valentukevicius

License

Copyright 2016 Balys Valentukevicius

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.

material-menu's People

Contributors

balysv avatar ming13 avatar mschez avatar shay-rom avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

material-menu's Issues

Applying the CHECK animation to CAB

Hi,

I'm extremely happy with this library. And I was thinking to add the Check animation to the Contextual Action Bar, is it possible to do it or I need to write a Custom View for CAB.

New state, cross "+"

For my app, I need to use an animation from CHECK to "+" and vice versa. Is there a way to recreate this with the current implementation? If not, could you please add it to the library? Note that "+" is very similar to "x".

Thank you so much.

onDrawerStateChanged

I v implemented material-menu successfully on my project..

I have one question:

instead of using : setState(MaterialMenuDrawable.IconState.ARROW)
i v tried : animatePressedState(MaterialMenuDrawable.IconState.ARROW);

Coz id like to have that circle animation, but it does not works..

Suggestions?

Pre-Lollipop animation is weird

When animating from burger to arrow, It looks like it's spinning, and then the burger is fading out and the arrow is fading in.

Is it possible to change this?

set Scale programmatically

Hey!
My arrow drawable looks bigger than the stock one, and I thought the "scale" setting would allow me to change it (does it do this?), but I can't find the method to set it programmatically.
Is the method missing?
And how do I change the size?

Width and height

Hi,
Im wondering if I could use MaterialMenuView with custom widths and heights?

Im not using any kind of actionbar ( setSupportActionBar()). I just want to set the MaterialMenuView in my own FrameLayout. I want to position the MaterialMenuView over the toolbar to mimic the behaviour of a "normal" toolbar.

<FrameLayout>
   <android.support.v7.widget.Toolbar
      xmlns:app="http://schemas.android.com/apk/res-auto"
      android:id="@+id/toolbar"
      android:layout_width="match_parent"
      android:layout_height="@dimen/abc_action_bar_default_height_material"
      android:background="?attr/colorPrimary"
      app:contentInsetStart="@dimen/abc_action_bar_default_height_material"
      />

   <com.balysv.materialmenu.MaterialMenuView
      android:id="@+id/menuArrow"
      android:layout_width="@dimen/abc_action_bar_default_height_material"
      android:layout_height="@dimen/abc_action_bar_default_height_material"
      xmlns:mm="http://schemas.android.com/apk/res-auto"
      mm:mm_color="@color/white"
      android:layout_gravity="start"
      android:background="@color/black"
      />

</FrameLayout>

But it looks like this:
Toolbar

Maven Error(25,0)

when i try to import this to my project in android studio 1.0 rc2 i have this error:

Error:(25, 0) Could not read script 'C:\ADTBundle\StudioWorkspace\MyApplication\maven_push.gradle' as it does not exist.

i dont know how to import this toolbar lib to my project can you help me with a step by step guide?

Undeterministic icon state in Drawer Interaction

Hello!
This line isDrawerOpened ? 2 - slideOffset : slideOffset caused the icon to switch back to the menu from the arrow when the drawer was open every once in a while.
I fixed it by doing: isDrawerOpened ? 2 - slideOffset : slideOffset-0.00001f

Maybe you can elucidate me on why this could be happening.
(I'm really using Scala and the line val offset = if(isDrawerOpened) 2-slideOffset else slideOffset-0.00001f but I don't really think that's got anything to do with it).

SharedElements

Is there any way to share MaterialMenuDrawable between activities?

e.g. I have hamburger icon in the FirstActivity and want to animate it to arrow in the SecondActivity.

Fail to compile using the new '21' support libs due to attr conflict

Hello,

I've been trying for a while to update the lib version as I see that in the new code, you've added a prefix to the attrs so they won't conflict.

The version I was using is 1.0.0, but I found 1.1.0. Neither of them are working.

Is there a any version that have added the prefixes to the code?

Thanks in advance

Sloppy animation, if playing and in the same time keyboard is appearing on screen

I've been using your lbrary for animation the burger-to-arrow icon transition, in a SerchView (SearchView back arrow animates to burger when SearchView collapses, and vice versa). The issue I experienced is: when the soft keyboard show/hide occurs in the same time with the animation, then the animation becomes jerky, loosing a lot of frames. This situation happens on every phone I have. So I did a workaround, like this

 private void animateToBurgerIcon() {
                if (mHandler == null) mHandler = new Handler();
                mHandler.postDelayed(new Runnable() {
                    @Override
                    public void run() {
                        if (!MyFragment.this.isVisible()) {
                         toolbarMorphDrawable.animateIconState(MaterialMenuDrawable.IconState.BURGER);
                      searchMorphDrawable.animateIconState(MaterialMenuDrawable.IconState.BURGER);
                        } else {
                            mHandler.postDelayed(this, 20);
                        }
                    }
                }, 20);
            }

It checks whether the fragement I use is already visible (along with keyboard), and only then starts animation, which resolves the problem, but at the cost of strting animation a little later.

Maybe there could be some more ingenious solution for this problem?

How to use outside of toolar/actionbar, as a normal view ?

I wish to put the material menu into a simple layout, as such:

    <com.balysv.materialmenu.MaterialMenuView
        android:id="@+id/navButton"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:mm_color="#ffcc0000"
        app:mm_strokeWidth="2"
        app:mm_transformDuration="3000" />

For some reason, it fails when doing so, and it always crashes, showing this error:

12-31 15:03:27.215: E/AndroidRuntime(22572):    at android.view.LayoutInflater.createView(LayoutInflater.java:633)
12-31 15:03:27.215: E/AndroidRuntime(22572):    at android.view.LayoutInflater.createViewFromTag(LayoutInflater.java:743)
12-31 15:03:27.215: E/AndroidRuntime(22572):    at android.view.LayoutInflater.rInflate(LayoutInflater.java:806)
12-31 15:03:27.215: E/AndroidRuntime(22572):    at android.view.LayoutInflater.rInflate(LayoutInflater.java:809)
12-31 15:03:27.215: E/AndroidRuntime(22572):    at android.view.LayoutInflater.parseInclude(LayoutInflater.java:916)
12-31 15:03:27.215: E/AndroidRuntime(22572):    at android.view.LayoutInflater.rInflate(LayoutInflater.java:802)
12-31 15:03:27.215: E/AndroidRuntime(22572):    at android.view.LayoutInflater.inflate(LayoutInflater.java:504)
12-31 15:03:27.215: E/AndroidRuntime(22572):    at android.view.LayoutInflater.inflate(LayoutInflater.java:414)

can anyone help?

New menus

Can you add play to pause and pause to play transition? It would be very useful! Thanks

Basic integration in Android Studio

@balysv @ming13 : When i follow the instructions given in read me (by compiling all 4) i facing 9 errors in my sample project.
Can you please make the readme (using the library) more easier and also a demonstration video if possible.
Do we need to include all these in my apps build.gradle
// stock actionBar
compile 'com.balysv.materialmenu:material-menu:1.x.x'

// Toolbar and ActionBarCompat-v21 (includes support-v7:21.0.x)
compile 'com.balysv.materialmenu:material-menu-toolbar:1.x.x'

// actionBarCompat-v20 (up to support-v7:20.0.0 - does not support Toolbar)
compile 'com.balysv.materialmenu:material-menu-abc:1.x.x'

// actionBarSherlock
compile 'com.balysv.materialmenu:material-menu-abs:1.x.x'

Help me!

can i use this library on my eclipse workspace?

MaterialMenuIconCompat seems to overrides actionbar background color

I have a navigationdrawer and actionbar working fine also with the MaterialMenu.

But when I try to change the background color of the ActionBar it works fine when I uncomment the MaterialMenu but when I use it, the background color is always black. I am using the windowActionBarOverlay to get the background behind the actionbar, which also could be the part not working properly with MaterialMenu. It seems like a bug.

materialMenu = new MaterialMenuIconCompat(this, Color.WHITE, MaterialMenuDrawable.Stroke.THIN);
// if I uncomment this line(and others using it) the background color is correct

Styling:

<style name="AppTheme" parent="Theme.AppCompat">
    <item name="android:actionBarStyle">@style/ActionBar</item>
    <item name="actionBarStyle">@style/ActionBar</item>
    <item name="colorPrimaryDark">@color/statusbar</item>
</style>

<style name="ActionBar" parent="@style/Widget.AppCompat.ActionBar">
    <item name="android:background">#4C000000</item>
    <item name="android:windowActionBarOverlay">true</item>

    <!-- Support library compatibility -->
    <item name="background">#4C000000</item>
    <item name="windowActionBarOverlay">true</item>
</style>

Add CHECK_BURGER AnimationState

A transition from a check to a burger would be very helpful.

Edit: actually, a check to arrow transition is what I'm looking for. :)

Edit 2: Got it working with ARROW_CHECK and 1 - slideOffset. You can close this.

add maven badge

add it to the README so we will be able to know what is the last version on maven.
Maven Central

[![Maven Central](https://maven-badges.herokuapp.com/maven-central/com.balysv.materialmenu/material-menu/badge.svg?style=flat)](http://mvnrepository.com/artifact/com.balysv.materialmenu/material-menu)

ABS

Using Gradle.
'compile 'com.balysv.materialmenu:material-menu-abs:1.x.x'

Failed to find

This library should be deprecated

The new ActionBarDrawerToggle class of the AppCompat (v7) library, which replaced the old version in the support library, actually does this animation for you; that's how all of the Google Apps do it.

Scale setter

It would be useful to have a setter for the Scale, which is currently missing.

AppCompat v22 support ?

In v22 ActionBarActivity is deprecated, could you please update MaterialMenuIconCompat to be compatible with AppCompatActivity ?

Appear animation

Hello.

Is it possible to animate appearance of material icon. I want to animate a situation when there was no icon in toolbar and animate, for example, appearance of arrow button.

Allow backup is true in library

The allowBackup flag is set to true in the library project manifest file. This forces the use of a tools override when building projects which may set this false. I'm wondering if this flag should be removed from the library project.

Adding to build.gradle issues

I'm running into this issue when I attempt to add this to my build.gradle.

Error:(31, 13) Failed to resolve: com.balysv.materialmenu:material-menu-abc:2.0.0
Error:(28, 13) Failed to resolve: com.balysv.materialmenu:material-menu-toolbar:2.0.0
Error:(34, 13) Failed to resolve: com.balysv.materialmenu:material-menu-abs:2.0.0

Here's my gradle code:

apply plugin: 'com.android.application'

android {
    compileSdkVersion 25
    buildToolsVersion "25.0.2"
    defaultConfig {
        applicationId "com.technologx.wallpaperzdash"
        minSdkVersion 21
        targetSdkVersion 25
        versionCode 1
        versionName "1.0"
        testInstrumentationRunner "android.support.test.runner.AndroidJUnitRunner"
    }
    buildTypes {
        release {
            minifyEnabled false
            proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'
        }
    }
}

dependencies {
    compile fileTree(dir: 'libs', include: ['*.jar'])

    // stock actionBar
    compile 'com.balysv.materialmenu:material-menu:2.0.0'

// Toolbar and ActionBarCompat-v21 (includes support-v7:21.0.x)
    compile 'com.balysv.materialmenu:material-menu-toolbar:2.0.0'

// actionBarCompat-v20 (up to support-v7:20.0.0 - does not support Toolbar)
    compile 'com.balysv.materialmenu:material-menu-abc:2.0.0'

// actionBarSherlock
    compile 'com.balysv.materialmenu:material-menu-abs:2.0.0'
}

Padding using MaterialIconView

According to the guidelines, should be 16dp Start padding for the drawer icon.
guidelines

Using this library the padding is bigger, like 30dp.

animateIconState during animation problem

There is some problem here. if i'm staring animateIconState during running animation it starts new animation and then it change state to prevous animation target state.

I checked source and found this:

    public void animateIconState(IconState state) {
        synchronized (lock) {
            if (transformationRunning) {
                transformation.end();
            }
            animatingIconState = state;
            start();
        }
    }

And this:

    public void setIconState(IconState iconState) {
        synchronized (lock) {
            if (transformationRunning) {
                transformation.cancel();
                transformationRunning = false;
            }

And this:

            public void onAnimationEnd(Animator animation) {
                transformationRunning = false;
                setIconState(animatingIconState);
            }

It looks like that code need some changes in animateIconState:

    public void animateIconState(IconState state) {
        synchronized (lock) {
            if (transformationRunning) {
                transformation.cancel();
                transformationRunning = false;
            }
            animatingIconState = state;
            start();
        }
    }

Can't use with AppCompatActivity

MaterialMenuIconCompat constructor requires ActionbarActivity as first parameter and I am using AppCompactActity. How can I use?

Padding is ignored

Padding isn't applyed at all.

The icon with an scale of 1 is the needed for an standard ActionBar, but Android L guidelines have a larger ActionBar. So, when we're putting the icon in this larger ActionBar, some users fails to tap on the icon View, creating some bad sensations.

BTW, thanks for your work, Balys!

Doesn't work with v21 of support library

Doesn't find the view in file MaterialMenuIconCompat.java, line 76 (return homeView.findViewById(R.id.up);) when using v21 of support library, but works fine if I change back to v20.

Problems when using with expandable items

I have a project that uses ABS and some screens use a SearchView (from ABS) that is iconified and then expands in the actionbar as needed. When this occurs, somewhere in that process the framework is called getConstantState() on the material menu drawable. Since this is not implemented in MaterialMenuDrawable, the default implementation returns null which causes the item expansion to fail and the app to stop. I was able to extend MaterialMenuDrawable and provide an implementation, but it also looks like this process turns the drawable into a static drawable so the animations stop running after that. I didn't dig any further into this, but I wanted to mention it in case it's something you might be able to address. This is a really nice library and if this can be fixed, I would like to use it.

Request: allow to show the clicking effect via code

If it's in "burger" mode, I'd like to make a clicking effect in case the user clicks on it.

I've tried this:

materialMenuView.animatePressedState(IconState.BURGER);

but it doesn't do anything. Also tried to call "setState" before calling the above.

Is there a way to allow clicking effect ?

Usage in SherlockFragmentActivity

Hi, first I want to thank you for this awesome library!

But is there any possibility to use the MaterialMenuIconSherlock in a SherlockFragmentActivity? I'm using it for my navigation drawer and viewpager activities and I can't find a way to parse an SherlockActivity as a constructor parameter.
When I use the normal MaterialMenuIcon and parse the SherlockFragmentActivity it works, but not for Android <4.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.