首發于我的博客,轉載請注明作者和原文鏈接。
AppBarLayout其實就是一個垂直方向的LinearLayout,可以實現Material Design中標題欄的滾動效果。
AppBarLayout的子View通過app:layout_scrollFlags屬性或LayoutParams.setScrollFlags()方法來聲明自身“滾動行為”。
AppBarLayout只有作為CoordinatorLayout的直接子View時,并同時在CoordinatorLayout中添加一個可滾動的scrolling view(如:NestedScrollView、RecyclerView...)才能響應滾動行為。
說一點,普通的ScrollView也是可以的滾動的,卻不能響應AppbarLayout的滾動行為。其中關鍵在于CoordiantorLayout和Behavior,可以看我之前的文章【CoordinatorLayout與Behavior的一己之見】,里面大致介紹了其中的原理,可以讓你初窺門徑。
XML布局
<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:id="@+id/app_bar_layout"
android:theme="@style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:layout_scrollFlags="scroll">
</android.support.v7.widget.Toolbar>
<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>
ScrollFlags
必須作為AppBarLayout的子View才能生效,通過app:layout_scrollFlags屬性或LayoutParams.setScrollFlags()設置:
scroll
所有想獲得滾動行為的view都需要設置。
enterAlways
從滾動開始,該view就會跟著向下滾動。
enterAlwaysCollapsed
單獨設置時,效果就是在scrolling view滾動到頂部后,才會下滾動。
跟只設置scroll
的效果是一樣的。
app:layout_scrollFlags="scroll|enterAlwaysCollapsed">
但是如果設置了Toolbar的height和minHeight,并設置layout_scrollFlags為"scroll|enterAlways|enterAlwaysCollapsed"。
效果就是,在向下滾動時,會首先滾動到最小高度,知道scrolling view滾動到頂部后,才擴展到原始高度。
android:layout_height="150dp"
android:minHeight="?attr/actionBarSize"
app:layout_scrollFlags="scroll|enterAlwaysCollapsed|enterAlways"
exitUntilCollapsed
向上滾動時,會折疊到其最小高度。向下滾動時,在scrolling view滾動到頂部后,才會向下滾動,擴展到原先的高度。
我們將Toolbar的height設置為150dp,并設置其minHeight。
android:layout_height="150dp"
android:minHeight="?attr/actionBarSize"
snap
在滾動的過程中,一次滾動的距離不一定足夠Toolbar完全地隱藏或顯示。
設置snap之后,就會給view添加一個彈性滾動的效果,會自動地根據滾動的距離,完成完整的隱藏、折疊或者顯示的效果。