Android之嵌套联动<二>：Coordinato

Android之嵌套联动<一>：NestedScrolling的使用是所有嵌套滚动效果的基础，先看一下布局文件代码：

<com.zyc.hezuo.animationdemo.MyCustomNestedScrollingParent
    android:id="@+id/nestedparent"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <ImageView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:src="@mipmap/pic_shi"/>

    <TextView
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:textSize="20sp"
        android:gravity="center"
        android:background="@color/bt_1"
        android:text="我是标题"/>

    <com.zyc.hezuo.animationdemo.MyCustomNestedScrollingChild
        android:id="@+id/nestedchild"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">


        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="我是任意内容我是任意内容我是任意内容我是任意内容我是任意内容我是任意内容我是任意内容我是任意内容我是任意内容我是任意内容"
            android:textSize="30sp"/>

    </com.zyc.hezuo.animationdemo.MyCustomNestedScrollingChild>

</com.zyc.hezuo.animationdemo.MyCustomNestedScrollingParent>

整个布局由MyCustomNestedScrollingParent包裹，它有三个子view，分别是ImageView、TextView、MyCustomNestedScrollingChild，MyCustomNestedScrollingChild实现了NestedScrollingChild接口，MyCustomNestedScrollingParent实现了NestedScrollingParent接口，两者相互配合，根据ImageView的高度计算具体行为。

然而，本章不会重复的说明NestedScrollingChild和NestedScrollingParent，本章的重点是CoordinatorLayout、AppBarLayout、NestedScrollView、RecyclerView结合使用。

（1） CoordinatorLayout+AppBarLayout+NestedScrollView

图片.png

如图所示，CoordinatorLayout实现了NestedScrollingParent2接口，NestedScrollingParent2和NestedScrollingParent类似，从上一篇就知道，仅仅只有NestedScrollingParent是没有嵌套联动效果的，必须结合NestedScrollingChild才可以，这里使用NestedScrollView，NestedScrollView实现了NestedScrollingChild2接口。

布局如下：

<android.support.design.widget.CoordinatorLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    tools:context=".MainActivity"
    android:background="#cccccc">


    <android.support.v4.widget.NestedScrollView
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textSize="26sp"
            android:text="阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多"/>

    </android.support.v4.widget.NestedScrollView>

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

然而，CoordinatorLayout还缺少一个至关重要的子布局AppBarLayout，两者是黄金搭档，它们同时存在才可以实现嵌套联动效果，布局代码如下：

<android.support.design.widget.CoordinatorLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    tools:context=".MainActivity"
    android:background="#cccccc">

    <android.support.design.widget.AppBarLayout
        android:id="@+id/app_bar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:visibility="visible">

        <ImageView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@mipmap/che1"
            app:layout_scrollFlags="scroll"/>

        <TextView
            android:layout_width="match_parent"
            android:layout_height="50dp"
            android:text="假设我是标题栏"
            android:textColor="#ffffff"
            android:gravity="center"
            android:textSize="20sp"/>

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

    <android.support.v4.widget.NestedScrollView
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textSize="26sp"
            android:text="阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多"/>

    </android.support.v4.widget.NestedScrollView>

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

效果如下：

117.gif

以上效果看起来并不友好，NestedScrollView始终全屏，下拉时AppBarLayout感觉像覆盖在NestedScrollView上一样。为了解决这个问题，需要在NestedScrollView上添加Behavior。

（2）添加Behavior

添加一句关键代码：

app:layout_behavior="@string/appbar_scrolling_view_behavior"

全部代码如下：

    <android.support.v4.widget.NestedScrollView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior">

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textSize="26sp"
            android:text="阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多阿萨打算多啊实打实大大多所啊实打实大大所大多"/>

    </android.support.v4.widget.NestedScrollView>

appbar_scrolling_view_behavior它的值是degisn依赖包自带的，它的值如下：

<string name="appbar_scrolling_view_behavior" translatable="false">android.support.design.widget.AppBarLayout$ScrollingViewBehavior</string>

