Hamburger icon both sides with back spin animation in toolbar for Two NavigationView?
First, check out the screenshot below and focus only on the hamburger icon so you quickly get a sense of what I really want.
First of all, I have successfully navigated (drawer) from both sides to the left and right so that the user can open two drawers on the left and right.
Now my question is I want a hamburger icon with animation on both sides . I've implemented the hamburger icon on the left side of the toolbar, which is easy and default. but now I want it to be correct and with arrow animation.
- Click on the left hamburger icon to open the left drawer. (Done)
- right click on the hamburger drawer icon on the right side. (left)
So, is it possible to have two hamburger icons on the same toolbar?
Note. Both drawers open with gestures. and I have no problem with it.
source to share
I think you can do it with FrameLayout.
Now consider the following layout
<FrameLayout>
<Toolbar />
<Toolbar layout_direction="right" />
</FrameLayout>
Using this, both toolbars will be displayed on top of each other. Place the drawer icon on both toolbars, and the second toolbar will display it on the right, because we specified the layout direction to the right.
Note. Make the top toolbar transparent.
Hope this helps you.
source to share
You can write an animation that translates your right icon like this
By opening the drawer from x to x-someDelta strong>
and when closing the box from x-somedelta to x
EDIT:
You can use ObjectAnimator and its superclass Value Animator
you can do something like this
ObjectAnimator anim = ObjectAnimator.ofFloat(rightIcon, "translationX", 0,50);
anim.start();
Use a boolean and toggle it from 50.0 in the object animator to step back
Also you can use setDuration method to set how long the animation takes to complete
source to share