什么是Behavior
Behavior名为行为控制,当我们需要在CoordinatorLayout中我们要实现与子视图中复杂的手势交互时,这个时候我们可能需要自定义Behavior行为控制,在自定义的Behavior我们可以通过对应的回调去处理相应的业务逻辑
实例演示以及说明
示例一:标题栏抽屉效果
话不多说,简单的实现一个如下UI效果,看看我们应该如何自定义Behavior
如图我们要实现这样的一个效果,应该怎么处理了,在没有使用CoordinatorLayout前,我们可以通过监听组件的滑动事件来动态的移动顶部的View,这是没有问题的,但是我们有了CoordinatorLayout之后,能更加简单的处理这个效果,因为CoordinatorLayout本身就是协调子视图的各种行为控制,实现这个效果我们只需要自定义一个Behavior即可
public class CaseTwoBehavior extends CoordinatorLayout.Behavior<View> {
private float deltaY;
public CaseTwoBehavior() {
}
public CaseTwoBehavior(Context context, AttributeSet attrs) {
super(context, attrs);
}
@Override
public boolean layoutDependsOn(CoordinatorLayout parent, View child, View dependency) {
return dependency instanceof NestedScrollView;
}
@Override
public boolean onDependentViewChanged(@NonNull CoordinatorLayout parent, @NonNull View child, @NonNull View dependency) {
if(deltaY == 0){
deltaY = dependency.getY();
}
float dy = dependency.getY() - deltaY;
float y =dy==0?-child.getHeight():(dy>=-child.getHeight()?(-child.getHeight()-dy):0 );
child.setTranslationY(y);
return true;
}
}
看到这里惊不惊喜,是的,就是这么几句简单的代码就可以实现上面动画显示的行为控制
在这里解释一下两个方法
layoutDependsOn(CoordinatorLayout parent, View child, View dependency)
确定Behavior需要依赖的组件,这里的child视图指的指的是需要监听dependency视图的那些个组件,dependency组件表示当前设置Behavior的视图需要依赖的组件,上面示例中我们判断依赖组件是否是NestedScrollView,如果是则返回true,onDependentViewChanged方法才会有回调,如果返回false则不会回调
onDependentViewChanged(@NonNull CoordinatorLayout parent, @NonNull View child, @NonNull View dependency)
从方法名上我看可以看出这表示依赖组件滑动时回调的方法,这里的child表示设置Behavior的视图组件也就是我们的TextView,在这里我们可以处理我们自己的业务逻辑,上面的示例中依赖的组件是NestedScrollView,根据NestedScrollView滑动的坐标从而设置TextView的滑动距离
布局文件代码如下
<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.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">
<com.google.android.material.appbar.AppBarLayout
android:id="@+id/appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<com.google.android.material.appbar.CollapsingToolbarLayout
android:id="@+id/collsping_Toolbar"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/blue"
app:contentScrim="@color/green"
app:title="测试"
app:layout_scrollFlags="scroll|enterAlwaysCollapsed">
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:scaleType="centerCrop"
app:layout_collapseMode="parallax"
app:srcCompat="@mipmap/ghsy" />
</com.google.android.material.appbar.CollapsingToolbarLayout>
<!-- <TextView-->
<!-- android:layout_width="match_parent"-->
<!-- android:layout_height="100dp"-->
<!-- android:background="@color/gray"-->
<!-- android:gravity="center"-->
<!-- android:text="滑动隐藏区域"-->
<!-- android:textColor="@android:color/white"-->
<!-- android:textSize="30sp" />-->
<!-- <TextView-->
<!-- android:layout_width="match_parent"-->
<!-- android:layout_height="50dp"-->
<!-- android:background="@color/green"-->
<!-- android:gravity="center"-->
<!-- android:text="滑动固定区域"-->
<!-- android:textColor="@android:color/white"-->
<!-- android:textSize="20sp" />-->
</com.google.android.material.appbar.AppBarLayout>
<androidx.core.widget.NestedScrollView
android:id="@+id/rv_demo1_content"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true"
app:layout_behavior="@string/appbar_scrolling_view_behavior">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="30dp"
android:background="#fff"
android:text="我在测试\n
红红火火恍恍惚惚或或或或或或\n
或或或或或或或或或或或或或或或\n或或或或或或或或或或或或或或或或或或或或"
android:textSize="20sp" />
</androidx.core.widget.NestedScrollView>
<TextView
android:id="@+id/title"
android:layout_width="match_parent"
android:layout_height="50dp"
android:background="#ff0000"
android:gravity="center"
android:text="Hello World"
android:textColor="#ffffff"
android:textSize="18sp"
app:layout_behavior="@string/behavior_case_two" />
</androidx.coordinatorlayout.widget.CoordinatorLayout>
在string文件中制动behavior类的路径
<string name="behavior_case_two">com.sudio.demotest.behavior.CaseTwoBehavior</string>
示例二:标题栏透明度渐变效果
我们要实现的效果如下
这是一个滑动渐变标题栏透明度的示例,这里我们自定义一个Behavior
public class CaseThreeBehavior extends CoordinatorLayout.Behavior<TextView> {
public CaseThreeBehavior() {
}
public CaseThreeBehavior(Context context, AttributeSet attrs) {
super(context, attrs);
}
@Override
public boolean layoutDependsOn(CoordinatorLayout parent, TextView child, View dependency) {
return dependency instanceof AppBarLayout;
}
@Override
public boolean onDependentViewChanged(@NonNull CoordinatorLayout parent, @NonNull TextView child, @NonNull View dependency) {
float topValue = Math.abs(dependency.getTop());
topValue=topValue>=child.getHeight()?child.getHeight():topValue;
/*根据滑动间距与title的比例设置透明度*/
float alpha=topValue/child.getHeight();
child.setAlpha(alpha);
return true;
}
}
这里我们给顶部标题栏设置CaseThreeBehavior,依赖的视图组件为AppBarLayout,根据AppBarLayout的滑动距离结合标题栏TextView的视图高度,我们根据比例结算出需要设置的透明度值,从而达到TextView透明度渐变的效果
布局文件代码入下
<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.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">
<com.google.android.material.appbar.AppBarLayout
android:id="@+id/appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<com.google.android.material.appbar.CollapsingToolbarLayout
android:id="@+id/collsping_Toolbar"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:title="测试"
app:layout_scrollFlags="scroll|enterAlwaysCollapsed">
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:scaleType="centerCrop"
app:layout_collapseMode="parallax"
app:srcCompat="@mipmap/ghsy" />
</com.google.android.material.appbar.CollapsingToolbarLayout>
</com.google.android.material.appbar.AppBarLayout>
<androidx.core.widget.NestedScrollView
android:id="@+id/rv_demo1_content"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_behavior="@string/appbar_scrolling_view_behavior">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="20dp"
android:background="#fff"
android:text="@string/geci"
android:textSize="20sp" />
</androidx.core.widget.NestedScrollView>
<TextView
android:layout_width="match_parent"
android:layout_height="50dp"
android:background="@color/green"
android:gravity="center"
android:text="标题栏"
android:textColor="@android:color/white"
android:textSize="20sp"
app:layout_behavior="@string/behavior_case_three"/>
</androidx.coordinatorlayout.widget.CoordinatorLayout>
在string文件中制动behavior类的路径
<string name="behavior_case_three">com.sudio.demotest.behavior.CaseThreeBehavior</string>
Behavior其他方法说明
onStartNestedScroll
当coordinatorLayout 的子View试图开始嵌套滑动的时候被调用。当返回值为true的时候表明coordinatorLayout 充当nested scroll parent 处理这次滑动,需要注意的是只有当返回值为true的时候,Behavior 才能收到后面的一些nested scroll 事件回调(如:onNestedPreScroll、onNestedScroll等)这个方法有个重要的参数nestedScrollAxes,表明处理的滑动的方向。
onNestedPreScroll
嵌套滚动发生之前被调用在nested scroll child 消费掉自己的滚动距离之前,嵌套滚动每次被nested scroll child 更新都会调用onNestedPreScroll。注意有个重要的参数consumed,可以修改这个数组表示你消费了多少距离。假设用户滑动了100px,child 做了90px 的位移,你需要把 consumed[1]的值改成90,这样coordinatorLayout就能知道只处理剩下的10px的滚动。
onNestedScroll
进行嵌套滚动时被调用
onStopNestedScrol
嵌套滚动结束时被调用,这是一个清除滚动状态等的好时机
onNestedScrollAccepted
onStartNestedScroll返回true才会触发这个方法,接受滚动处理后回调,可以在这个方法里做一些准备工作,如一些状态的重置等。
onNestedPreFling
用户松开手指并且会发生惯性动作之前调用,参数提供了速度信息,可以根据这些速度信息决定最终状态,比如滚动Header,是让Header处于展开状态还是折叠状态。返回true 表示消费了fling.