簡介
是屬於Material Design的一個特色控制元件，可以實現Toolbar摺疊效果。CollapsingToolbarLayout繼承FrameLayout，是一種幀佈局。
所以CollapsingToolbarLayout實現Toolbar的摺疊上具有絕對的優勢，實現起來簡單。
實戰
看我們的Activity基本上不需要設定滑動的監聽等等，直接在Activity的佈局使用CollapsingToolbarLayout即可實現Toolbar的摺疊效果。
public class CollapsingToolbarActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_collapsing_toolbar);
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
}
}
複製程式碼接下來主要看activity_collapsing_toolbar.xml的佈局
<?xml version="1.0" encoding="utf-8"?>
<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"
tools:context="com.main.collapsingtoolbar.CollapsingToolbarActivity">
<android.support.v4.widget.NestedScrollView
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:gravity="center_horizontal"
android:orientation="vertical">
<android.support.v7.widget.CardView
android:layout_width="300dp"
android:layout_height="200dp"
android:layout_margin="0dp"
app:cardCornerRadius="20dp"
app:cardElevation="10dp"
app:contentPadding="5dp">
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:scaleType="centerCrop"
android:src="@drawable/cc"/>
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView
android:layout_width="300dp"
android:layout_height="200dp"
android:layout_margin="0dp"
app:cardCornerRadius="20dp"
app:cardElevation="10dp"
app:contentPadding="5dp">
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:scaleType="centerCrop"
android:src="@drawable/cc"/>
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView
android:layout_width="300dp"
android:layout_height="200dp"
android:layout_margin="0dp"
app:cardCornerRadius="20dp"
app:cardElevation="10dp"
app:contentPadding="5dp">
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:scaleType="centerCrop"
android:src="@drawable/cc"/>
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView
android:layout_width="300dp"
android:layout_height="200dp"
android:layout_margin="0dp"
app:cardCornerRadius="20dp"
app:cardElevation="10dp"
app:contentPadding="5dp">
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:scaleType="centerCrop"
android:src="@drawable/cc"/>
</android.support.v7.widget.CardView>
</LinearLayout>
</android.support.v4.widget.NestedScrollView>
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="260dp">
<android.support.design.widget.CollapsingToolbarLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:minHeight="200dp"
app:collapsedTitleGravity="center"
app:contentScrim="@color/colorPrimary"
app:expandedTitleGravity="left"
app:expandedTitleMarginTop="200dp"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
app:statusBarScrim="@color/colorPrimary"
app:title="標題"
>
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="centerCrop"
android:src="@drawable/bb"
app:layout_collapseMode="parallax"
app:layout_collapseParallaxMultiplier="1"
/>
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#00ffffff"
app:layout_collapseMode="pin"/>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.design.widget.FloatingActionButton
android:id="@+id/fab"
android:layout_width="58dp"
android:layout_height="58dp"
android:layout_gravity="bottom|end"
android:layout_margin="16dp"
app:layout_behavior="com.main.behavior.FabBehavior"/>
</android.support.design.widget.CoordinatorLayout>
複製程式碼NestedScrollView可以跟ScrollView一樣，實現View的滑動。AppBarLayout是一種支援響應滾動手勢的Toolbar佈局。
在CollapsingToolbarLayout作為佈局，而Toolbar作為子佈局，想實現摺疊效果，就必須在子View設定app:layout_collapseMode屬性。其屬性值可以選擇：off、pin、parallax。
off：預設屬性，佈局將正常顯示，沒有摺疊的行為。 pin：CollapsingToolbarLayout摺疊後，此佈局將固定在頂部。 parallax：CollapsingToolbarLayout摺疊時，此佈局也會有視差摺疊效果，可以和app:layout_collapseParallaxMultiplier匹配使用，設定視差滾動因子，值為：0~1。
注意： 1、AppBarLayout設定固定高度，並且要實現摺疊效果必須比toolbar的高度要高。 2、CollapsingToolbarLayout最好設定成match_parent
效果圖
