How to animate toolbar overflow menu icon

Question

Is there a way to animate the default 3-vertical-dotted menu icon on toolbar?

I use toolbar as actionbar with the standard code:

Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);

and I also use the onCreateOptionsMenu method inside activity where I inflate my menu.xml file but I don't know how to gain more control over the overflow icon which is created automatically. What I'm most interested in is how to reference the menu icon So I can animate it. I don't care about the animation type. It can be a simple rotation animation

well... use SOF search function: http://stackoverflow.com/questions/9731602/animated-icon-for-actionitem — Mariano Zorrilla, Sep 17 '15 at 23:05
Yes but the overflow icon is created on its own when I inflate the `menu.xml` How can I create a reference to it? So I can animate it? — ThanosFisherman, Sep 17 '15 at 23:11
I tried to find Android actual source code of `ActionBar#addOnMenuVisibilityListener`, because I believe the method references the overflow menu button. This is an option, but maybe you will have to create your own implementation of an ActionBar. — Paulo Avelar, Sep 22 '15 at 01:35

Elltz · Accepted Answer · 2015-09-24T20:30:42.863

Well, you play with the View specifically ActionMenuView so try this, copy the codes into your Activity

//we declare our objects globally
Toolbar tool;  ActionMenuView amv;

then override onPrepareOptionsMenu, what you decide to return is your choice

@Override
public boolean onPrepareOptionsMenu(Menu menu) {
    //to be safe you can check if children are greater than 1
    amv = (ActionMenuView) tool.getChildAt(1);//hope you've met amv
    return true;
}

now this is the crucial part- whenever you want to animate the "3 verticall dots" -(your overflow) you have to check visible children-(i.e if you want to) actually forget that

amv.getChildAt(amv.getChildCount()-1).startAnimation(AnimationUtils.loadAnimation(
        MainActivity.this,R.anim.abc_fade_in));

that gives you a basic fade-in animation- you can pimp your ride now.

EDIT 1:

The above code made assumptions that you have nothing added to your Toolbar aside from just inflating the menu in onCreateOptionsMenu.

Suppose you have a complex ToolBar use this rather for your initialisation

@Override
public boolean onPrepareOptionsMenu(Menu menu) {
    for(int i =0; i < tool.getChildCount(); ++i){
        if(tool.getChildAt(i).getClass().getSimpleName().equals("ActionMenuView")){
            amv = (ActionMenuView) tool.getChildAt(i);
            break;
        }
    }
    return true;
}

Also where you call your initialisation of amv View can be in either onCreateOptionsMenu or onPrepareOptionsMenu, i chose onPrepareOptionsMenu because i wanted readability

Hope it helps

That's actually pretty neat! I will have to check that in practice and see how it goes. Thanks — ThanosFisherman, Sep 28 '15 at 02:01
well you can always accept and upvote & attach bounty to it and you are welcome@ThanosF — Elltz, Sep 29 '15 at 03:25
initialization of amv using the first way `tool.getChildAt(1);` caused classCastException but that's only because there was also a burger icon for the navigation drawer on my toolbar. Your second edited way worked wonderfully and I believe this is the right approach for initializing the `ActionMenuView` Anyways thanks again and here is your bounty! — ThanosFisherman, Sep 29 '15 at 04:00
you are welcomed, you shouldn't have attached the bounty immediately, now its off the featured list,lol, nevermind its good, yes the second approach is the deal, the first one was the logic. @ThanosF — Elltz, Sep 30 '15 at 15:18

How to animate toolbar overflow menu icon

1 Answers1

Linked