Bug: bad animation for showMenuButton and hideMenuButton of FloatingActionMenu

[AndroidDeveloperLB]

The icon doesn't stay centered, as the button scales up and down.
Here's how I've checked:

findViewById(R.id.button).setOnClickListener(new OnClickListener() {
@OverRide
public void onClick(final View v) {
if (menu1.isMenuButtonHidden())
menu1.showMenuButton(true);
else menu1.hideMenuButton(true);
}
});

and this is how it looks like:

How can I fix this?

[plrdev]

I have the same issue. It does not happen with the button, only with menu. This seems to be the same issue already reported in #119.

This would be very important to get a fix, @Clans are you still active at all?

[AndroidDeveloperLB]

@eduplus Actually, I fixed it by modifying the code quite a lot. I want to put it on Github some day.
The modification removes some abilities of here, but on the good side, it uses the official Google's support library's FAB for the main button (yet the small ones for the others because I didn't want to do it too, and because the official one doesn't have "setSize" function) .
Would you be interested in this ?

[plrdev]

Yes, I would be interested in seeing that, but not sure if it is something I can use. Might need some of the features. It could still be valuable to see what you did.

[AndroidDeveloperLB]

@eduplus ok then, here:
https://github.com/AndroidDeveloperLB/FloatingActionButtonEx

[plrdev]

Thanks.

At the same time I took a look under the hood and was able to figure out the reason for this bug. Same animation is used for animating the button and icon inside the button. My feeling is that Android Animation instance seems to hold some state information, so it is not wise to have the same instance running on two views at the same time.

I can make a pull request to fix this, but since they are not being merged, not sure how much that will help people. Here is a quick and dirty fix that can be done without changes to the library (uses reflection):

Field toggleHideAnimation = FloatingActionMenu.class.getDeclaredField("mMenuButtonHideAnimation");
toggleHideAnimation.setAccessible(true);
toggleHideAnimation.set(fabMenu, AnimationUtils.loadAnimation(context, R.anim.fab_scale_down));
Field toggleShowAnimation = FloatingActionMenu.class.getDeclaredField("mMenuButtonShowAnimation");
toggleShowAnimation.setAccessible(true);
toggleShowAnimation.set(fabMenu, AnimationUtils.loadAnimation(context, R.anim.fab_scale_up));

[AndroidDeveloperLB]

@eduplus I'm pretty sure it's better to use the newer API for animation and that's it, meaning :

view.animate()...

[kakai248]

There's also another issue regarding the scale animations (the ones that mimic the design library animations). The view fades to the top left instead of fading to the center of the button. The issue is in the animation itself:

<?xml version="1.0" encoding="utf-8"?>
<scale xmlns:android="http://schemas.android.com/apk/res/android"
    android:interpolator="@android:interpolator/overshoot"
    android:fromXScale="0.0"
    android:toXScale="1.0"
    android:fromYScale="0.0"
    android:toYScale="1.0"
    android:pivotX="50%"
    android:pivotY="50%"
    android:duration="200" />

For example in the fab_scale_up.xml, it pivots the coordinate center by 50%. The problem is that in the FAM the center is not in the button itself, it's in another part of the view as you can see here.

Changing, for example, the pivotX and pivotY to 80% "helps" with the issue however, these 80% are not exact as it depends on the menu FAB's and respective labels. I'm not sure if this can be fixed using only xml.

[AndroidDeveloperLB]

@kakai248 As I wrote, it's better to use the newer animation API, and on the correct views.
min API for this library is 14 anyway.