
With the new Android Support Design library, AppBar has some cool features.
I am looking for an implementation of the same scroll effect as shown in the gif above. (From Google Play games → My games)
I looked at adding the following attribute to nestedscrollview by placing the content above the application bar.
app:behavior_overlapTop
It works as expected when all components inside the application panel are configured to scroll.
app:layout_scrollFlags="scroll"
If I want TabLayout to be docked at the top, the space below it will also be docked. It looks strange:

In short, is there a way to create the above using the new design library, or do I need to do it the other way?
XML requested:
<android.support.design.widget.CoordinatorLayout android:id="@+id/content" android:layout_height="match_parent" android:layout_width="match_parent"> <android.support.design.widget.AppBar android:id="@+id/appbar" android:layout_width="match_parent" android:layout_height="164dp" android:background="?attr/colorPrimary"> <android.support.v7.widget.Toolbar android:id="@+id/toolbar" android:layout_width="match_parent" android:layout_height="?attr/actionBarSize" app:layout_scrollFlags="scroll"/> <android.support.design.widget.TabLayout android:id="@+id/tabLayout" android:layout_width="match_parent" android:layout_height="wrap_content" app:layout_scrollFlags="scroll|enterAlways"/> </android.support.design.widget.AppBar> <android.support.v4.view.ViewPager android:id="@+id/viewpager" android:layout_height="match_parent" android:layout_width="match_parent" android:clipToPadding="false" app:layout_behavior="@string/appbar_scrolling_view_behavior" app:behavior_overlapTop="32dp"/> </android.support.design.widget.CoordinatorLayout>
source share