How do the animation hiding the ActionBar and keeping tabs?

Question

In version 5 of Google Play Store app, scroll to the content, ActionBar on with scrolling, but the tabs are fixed to get on top.

How to do this?

BEFO

Answer 1

As others have suggested, use ObservableScrollView from: https://github.com/ksoichiro/Android-ObservableScrollView

Try putting both the Toolbar and the SlidingTabStrip in the same container, then animate that container as the user scrolls the ObservableScrollView, for example:

Then when you override the ObservableScrollViewCallbacks you could do something like this:

@Override
public void onScrollChanged(int scrollY, boolean firstScroll, boolean dragging) {

    toolbarContainer.animate().cancel();

    int scrollDelta = scrollY - oldScrollY;
    oldScrollY = scrollY;

    float currentYTranslation = -toolbarContainer.getTranslationY();
    float targetYTranslation = Math.min(Math.max(currentYTranslation + scrollDelta, 0), toolbarHeight);
    toolbarContainer.setTranslationY(-targetYTranslation);
}

@Override
public void onUpOrCancelMotionEvent(ScrollState scrollState) {
    float currentYTranslation = -toolbarContainer.getTranslationY();
    int currentScroll = listView.getCurrentScrollY();

    if (currentScroll < toolbarHeight) {
        toolbarContainer.animate().translationY(0);
    } else if (currentYTranslation > toolbarHeight /2) {
        toolbarContainer.animate().translationY(-toolbarHeight);
    } else {
        toolbarContainer.animate().translationY(0);
    }
}

The onUpOrCancelMotionEvent stuff is to animate the container to prevent the toolbar from being only half shown/hidden.

Here's a demo video just for reference: https://drive.google.com/file/d/0B7TH7VeIpgSQSzZER1NneWpYa1E/view?usp=sharing