CoordinatorLayout自定义Bahavior特效及其源码分析
@[CoordinatorLayout, Bahavior]java
CoordinatorLayout是android support design包中能够算是最重要的一个东西，运用它能够作出一些不错的特效，而其中的难点就是Bahavior的使用android
- 拖动效果实例
- CoordinatorLayout和Bahavior解析
- 关于NestScrolling机制
拖动效果实例
上述效果图中上部是一个LinearLayout中含有的一个EditText从而作成的一个简单的搜索框，而下部是一个ListView。咱们想当ListView往上拉动（查看更多）的时候隐藏搜索框，而向下拉动（往回看）的时候展示搜索框。segmentfault
首先看下布局数组
<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:orientation="vertical">
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<com.qianmi.adminapp.lib.utils.widget.BaseSwipeRefreshLayout
android:id="@+id/swipeRefreshLayout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ListView
android:id="@+id/listview"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:dividerHeight="1px"
android:scrollbars="vertical"
tools:listitem="@layout/item_member_list"
/>
<TextView
android:id="@+id/empty"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:textColor="#444"
android:textSize="12sp"
android:visibility="gone"
/>
</com.qianmi.adminapp.lib.utils.widget.BaseSwipeRefreshLayout>
</FrameLayout>
<LinearLayout
android:id="@+id/search_pane"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
app:layout_behavior="com.xxx.common.behavior.SearchScrollBehavior"
>
<View
android:id="@+id/tab_margin"
android:layout_width="match_parent"
android:layout_height="@dimen/fit_status_bar_height"
android:background="@color/toolbar_background_color"
android:orientation="vertical"
/>
<LinearLayout
android:id="@+id/search_bg"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/toolbar_background_color"
android:gravity="center"
android:paddingBottom="10dp"
android:paddingLeft="@dimen/content_margin"
android:paddingRight="@dimen/content_margin"
android:paddingTop="10dp">
<EditText
android:id="@+id/et_search"
style="@style/search_edit_view_style"
android:layout_width="0dp"
android:layout_weight="1"
android:clickable="true"
android:gravity="left|center_vertical"
android:hint="@string/member_list_search_hint"
android:imeOptions="actionSearch"
android:inputType="textPersonName"/>
</LinearLayout>
</LinearLayout>
</android.support.design.widget.CoordinatorLayout>
涉及到本例子的图片、文字等资源的地方不须要关注，咱们主要关注这几个地方：app
- 首先根布局是一个 CoordinatorLayout
- 其次id为search_pane的这个LinearLayout总体就是咱们的搜索框，也就是最终须要根据滑动而显示/隐藏的部分
- 这个搜索框（R.id.search_pane）他必须是直接为CoordinatorLayout的一级child view，从而才能实现上述效果
- 在这个搜索框中添加了一个属性app:layout_behavior="com.xxx.common.behavior.SearchScrollBehavior"，SearchScrollBehavior实际是一个咱们自定义的Behavior，而这里须要指定它的彻底限定名（后面将会详细说明该如何写这个自定义Behavior）
java代码部分基本上和传统的listview的实现没有任何区别，这里就再也不贴出代码。而惟独须要注意的一点是必需要子啊设置完毕ListView后添加这句代码：ide
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
listview.setNestedScrollingEnabled(true);
}
后面将会说明加上这句话的缘由。固然若是你用的是RecyclerView而不是ListView，那么就不用添加这句代码。布局
CoordinatorLayout和Bahavior解析
刚解除CoordinatorLayout是从Google的官方的demo里，demo使用了CoordinatorLayout做为布局根节点，同时使用了appbar、tablayout、fab等控件，作出了一个联动效果的demo，非常漂亮。可是刚开始对于其深层次的用法，历来没有深究。
翻开CoordinatorLayout的源码，发现它其实就是一个ViewGroup，确切来讲能够看作为一个FrameLayout。
使用CoordinatorLayout主要出于两种目的：动画
- 用于应用界面的根布局
- 做为一个容器用来协调子View之间的交互
说到CoordinatorLayout就不得不说Behavior这个类，他实际上是CoordinatorLayout的一个内部抽象类ui
public static abstract class Behavior<V extends View> {
public boolean onStartNestedScroll(CoordinatorLayout coordinatorLayout,
V child, View directTargetChild, View target, int nestedScrollAxes) {
return false;
}
public void onNestedPreScroll(CoordinatorLayout coordinatorLayout, V child, View target,
int dx, int dy, int[] consumed) {
// Do nothing
}
public boolean onDependentViewChanged(CoordinatorLayout parent, V child, View dependency) {
return false;
}
public void onDependentViewRemoved(CoordinatorLayout parent, V child, View dependency) {
}
}
上面代码中列出了咱们在自定义Behavior时须要复写的几个方法（大部分状况），根据须要，通常分为两类：this
- 某个view监听另外一个view的状态变化，例如大小、位置、显示状态等
- 某个view监听CoordinatorLayout里的滑动状态
对于第一种状况，一个例子就是当现实SnackBar的时候，Fab一样的随着Snackbar向上弹出而向上平移。这里再也不举例。
对于第二种i状况，咱们须要复写前两个方法，泛型V实际制定的是使用该Behavior的View，本例咱们在search_pane这个LinearLayout中经过app:layout_behavior将该自定义Behavior加了进来，实际上这个V就是该搜索框。而onStartNestedScroll和onNestedPreScroll中的child即该搜索框。
onStartNestedScroll通常用于滑动开始以前调用，通常用来计算一些child的尺寸，同时指定咱们的Behavior感兴趣的滑动方向；onNestedPreScroll用来实时的监听滑动状态，根据状态从而对child作出特定的响应。对于咱们的例子来讲，若是ListView往上拉动（查看更多）的时候隐藏搜索框，而向下拉动（往回看）的时候展示搜索框。
本例的SearchScrollBehavior代码为：
public class SearchScrollBehavior extends CoordinatorLayout.Behavior<View> {
private int searchPaneHeight = 0;//搜索框的高度
private boolean isAnimate;//动画是否在进行
private Context ctx;
public SearchScrollBehavior(Context context, AttributeSet attrs) {
super(context, attrs);
ctx = context;
}
@Override
public boolean onStartNestedScroll(CoordinatorLayout coordinatorLayout, View child, View directTargetChild, View target, int nestedScrollAxes) {
if (child.getVisibility() == View.VISIBLE && searchPaneHeight == 0) {
//获取控件高度
searchPaneHeight = DensityUtils.dp2px(ctx, child.getHeight());
}
return (nestedScrollAxes & ViewCompat.SCROLL_AXIS_VERTICAL) != 0;//判断是否竖直滚动
}
@Override
public void onNestedPreScroll(CoordinatorLayout coordinatorLayout, View child, View target, int dx, int dy, int[] consumed) {
//dy大于0是向上滚动 小于0是向下滚动
if (dy >= 0 && !isAnimate && child.getVisibility() == View.VISIBLE) {
showSearch(child, false);
} else if (dy < 0 && !isAnimate && child.getVisibility() == View.GONE) {
showSearch(child, true);
}
}
private void showSearch(final View searchPane, boolean visible) {
if (searchPane == null) {
return;
}
float translationY = searchPane.getTranslationY();
if (!visible) {
//show -> hide
if (translationY < 0 || isAnimate) {
return;
}
L.d("hide, searchPaneHeight" + searchPaneHeight);
ViewPropertyAnimator animator = searchPane.animate()
.translationY(-searchPaneHeight)
.setDuration(800)
.setInterpolator(new DecelerateInterpolator())
.setListener(new Animator.AnimatorListener() {
@Override
public void onAnimationStart(Animator animation) {
isAnimate = true;
}
@Override
public void onAnimationEnd(Animator animation) {
searchPane.setVisibility(View.GONE);
isAnimate = false;
}
@Override
public void onAnimationCancel(Animator animation) {
showSearch(searchPane, true);
}
@Override
public void onAnimationRepeat(Animator animation) {
}
});
animator.start();
} else {
//hide -> show
if (translationY >= 0 || isAnimate) {
return;
}
L.d("show, searchPaneHeight" + searchPaneHeight);
ViewPropertyAnimator animator = searchPane.animate()
.translationY(0)
.setDuration(500)
.setInterpolator(new DecelerateInterpolator())
.setListener(new Animator.AnimatorListener() {
@Override
public void onAnimationStart(Animator animation) {
searchPane.setVisibility(View.VISIBLE);
isAnimate = true;
}
@Override
public void onAnimationEnd(Animator animation) {
isAnimate = false;
}
@Override
public void onAnimationCancel(Animator animation) {
showSearch(searchPane, false);
}
@Override
public void onAnimationRepeat(Animator animation) {
}
});
animator.start();
}
}
}
这样子，咱们把自定义的Behavior写到搜素框的xml布局中进行指定一下，不需额外的代码，就实现了本文开头的效果。
关于NestScrolling机制
那么CoordinatorLayout是如何实现经过Behavior来控制子View的状态的呢？这里必需要说到NestedScrolling机制。
在support-v4包中有这两个接口：
- NestedScrollingParent
- NestedScrollingChild
CoordinatorLayout实现了NestedScrollingParent这个接口，而RecylerView实现了NestedScrollingChild这个接口
public class CoordinatorLayout extends ViewGroup implements NestedScrollingParent {
}
public class RecyclerView extends ViewGroup implements ScrollingView, NestedScrollingChild {
}
咱们知道View的事件传递是从子到父的，咱们看下实现了NestedScrollingChild接口的RecyclerView 的onTouchEvent是怎么写的，在onTouchEvent的ACTION_MOVE分支，调用了他本身的dispatchNestedPreScroll方法（这个是NestedScrollingChild接口的一个方法，被RecyclerView 实现了）
case MotionEvent.ACTION_MOVE: {
...
if (dispatchNestedPreScroll(dx, dy, mScrollConsumed, mScrollOffset)) {
...
}
...
@Override
public boolean dispatchNestedPreScroll(int dx, int dy, int[] consumed, int[] offsetInWindow) {
return getScrollingChildHelper().dispatchNestedPreScroll(dx, dy, consumed, offsetInWindow);
}
dispatchNestedPreScroll的实现中实际是调用NestedScrollingChildHelper的dispatchNestedPreScroll方法，看下NestedScrollingChildHelper的该方法的实现：
public boolean dispatchNestedPreScroll(int dx, int dy, int[] consumed, int[] offsetInWindow) {
if (isNestedScrollingEnabled() && mNestedScrollingParent != null) {
if (dx != 0 || dy != 0) {
int startX = 0;
int startY = 0;
if (offsetInWindow != null) {
mView.getLocationInWindow(offsetInWindow);
startX = offsetInWindow[0];
startY = offsetInWindow[1];
}
if (consumed == null) {
if (mTempNestedScrollConsumed == null) {
mTempNestedScrollConsumed = new int[2];
}
consumed = mTempNestedScrollConsumed;
}
consumed[0] = 0;
consumed[1] = 0;
ViewParentCompat.onNestedPreScroll(mNestedScrollingParent, mView, dx, dy, consumed);
if (offsetInWindow != null) {
mView.getLocationInWindow(offsetInWindow);
offsetInWindow[0] -= startX;
offsetInWindow[1] -= startY;
}
return consumed[0] != 0 || consumed[1] != 0;
} else if (offsetInWindow != null) {
offsetInWindow[0] = 0;
offsetInWindow[1] = 0;
}
}
return false;
}
当发现该子view的isNestedScrollingEnabled被设置的话（RecylerView是开启的，而继承自AbsListview的ListView是关闭的，因此若是使用Behavior的控件是ListView的话，必需要setNestedScrollingEnabled（true）），就调用ViewParentCompat.onNestedPreScroll方法，将滑动的位置传递过去。
而ViewParentCompat就是包含了这个子View（RecyclerView）的父亲布局，因此很显然就是CoordinatorLayout这个ViewGroup了（这里也就说明了第一节所说的使用Behavior的控件必须是直接从属于CoordinatorLayout的缘由），而onNestedPreScroll这个方法就是NestedScrollingParent接口的，CoordinatorLayout偏偏实现了这个方法。
那么如今有点眉目了，事件是这样子传递的，当咱们滑动RecyclerView的时候，事件会经过NestScrolling机制传给CoordinatorLayout，这是第一步。那么CoordinatorLayout怎么经过Behavior将事件继续传递给它的子View呢。确定就要看下CoordinatorLayout的onNestedPreScroll中写了什么：
public void onNestedPreScroll(View target, int dx, int dy, int[] consumed) {
int xConsumed = 0;
int yConsumed = 0;
boolean accepted = false;
final int childCount = getChildCount();
for (int i = 0; i < childCount; i++) {
final View view = getChildAt(i);
final LayoutParams lp = (LayoutParams) view.getLayoutParams();
if (!lp.isNestedScrollAccepted()) {
continue;
}
final Behavior viewBehavior = lp.getBehavior();
if (viewBehavior != null) {
mTempIntPair[0] = mTempIntPair[1] = 0;
viewBehavior.onNestedPreScroll(this, view, target, dx, dy, mTempIntPair);
xConsumed = dx > 0 ? Math.max(xConsumed, mTempIntPair[0])
: Math.min(xConsumed, mTempIntPair[0]);
yConsumed = dy > 0 ? Math.max(yConsumed, mTempIntPair[1])
: Math.min(yConsumed, mTempIntPair[1]);
accepted = true;
}
}
consumed[0] = xConsumed;
consumed[1] = yConsumed;
if (accepted) {
dispatchOnDependentViewChanged(true);
}
}
CoordinatorLayout是找出了全部的child view，经过getBehavior一个个的得到child view的Behavior而后直接执行Behavior的onNestedPreScroll方法，将dx/dy等数据以及这个child view自己传递进去。到了这里，咱们也就执行到了咱们自定义的SearchScrollBehavior的onNestedPreScroll方法里面去了。从而拿到了dx和dy。dy大于0是向上滚动 小于0是向下滚动，随后对本身（child view）进行响应。
这里要提一下int[] consumed这个数据，它是一个int型的数组，长度为2，第一个元素是父view消费的x方向的滚动距离；第二个元素是父view消费的y方向的滚动距离，若是这两个值不为0，则子view须要对滚动的量进行一些修正。正由于有了这个参数，使得咱们处理滚动事件的时候，思路更加清晰，不会像之前同样被一堆的滚动参数搞混。
说到这里，好像一直没讲NestScrolling机制，能够参考下这篇博客，有一个很详细的讲解
https://segmentfault.com/a/1190000002873657
能够说CoordinatorLayout的Behavior机制彻底离不开NestScrolling！
- 1. Elasticsearch自定义字典及自定义字典无效分析
- 2. RecyclerView 源码分析(七) - 自定义LayoutManager及其相关组件的源码分析
- 3. Android 自定义View EdgeEffect效果 ----ScrollView部分源代码剖析
- 4. 源码分析Dialog自定义大小无效坑
- 5. CoordinatorLayout详解及自定义Behavior
- 6. CoordinatorLayout的详解以及自定义Behavior
- 7. LinkedHashMap及其源码分析
- 8. 自定义视差特效
- 9. client-go客户端自定义开发Kubernetes及源码分析
- 10. CoordinatorLayout 使用及源码解析
- 更多相关文章...
- • 自定义TypeHandler - MyBatis教程
- • MySQL自定义函数（CREATE FUNCTION） - MySQL教程
- • RxJava操作符（十）自定义操作符
- • 互联网组织的未来：剖析GitHub员工的任性之源
-
每一个你不满意的现在，都有一个你没有努力的曾经。
- 1. 「插件」Runner更新Pro版，帮助设计师远离996
- 2. 错误 707 Could not load file or assembly ‘Newtonsoft.Json, Version=12.0.0.0, Culture=neutral, PublicKe
- 3. Jenkins 2018 报告速览，Kubernetes使用率跃升235%！
- 4. TVI-Android技术篇之注解Annotation
- 5. android studio启动项目
- 6. Android的ADIL
- 7. Android卡顿的检测及优化方法汇总（线下+线上）
- 8. 登录注册的业务逻辑流程梳理
- 9. NDK(1)创建自己的C/C++文件
- 10. 小菜的系统框架界面设计-你的评估是我的决策
- 1. Elasticsearch自定义字典及自定义字典无效分析
- 2. RecyclerView 源码分析(七) - 自定义LayoutManager及其相关组件的源码分析
- 3. Android 自定义View EdgeEffect效果 ----ScrollView部分源代码剖析
- 4. 源码分析Dialog自定义大小无效坑
- 5. CoordinatorLayout详解及自定义Behavior
- 6. CoordinatorLayout的详解以及自定义Behavior
- 7. LinkedHashMap及其源码分析
- 8. 自定义视差特效
- 9. client-go客户端自定义开发Kubernetes及源码分析
- 10. CoordinatorLayout 使用及源码解析