CoordinatorLayout 學習(一) - CoordinatorLayout的基本使用

  最近忙完了學校的事情，終於又成功的跑去公司上班了(還好公司沒有嫌棄我菜😂😂)。在學校廢了半年多，感受好多東西都不太會了，因此以爲本身應該找點事情來作，因而選中學習CoordinatorLayout。其實在昨年，我就對CoordinatorLayout進行了簡單的學習，不過當時學習的重點放在了嵌套滑動，從而未對CoordinatorLayout進行深刻和系統的學習，這個也算是昨年留下的一個遺憾。所以，我以爲仍是應該彌補一下。   樓主寫一個系列文章來詳細的介紹CoordinatorLayout，分別會介紹它的基本使用，Behavior的原理解析以及自定義，最後就是CoordinatorLayout的擴展，這部分的內容不固定，篇幅也不固定。   本文參考文章

1. CoordinatorLayout使用詳解: 打造摺疊懸浮效果

1. 概述

  做爲本系列文章第一篇文章，我以爲仍是有必要簡單介紹一下CoordinatorLayout。   CoordinatorLayout顧名思義，協調者佈局。所謂的協調者佈局，它主要是協調誰，協調啥呢？我相信你們在學這個佈局時，都會思考這兩個問題。其實說的簡單點，協調者佈局主要協調child之間的聯動。請注意個人措辭，child之間的聯動。   可能有的同窗對聯動仍是有點陌生，我簡單的舉一個例子，好比說，咱們在滑動一個RecyclerView,存在一個View須要在RecyclerView滑動時作相應的動做，例如，位移變化，縮放變化等等。我相信這種場景仍是很是常見的吧。這種場景就能夠稱之爲child之間聯動。   而CoordinatorLayout是怎麼進行協調呢？主要依靠一個插件--Behavior。在CoordinatorLayout內部，每一個child都必須帶一個Behavior（其實不攜帶也行，不攜帶就不能被協調），CoordinatorLayout就根據每一個child所攜帶的Behavior信息進行協調。   這裏還須要提一句的是，Behavior不只僅協助聯動，並且仍是接管了child的三大流程，有點相似於RecyclerView的LayoutManager。   而Behavior是怎麼進行協助聯動呢？這就涉及到嵌套滑動的相關知識，總的來講，Behavior包括整個CoordinatorLayout體系就是對嵌套滑動的應用和實現。因此，咱們便知道了，嵌套滑動到底有多麼重要了。   本文主要介紹CoordinatorLayout的基本使用，主要是介紹CoordinatorLayout與AppBarLayout的搭配使用。 #2. AppBarLayout   若是咱們想要實現摺疊的ActionBar效果，在CoordinatorLayout中，AppBarLayout絕對是做爲首選的控件。   在正式介紹AppBarLayout的使用時，咱們先來看看幾個Flag，這幾個Flag在AppBarLayout裏面很是的重要。

名稱	值	做用
SCROLL_FLAG_NO_SCROLL	0x0	設置這個flag，將表示該View不能被滑動。也就是說不參與聯動。
SCROLL_FLAG_SCROLL	0x01	設置這個Flag，表示該View參與聯動。具體效果須要跟其餘Flag組合。
SCROLL_FLAG_EXIT_UNTIL_COLLAPSED	0x02	設置這個Flag，表示當View被推出屏幕時，會跟着滑動，直到摺疊到View的最小高度；同時只有在其餘View(好比說RecyclerView)滑動到頂部纔會展開。
SCROLL_FLAG_ENTER_ALWAYS	0x02	設置這個Flag，不論是View是滑出屏幕仍是滑進屏幕，該View都能當即響應滑動事件，跟隨滑動。好比說，若是該View是摺疊的，當RecyclerView向下滑動時，該View隨時都能跟隨展開；反之亦然。
SCROLL_FLAG_ENTER_ALWAYS_COLLAPSED	0x04	在SCROLL_FLAG_ENTER_ALWAYS的基礎上，該Flag增長了摺疊到固定高度的限制。在View下拉過程當中，首先會將該View顯示minHeight的高度，RecyclerView在繼續下拉（這裏以RecyclerView爲例）。注意，該Flag在SCROLL_FLAG_ENTER_ALWAYS前提下生效。
SCROLL_FLAG_SNAP	0x08	該Flag表示View擁有吸附功能。好比說，當前滑動中止，View離底部更近，那麼就會摺疊；反之則會展開。

  這幾個Flag很是的簡單，咱們來看看具體的使用，先來看看佈局文件：

