Android - Fade in / Fade out ActionBar Item when show / hide it

Question

Is there any simple way to animate an ActionBar Item with Fade In / Fade out animations when show / hide it? Maybe with something like this:

@Override
public boolean onCreateOptionsMenu(Menu menu) {
    getSupportMenuInflater().inflate(R.menu.menu, menu);

    if (visible) {
        menu.findItem(R.id.randomItemID).setVisible(true);
    else {
        menu.findItem(R.id.randomItemID).setVisible(false);
    }
    return true;
}


private void showHideActionItem() {

    if (visible) {
        // Fade Out animation here
        visible = false;
        invalidateOptionsMenu();
    } else {
        // Fade In animation here
        visible = true;
        invalidateOptionsMenu();
    }
}

Thanks, Tony.

Answer 1

I've found this question really interesting so I've decided to find out a solution (so forgive me if the solution, it's not as optimal as it can be, it's just an example for showing the way to go).

After some research I've decided to use the Android timer: the global idea is to have a timer which will update the actionBar background on a regular interval (so into making a fade_in effect, I just have to keep the same background and change its opacity).

Here my implementation :

First: my custom class which will do most of the work:

public class ToolbarAnimator {
    private final static String TAG = ToolbarAnimator.class.getSimpleName();
    private final int ALPHA_MAX = 255;//just look at the documentation
    private final int NUMBER_OF_TICK = 255;//can go from 1 to 255, it's the number of tick
    private final int ALPHA_PER_TICK = ALPHA_MAX / NUMBER_OF_TICK;//alpha we'll remove/add on every tick
    private long DELAY = 1000;//amount of time in milliseconds before animation execution.
    private final AppCompatActivity mActivity;

    /*
    ** Private field
     */
    private ActionBar mActionBar;
    private Timer mTimer;
    private int mCurrentAlpha;
    private int mActionBarBackgroundColor;

    /*
    ** Constructor
     */
    public ToolbarAnimator(@NonNull AppCompatActivity activity, @NonNull final ActionBar actionBar, final int actionBarBackgroundColor) {
        mActivity = activity;
        mActionBar = actionBar;
        mTimer = new Timer();
        mCurrentAlpha = 0;
        mActionBarBackgroundColor = actionBarBackgroundColor;
    }

    /*
    ** Public method
     */
    public void start(final long duration) {
        final long period = duration / NUMBER_OF_TICK;//time beetwen 2 run() call

        Log.d(TAG, "start");
        Log.d(TAG, "delay = " + DELAY);
        Log.d(TAG, "period = " + period);
        Log.d(TAG, "duration = " + duration);
        Log.d(TAG, "alphaPerTick = " + ALPHA_PER_TICK);

        //init a timer which will updateActionBarColor on every each period
        mTimer.schedule(new TimerTask() {
            @Override
            public void run() {
                //update the actionBar
                updateActionBarColor();
            }
        }, DELAY, period);
    }

    /*
    ** Private method
     */
    private void updateActionBarColor() {
        //We have to go to the main thread for updating the interface.
        mActivity.runOnUiThread(new TimerTask() {
            @Override
            public void run() {
                //check if the animation is finish
                if (mCurrentAlpha > 255 || mCurrentAlpha < 0) {
                    Log.d(TAG, "cancel timer");
                    mTimer.cancel();
                    mTimer.purge();
                    return;
                }
                //create the new backgroundColorDrawable
                final Drawable backgroundDrawable = new ColorDrawable(mActionBarBackgroundColor);
                backgroundDrawable.setAlpha(mCurrentAlpha);

                //apply the new color
                mActionBar.setBackgroundDrawable(backgroundDrawable);

                //upgrade alpha
                mCurrentAlpha += ALPHA_PER_TICK;
            }
        });
    }
}

When you have this class, you can start the animation from any activity or fragment:

@Override
public boolean onCreateOptionsMenu(Menu menu) {
    //just inflate the actionBar
    getMenuInflater().inflate(R.menu.menu_main, menu);

    //Check if the supportActionBar has been enable
    final ActionBar actionBar = getSupportActionBar();
    if (actionBar != null) {
        //Start a 2s animation on the actionBar
        new ToolbarAnimator(this, actionBar, Color.RED).start(2 * 1000);
    }
    return true;
}

UPDATE:

I've done a sample application which implements much more features (for example, you can choose fade_in or fade_out), you can find the source code here.