Search code examples
androidscrolltoolbarappbar

How to make the Toolbar snap into view or out of view when using Google Design Library?


I am trying to achieve an effect like WhatsApp has, where the Toolbar (when scrolled) will clip into view magnetlike, or out of view magnetlike.

What I have im my MainActivity XML:

  • DrawerLayout - Base Layout
  • CoordinatorLayout - Layout for the Appbar and Toolbar and Tabs
  • AppBarLayout - For holding Toolbar and Tabs
  • Toolbar - has THIS flag: app:layout_scrollFlags="scroll|enterAlways"
  • SlidingTabLayout - Displays tabs
  • ViewPager - For tabs
  • RecyclerView - For coordinatorlayout

Now dont get me wrong, it works, when I scroll down the toolbar gets pushed out of view but say I stop scrolling halfway, then the toolbar just sits there half hidden out of view and the other half in view..

How can I approach solving this problem, as I want it to either snap out of view or into view.


Solution

  • This feature has been added in 23.1.0 version of android support library. From release notes:

    Added edge snapping support to the AppBarLayout class by adding the SCROLL_FLAG_SNAP constant. When scrolling ends, if the view is only partially visible, the view is snapped and scrolled to its closest edge.

    <android.support.design.widget.CoordinatorLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent">
    
            <android.support.design.widget.AppBarLayout
                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/toolbar"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        app:layout_scrollFlags="scroll|enterAlways|snap" />
               -----
               -----
    

    For more info: http://android-developers.blogspot.in/2015/10/android-support-library-231.html