<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.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">

    <com.google.android.material.appbar.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
        <View
            android:layout_width="match_parent"
            android:layout_height="50dp"
            android:background="#5FF"
            app:layout_scrollFlags="scroll|enterAlwaysCollapsed" />
        <View
            android:background="#FF00FF"
            android:layout_width="match_parent"
            android:layout_height="50dp"/>
    </com.google.android.material.appbar.AppBarLayout>

    <androidx.recyclerview.widget.RecyclerView
        android:id="@+id/recyclerView"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior" />
</androidx.coordinatorlayout.widget.CoordinatorLayout>
複製代碼

  這裏須要幾點，以下：

1. 我在AppBarLayout裏面放了兩個View，其中一個設置scrollFlags，一個沒有設置。沒有設置的是不會摺疊的。
2. 在這裏，AppBarLayout並無設置Behavior,而RecyclerView卻設置了的。我統一的解釋一下，在CoordinatorLayout內部，理論上每一個View必須攜帶一個Behavior,而這裏AppBarLayout沒有攜帶是由於它自己就有，因此不須要申明(在後面，咱們會看到幾種設置Behavior的方式，這裏買一個關子。)

  而後，咱們來看看效果：

  這裏，我再也不介紹其餘Flag的效果，有興趣能夠嘗試一下。

3. CollapsingToolbarLayout

  接下來，咱們再來看一下CollapsingToolbarLayout。CollapsingToolbarLayout主要是實現摺疊佈局的，咱們來看看是怎麼使用的。首先，咱們來看看CollapsingToolbarLayout的幾個Flag：

名稱	值	做用
COLLAPSE_MODE_OFF	0	默認值，表示View不會有任何屬性
COLLAPSE_MODE_PIN	1	當CollapsingToolbarLayout徹底收縮以後，設置該Flag的View會保留在屏幕當中。
COLLAPSE_MODE_PARALLAX	2	設置該Flag的View會跟內容滾動，能夠經過setParallaxMultiplier方法來設置視圖差比率，其中0表示毫無視圖差，徹底跟內容滾動同步；1表示View徹底不動。默認的視圖差爲0.5。

  接下來咱們看一個Demo：

<androidx.coordinatorlayout.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">

    <com.google.android.material.appbar.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="300dp">

        <com.google.android.material.appbar.CollapsingToolbarLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            app:layout_scrollFlags="scroll|exitUntilCollapsed">

            <ImageView
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:scaleType="centerCrop"
                android:src="@drawable/demo"
                app:layout_collapseMode="parallax" />

            <androidx.appcompat.widget.Toolbar
                android:id="@+id/toolbar"
                android:layout_width="match_parent"
                android:layout_height="50dp"
                android:background="#5FF"
                app:layout_collapseMode="pin" />
        </com.google.android.material.appbar.CollapsingToolbarLayout>
    </com.google.android.material.appbar.AppBarLayout>

    <androidx.recyclerview.widget.RecyclerView
        android:id="@+id/recyclerView"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior" />
</androidx.coordinatorlayout.widget.CoordinatorLayout>
複製代碼

  使用CollapsingToolbarLayout時，咱們須要注意的是：CollapsingToolbarLayout須要做爲AppBarLayout子View。而後咱們來看看相關的效果：

#4. 總結   本文主要介紹CoordinatorLayout的基本使用，仍是很是簡單的，可是咱們從上面的代碼看出，好像根本就沒有介紹它。CoordinatorLayout做爲協調者，確定是很是重要的，具體介紹在後續的文章會詳細的分析。在這裏先對本文作一個簡單的總結。

1. 使用AppBarLayout時，咱們須要注意4種flag的不一樣點。
2. CollapsingToolbarLayout須要做爲AppBarLayout的子View纔會有效，同時還須要注意它的3種flag。

  若是不出意外的話，下一篇文章咱們將分析RecyclerView和AppBarLayout的聯動。