Following a tutorial, I created this layout:
Here's my layout xml file:
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/tabanim_maincontent"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
android:id="@+id/tabanim_appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.v7.widget.Toolbar
android:id="@+id/tabanim_toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:layout_scrollFlags="scroll|enterAlways"
app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />
<android.support.design.widget.TabLayout
android:id="@+id/tabanim_tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="@+id/tabanim_viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="@string/appbar_scrolling_view_behavior" />
</android.support.design.widget.CoordinatorLayout>
What I want is that when I leave the scroll in the mid (when just lower part of App bar is visible), then the appbar should either hide itself or show itself completely like it happens in google play store:
Please note that in case of google play, the app bar is never half hidden when no finger is touching the screen
how to make the app bar like this?
Thanks
snap-when the AppBar is half scrolled and content scrolling stopped, this will allow the AppBar to settle either hidden or appear based on the scrolled size of Toolbar.
Add a app:layout_behavior to a RecyclerView or any other View prepared of nested scrolling such as NestedScrollView. By Adding the above property in your XML, you can achieve the ability to hide and showing toolbar while scrolling.
Once content starts scrolling, the app bar will scroll faster than the content until it gets out of the overlapping content view. Once the content reaches top, app bar comes upside of the content and content goes underneath and scrolls smoothly. The whole AppBar can scroll off-screen along with content and can be returned while reverse scrolling.
App bars contains four main aspects, that plays huge role in scrolling behavior. They are, Example of a status bar, navigation bar, tab/search bar, and flexible space. Image from material.io AppBar scrolling behavior enriches the way contents in a page presented.
Add the snap flag to the scroll flags:
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_scrollFlags="scroll|enterAlways|snap" />
This was just added in Support Library v23.1.0.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With