Android | 玩轉AppBarLayout，設置scrollFlags滑動屬性詳解

CoordinatorLayout與AppBarLayout的配合使用，在之前的文章中我們也經常使用，主要是專門用來打造各種炫酷的效果。

有童鞋看了之前的文章反饋對AppBarLayout中的scrollFlags屬性的設置不是很明白，這篇文章我們具體來講講這個屬性的用法效果。

我們先簡單了解一下AppBarLayout：

AppBarLayout繼承自LinearLayout，布局方向為垂直方向。所以你可以把它當成垂直布局的LinearLayout來使用。AppBarLayout是在LinearLayou上加了一些材料設計的概念，它可以讓你定制當某個可滾動View的滾動手勢發生變化時，其內部的子View實現何種動作。

這里說得其內部的子View實現任何動作，就是可以通過scrollFlags屬性進行設置達到想要的效果。

那么app:layout_scrollFlags可以設置哪些動作呢？

下面我們通過XML布局文件代碼和對應的效果圖進行解析：

1、scroll

子View會跟隨滾動事件一起發生移動而滾出或滾進屏幕。注意兩點：第一點，如果使用了其他值，必定要使用這個值才能起作用；第二點：如果在這個子View前面的任何其他子View沒有設置這個值，那么這個子View的設置將失去作用。

布局文件：

<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true">

    <android.support.design.widget.AppBarLayout
        android:id="@+id/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/tb_toolbar"
            android:layout_width="match_parent"
            android:layout_height="50dp"
            android:background="@color/colorPrimary"
            app:layout_scrollFlags="scroll"
            app:title="@string/app_name" />

    </android.support.design.widget.AppBarLayout>

    <android.support.v7.widget.RecyclerView
        android:id="@+id/recyclerView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:layout_behavior="@string/appbar_scrolling_view_behavior" />

</android.support.design.widget.CoordinatorLayout>

對應效果圖：

2、enterAlways

和scroll相比較，其實就是向下滾動時優先級問題，scroll首先滑動的是列表，列表的數據全部滾動完畢，才開始toolbar滑動。而scroll | enterAlways首先滑動的是toolbar ，然后再去滑動其他的view。只是優先級先后的問題。

布局文件：代碼類型，只是改變屬性值，這里就不贅述了

......................
 <android.support.v7.widget.Toolbar
            android:id="@+id/tb_toolbar"
            android:layout_width="match_parent"
            android:layout_height="50dp"
            android:background="@color/colorPrimary"
            app:layout_scrollFlags="scroll|enterAlways"
            app:title="@string/app_name" />
 ......................

對應效果圖：

3、enterAlwaysCollapsed

enterAlwaysCollapsed是enterAlways的附加標志，這里涉及到子View的高度和最小高度，向下滾動時，子View先向下滾動最小高度值，然后Scrolling View開始滾動，到達邊界時，子View再向下滾動，直至顯示完全。

布局文件：代碼類型，只是改變屬性值，這里就不贅述了

............................
 <android.support.v7.widget.Toolbar
            android:id="@+id/tb_toolbar"
            android:layout_width="match_parent"
            android:layout_height="200dp"
            android:minHeight="50dp"
            android:background="@color/colorPrimary"
            app:layout_scrollFlags="scroll|enterAlways|enterAlwaysCollapsed"
            app:title="@string/app_name" />
.............................

對應效果圖：

4、exitUntilCollapsed

這里也涉及到最小高度。發生向上滾動事件時，子View向上滾動直至最小高度，然后Scrolling View開始滾動。也就是，子View不會完全退出屏幕。

布局文件：代碼類型，只是改變屬性值，這里就不贅述了

...................................
<android.support.v7.widget.Toolbar
            android:id="@+id/tb_toolbar"
            android:layout_width="match_parent"
            android:layout_height="200dp"
            android:minHeight="50dp"
            android:background="@color/colorPrimary"
            app:layout_scrollFlags="scroll|exitUntilCollapsed"
            app:title="@string/app_name" />
 ....................................

對應效果圖：

5、snap

子View滾動比例的吸附效果。也就是說子View不會存在局部顯示的情況，滾動到子View的部分高度，當我們松開手指時，子View要么向上全部滾出屏幕，要么向下全部滾進屏幕。

布局文件：代碼類型，只是改變屬性值，這里就不贅述了

......................
 <android.support.v7.widget.Toolbar
            android:id="@+id/tb_toolbar"
            android:layout_width="match_parent"
            android:layout_height="200dp"
            android:background="@color/colorPrimary"
            app:layout_scrollFlags="scroll|snap"
            app:title="@string/app_name" />
......................

對應效果圖：

6、snapMargins

snapMargins是必須配合snap一起使用的額外的flag。如果設置的話，這個View將會被snap到它的頂部外邊距和它的底部外邊距的位置，而不是這個View自身的上下邊緣。

布局文件：

<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true">

    <android.support.design.widget.AppBarLayout
        android:id="@+id/appbar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@color/colorPrimary"
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

        <android.support.v7.widget.Toolbar
            android:id="@+id/tb_toolbar"
            android:layout_width="match_parent"
            android:layout_height="100dp"
            android:layout_marginStart="10dp"
            android:layout_marginTop="200dp"
            android:layout_marginEnd="10dp"
            android:layout_marginBottom="10dp"
            android:background="@color/colorAccent"
            app:layout_scrollFlags="scroll|snap|snapMargins"
            app:title="@string/app_name" />

    </android.support.design.widget.AppBarLayout>

    <android.support.v7.widget.RecyclerView
        android:id="@+id/recyclerView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:layout_behavior="@string/appbar_scrolling_view_behavior" />

</android.support.design.widget.CoordinatorLayout>

對應的效果圖：

可以看到Margin生效了，滑動必須超過Toolbar的高度以及上下Margin就會繼續滑動，否則就恢復。

上面的內容就介紹完了，代碼基本都在文章里，就不放demo了。

到這里就結束啦！