首發(fā)于我的博客,轉(zhuǎn)載請注明作者和原文鏈接赖歌。

CollapsingToolbarLayout通常用來在布局中包裹一個Toolbar养涮，同時作為AppBarLayout的直接子View芯肤，才可以實現(xiàn)“折疊效果”的標(biāo)題欄逞壁。

CollapsingToolbarLayout屬性說明

• app:title / setTitle()
  ToolBar的標(biāo)題毛俏，當(dāng)CollapsingToolbarLayout展開時考余，title顯示的是大字體砂豌，在折疊的過程中，title不斷變小到一定大小的效果光督。

• app:contentScrim / setContentScrim()
  ToolBar被折疊到頂部固定時候的背景阳距。

• app:statusBarScrim / setStatusBarScrim()
  折疊后狀態(tài)欄的背景。

• app:scrimVisibleHeightTrigger
  設(shè)置收起多少高度時结借，顯示ContentScrim的內(nèi)容筐摘。

• app:scrimAnimationDuration
  展開狀態(tài)和折疊狀態(tài)之間，內(nèi)容轉(zhuǎn)換的動畫時間船老。

下面兩個屬性是作為CollapsingToolbarLayout的子View才能設(shè)置并生效的：

• app:layout_collapseMode折疊模式
  none 跟隨滾動的手勢進(jìn)行折疊咖熟。
  parallax 視差滾動，搭配layout_collapseParallaxMultiplier（視差因子）使用柳畔。
  pin 固定不動馍管。

• app:layout_collapseParallaxMultiplier
  視差因子，范圍：0-1薪韩，默認(rèn)0.5确沸。

layout布局

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

    <android.support.design.widget.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:fitsSystemWindows="true"
        android:id="@+id/app_bar_layout"
        android:theme="@style/AppTheme.AppBarOverlay">
        <android.support.design.widget.CollapsingToolbarLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:id="@+id/collapsing_toolbar_layout"
            app:statusBarScrim="@android:color/transparent"
            app:layout_scrollFlags="scroll|exitUntilCollapsed"
            app:title="CollapsingToolbarLayout">
            <ImageView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:fitsSystemWindows="true"
                app:layout_collapseMode="parallax"
                app:layout_collapseParallaxMultiplier="0.5"
                android:scaleType="centerCrop"
                android:src="@drawable/toolbar"/>
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                app:layout_collapseMode="pin"
                android:text="pin:固定不動"/>
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="bottom|right"
                android:text="pin:固定不動"/>
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center_vertical"
                app:layout_collapseMode="parallax"
                android:text="parallax:\n視差滾動默認(rèn)0.5"/>
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                app:layout_collapseParallaxMultiplier="0.25"
                app:layout_collapseMode="parallax"
                android:text="parallax:\n視差滾動0.25"/>
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center_vertical|right"
                app:layout_collapseParallaxMultiplier="0.75"
                app:layout_collapseMode="parallax"
                android:text="parallax:\n視差滾動0.75"/>
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="bottom"
                app:layout_collapseMode="none"
                android:text="none:跟隨滾動"/>
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="top|right"
                android:text="不設(shè)置:跟隨滾動"/>
            <android.support.v7.widget.Toolbar
                android:id="@+id/toolbar"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                app:navigationIcon="?homeAsUpIndicator"
                app:layout_collapseMode="pin"
                app:title="Toolbar">
                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="真正的Toolbar區(qū)域"/>
            </android.support.v7.widget.Toolbar>
        </android.support.design.widget.CollapsingToolbarLayout>
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="AppBarLayout底部固定布局"
            android:padding="16dp"/>
    </android.support.design.widget.AppBarLayout>

    <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="match_parent"
            android:layout_height="match_parent"
            android:text="@string/ipsum"/>
    </android.support.v4.widget.NestedScrollView>

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

注意

• 最頂層的布局必須是CoordinatorLayout。
• CoordinatorLayout的直接子View必須是一個可滑動的控件俘陷，并且內(nèi)部有內(nèi)容可以滑動罗捎。同時需要設(shè)置app:layout_behavior。
• Toolbar的高度必須固定拉盾，不能設(shè)置為"wrap_content"宛逗，否則Toolbar不會滑動，也沒有折疊效果盾剩。
• 需要注意的是這里幾次設(shè)置android:fitsSystemWindows="true"，分別在CoordinatorLayout替蔬、AppBarLayout告私、ImageView。這樣之后達(dá)到的效果就是這張圖片的內(nèi)容可以延伸到狀態(tài)欄承桥。