看到这个值就可以明白，原来就是为了绑定AppBarLayout的内部类ScrollingViewBehavior，其效果如下：

118.gif

（3）scrollFlags说明

首先看一下这个布局代码

    <android.support.design.widget.AppBarLayout
        android:id="@+id/app_bar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:visibility="visible">

        <ImageView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@mipmap/che1"
            app:layout_scrollFlags="scroll"/>

        <TextView
            android:layout_width="match_parent"
            android:layout_height="50dp"
            android:text="假设我是标题栏"
            android:textColor="#ffffff"
            android:gravity="center"
            android:textSize="20sp"/>

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

在ImageView标签上添加了一句代码：

app:layout_scrollFlags="scroll"

这句代码可以让图片实现滚动效果，如果删除就不会有滚动效果了，scrollFlags往往和AppBarLayout一起使用。

scrollFlags的属性有scroll、enterAlways、enterAlwaysCollapsed、exitUntilCollapsed、snap、snapMargins，他们的效果如下：

一、[app:layout_scrollFlags="scroll"]：一般联动效果，上联动时先父后子，下联动时先子后父。

        <ImageView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@mipmap/che1"
            app:layout_scrollFlags="scroll"/>

118.gif

二、[app:layout_scrollFlags="scroll|enterAlways"]：上联动和下联动都是先父后子。

        <ImageView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@mipmap/che1"
            app:layout_scrollFlags="scroll|enterAlways"/>

119.gif

三、[app:layout_scrollFlags="scroll|enterAlways|enterAlwaysCollapsed"]

        <ImageView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@mipmap/che1"
            android:minHeight="50dp"
            app:layout_scrollFlags="scroll|enterAlways|enterAlwaysCollapsed"/>

enterAlwaysCollapsed是enterAlways的延伸，enterAlwaysCollapsed必须和enterAlways一起使用。enterAlwaysCollapsed主要对view的minHeight属性起作用。上联动时先父后子，下联动时，先父（到最小高度）后子再父。

120.gif

四、[app:layout_scrollFlags="scroll|exitUntilCollapsed"]

        <ImageView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@mipmap/che1"
            android:minHeight="50dp"
            app:layout_scrollFlags="scroll|exitUntilCollapsed"/>

上联动时，先父后到最小高度，后子。下联动时，先子后父。

121.gif

五、[app:layout_scrollFlags="scroll|snap"]

        <ImageView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@mipmap/che1"
            android:minHeight="50dp"
            app:layout_scrollFlags="scroll|snap"/>

图片实现viewpager类似的效果。

122.gif

六、[app:layout_scrollFlags="scroll|snap|snapMargins"]

snapMargins是snap延伸，必须和snap一起使用才会生效。

首先，给view添加margin，并且不使用snapMargins参数

        <ImageView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@mipmap/che1"
            android:layout_marginTop="100dp"
            android:layout_marginBottom="100dp"
            app:layout_scrollFlags="scroll|snap"/>

效果如下：

123.gif

如果添加上snapMargins参数之后

        <ImageView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@mipmap/che1"
            android:layout_marginTop="100dp"
            android:layout_marginBottom="100dp"
            app:layout_scrollFlags="scroll|snap|snapMargins"/>

效果如下：

124.gif

（4）结合RecyclerView

图片.png

如图所示，RecyclerView也实现了NestedScrollingChild2，所以RecyclerView可以和CoordinatorLayout、AppBarLayout一起实现联动效果。

布局如下：

<android.support.design.widget.CoordinatorLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    tools:context=".MainActivity"
    android:background="#cccccc">

    <android.support.design.widget.AppBarLayout
        android:id="@+id/app_bar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:visibility="visible">

        <ImageView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@mipmap/che1"
            app:layout_scrollFlags="scroll"/>

        <TextView
            android:layout_width="match_parent"
            android:layout_height="50dp"
            android:text="假设我是标题栏"
            android:textColor="#ffffff"
            android:gravity="center"
            android:textSize="20sp"/>

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

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

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

效果如下：

125.gif

[本章完...]