关键字：CollapsingToolbarLayout、材料设计
项目地址：AboutMaterialDesign
安卓材料设计中，这是最后一个用于布局中的类 -- CollapsingToolbarLayout。CollapsingToolbarLayout 是继承自 FramenLayout 的子类，它为我们提供了滑动渐变的效果。除此之外，并没有其他功能，因此使用的场景其实非常单一，而且明白了主要的参数，就可以驾驭它所提供的功能。。我们先看看基本效果：
GIF.gif
GIF.gif
下面先说注意点：
- 1.建议使用最新的 design 包，因为版本在不断更新，越新的版本 bug 越少。比如这次测试的时候，我在三星手机上发现 Toolbar 的展示位置不对，后来更新了 design 包的版本，问题就没了。
- 2.通常使用 CollapsingToolbarLayout 时，结构都是固定的，即： CoordinatorLayout - AppBarLayout - CollapsingToolbarLayout - ToolbarLayout && ImageView。 且 Toolbar 外部的容器和 ImageView 都需要有 fitSystemWindow="true" 属性才能达到上图效果
- 3.Toolbar的高度必须固定，不能设置为"wrap_content"，否则Toolbar不会滑动，也没有折叠效果
- 4.CoordinatorLayout的直接子View必须是一个可滑动的控件，并且内部有内容可以滑动。同时需要设置app:layout_behavior
- 5.当效果出现重叠或者其他不如意的效果，那一般都和你在用的 CollapsingToolbarLayout 没有关系，仔细检查一下 Toolbar 和 AppBarLayout 的属性设置对不对，因为 CollapsingToolbarLayout 可以设置的东西真的不多。
一、我就是列一下属性
下面介绍一下 CollapsingToolbarLayout 的属性：
contentScrim -- 折叠后内容的显示颜色
statusBarScrim -- 折叠后菜单的显示颜色
expandedTitleGravity -- 展开时 Toolbar title 的显示位置
collapsedTitleGravity -- 折叠时 Toolbar title 的显示位置
expandedTitleMargin -- 对应的有四个 上下左右
expandedTitleTextAppearance -- 展开 title 样式
collapsedTitleTextAppearance -- 折叠 title 样式
scrimVisibleHeightTrigger -- 设置收起多少高度时，显示ContentScrim的内容
layout_collapseMode -- 折叠模式
-none 跟随滚动的手势进行折叠。
-parallax 视差滚动，搭配layout_collapseParallaxMultiplier（视差因子）使用。
-pin 固定不动。
layout_collapseParallaxMultiplier -- 视差因子，范围：0-1，默认0.5
二、我就是贴一下代码
附上开头第二张动态图的布局代码：
<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/main_content"
android:fitsSystemWindows="true" ----------------------------------------------- ***
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
android:id="@+id/appbar"
android:fitsSystemWindows="true" ------------------------------------------- ***
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.design.widget.CollapsingToolbarLayout
android:fitsSystemWindows="true" --------------------------------------- ***
android:id="@+id/collapsing_toolbar"
android:layout_width="match_parent"
android:layout_height="@dimen/detail_backdrop_height"
app:layout_scrollFlags="scroll|exitUntilCollapsed" --------------------- ***
app:contentScrim="?attr/colorPrimary"
app:expandedTitleMarginStart="48dp"
app:expandedTitleMarginEnd="64dp">
<ImageView
android:id="@+id/backdrop"
android:fitsSystemWindows="true" ------------------------------------ ***
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="centerCrop"
app:layout_collapseMode="parallax" /> ------------------------------- ***
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:layout_collapseMode="pin" /> ------------------------------------ ***
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.NestedScrollView
android:fitsSystemWindows="true"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="@string/appbar_scrolling_view_behavior">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:paddingTop="24dp">
</LinearLayout>
</android.support.v4.widget.NestedScrollView>
<android.support.design.widget.FloatingActionButton
android:layout_height="wrap_content"
android:layout_width="wrap_content"
app:layout_anchor="@id/appbar"
app:layout_anchorGravity="bottom|right|end"
android:src="@drawable/ic_down"
android:layout_margin="@dimen/fab_margin"
android:clickable="true"/>
</android.support.design.widget.CoordinatorLayout>
