Android之嵌套联动<三>：Collapsing

Android之嵌套联动<一>：NestedScrolling的使用
Android之嵌套联动<二>：CoordinatorLayout+AppBarLayout现实

本章是以上两篇文章的延伸。

首先看一下大致的效果图

127.gif

下面开始详解说明一下

（1）Toolbar属性

上图中给Toolbar添加了返回按钮，并且将Toolbar的背景设置成完全透明。这里需要重点说明的两个属性分别是：layout_collapseMode、layout_collapseParallaxMultiplier

layout_collapseMode：折叠模式
layout_collapseParallaxMultiplier：折叠因子

[layout_collapseMode]折叠模式

该属性有三种值，分别是pin、parallax、none。

pin：Toolbar固定，如图：

129.gif

现象是：左上角的返回键位置没有移动，说明，Toolbar是固定的。

parallax：Toolbar跟随滚动，如图：

130.gif

现象是：左上角的返回键位置跟随滚动。

none：Toolbar跟随滚动（默认），和parallax一样。

如果折叠模式选择了parallax，那么还可以添加折叠因子layout_collapseParallaxMultiplier，用法如下图：

图片.png

（2）CollapsingToolbarLayout属性

首先看一下布局代码：

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

        <android.support.design.widget.CollapsingToolbarLayout
            android:id="@+id/collapsing_toolbar_layout"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            app:contentScrim="?attr/colorPrimary"
            app:title="CollapsingToolbarLayout演示"
            app:layout_scrollFlags="scroll|exitUntilCollapsed"
            app:toolbarId="@+id/toolbar">

            <ImageView
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:scaleType="centerCrop"
                android:src="@mipmap/che4"
                android:visibility="visible" />

            <android.support.v7.widget.Toolbar
                android:id="@+id/toolbar"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                android:background="@android:color/transparent"
                app:title="我是Toolbar"
                app:navigationIcon="@mipmap/back"
                app:layout_collapseMode="parallax"
                app:layout_collapseParallaxMultiplier="0.7"  />

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

AppBarLayout下是CollapsingToolbarLayout，CollapsingToolbarLayout是design依赖中的控件之一，主要目的是为了实现Toolbar的折叠效果。

[app:layout_scrollFlags]：这个属性上一篇文章已经解释过了，不再重复描述了。

[app:toolbarId]：在折叠的时候 显示的toolbar的id

[contentScrim]：当Toolbar折叠到一定程度时的背景颜色

[scrimAnimationDuration]：控制Toolbar收缩时，颜色变化持续时间

[collapsedTitleTextAppearance]：在折叠的时候标题文字的外观。必须引用另一个资源

[expandedTitleTextAppearance ]：在展开的时候标题文字的外观

[collapsedTitleGravity]：指定在折叠之后标题放置的位置

[expandedTitleGravity]：在展开的时候 标题放置的位置

[expandedTitleMargin]：设置边界距离，还可以单独设置Bottom、Top、Left、Right等

[scrimVisibleHeightTrigger]：触发背景颜色改变

[statusBarScrim]：在折叠的时候 状态栏 的背景颜色（一般不需要设置）

[titleEnabled]：是否显示标题

以上属性效果就不截图了。

（3）其他说明

• 如果理解前两篇文章的话，就会觉得这个特别简单
• CollapsingToolbarLayout往往和Toolbar配合使用

[本章完...]