1 CoordinatorLayout
CoordinatorLayout最常用的场景就是实现View之间的联动效果,例如标题栏的扩展、吸顶等效果,都可以通过CoordinatorLayout来实现,但是其中涉及到的技术点也比较多
2 CoordinatorLayout和AppBarLayout
通过CoordinatorLayout和AppBarLayout,可以实现简单的列表与标题栏之间的联动效果,那么我不使用AppBarLayout,直接只用ToolBar可以吗?
答案是不可以的,因为想要标题栏做一滑动的效果,需要借助一个属性app:layout_scrollFlags,通过设置这个属性,才可以实现一些滑动的效果
<androidx.coordinatorlayout.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto"
tools:context=".fragment.MineFragment">
<com.google.android.material.appbar.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<androidx.appcompat.widget.Toolbar
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:title="我的"
app:subtitle="次级标题"
app:layout_scrollFlags="scroll"/>
</com.google.android.material.appbar.AppBarLayout>
<androidx.core.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="com.google.android.material.appbar.AppBarLayout$ScrollingViewBehavior">
<androidx.recyclerview.widget.RecyclerView
android:id="@+id/rv_mine"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</androidx.core.widget.NestedScrollView>
</androidx.coordinatorlayout.widget.CoordinatorLayout>
2.1 layout_scrollFlags
需要注意的是,scroll可以单独使用,但是其他的属性必须要配置scroll使用才可以,使用 | 分割
类型 | 效果 |
---|
scroll | 标题栏作为列表的头部,可随列表滑出屏幕,等到列表往回滑到顶部后,AppBarLayout才出现 | enterAlways | 上滑作为头部滑出屏幕,下滑时,先完全展示AppBarLayout,再滑动列表 | enterAlwaysCollapsed | 跟enterAlways基本一致,只是下滑时,会先展示AppBarLayout的最小高度,等到列表完全展示之后,才显示全部的AppBarLayout | exitUntilCollapsed | AppBarLayout不会完全消失,会保留最小高度 |
2.2 layout_behavior
只有通过设置layout_behavior才可以实现AppBarLayout和列表的滑动,但是列表需要通过NestedScrollView包裹一下,因为com.google.android.material.appbar.AppBarLayout$ScrollingViewBehavior只是针对AppBarLayout和NestedScrollView的联动效果
3 CollapsingToolbarLayout
CollapsingToolbarLayout是可折叠的布局,折叠的内容就是AppBarLayout内包裹的内容,可以给AppBarLayout设置特定的高度
<androidx.coordinatorlayout.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto"
tools:context=".fragment.MineFragment">
<com.google.android.material.appbar.AppBarLayout
android:layout_width="match_parent"
android:layout_height="150dp">
<com.google.android.material.appbar.CollapsingToolbarLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<!--CollapsingToolbarLayout内部包裹的全部组件的高度,就是AppBarLayout的高度-->
<ImageView
android:layout_width="100dp"
android:layout_height="80dp"
android:src="@drawable/player"/>
<androidx.appcompat.widget.Toolbar
android:layout_width="match_parent"
android:layout_height="50dp"
app:layout_collapseMode="pin"
app:title="我的" />
</com.google.android.material.appbar.CollapsingToolbarLayout>
</com.google.android.material.appbar.AppBarLayout>
<!-- TODO: Update blank fragment layout -->
<androidx.core.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="com.google.android.material.appbar.AppBarLayout$ScrollingViewBehavior">
<androidx.recyclerview.widget.RecyclerView
android:id="@+id/rv_mine"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</androidx.core.widget.NestedScrollView>
</androidx.coordinatorlayout.widget.CoordinatorLayout>
CollapsingToolbarLayout需要设置layout_scrollFlags,实现想要的效果;
如果设置ToolBar的layout_collapseMode为”pin“,那么就可以实现ToolBar吸顶的效果
4 自定义Behavior
后续会讲
|