您当前位置：首页 > php开源 > 综合技术 > 5CoordinatorLayout与AppBarLayout--嵌套滑动

5CoordinatorLayout与AppBarLayout--嵌套滑动

来源：程序员人生发布时间：2016-09-29 08:27:55 阅读次数：3211次

5CoordinatorLayout与AppBarLayout–嵌套滑动

上文我们说了AppBarLayout的简单滑动，本篇主要介绍CoordinatorLayout下的嵌套滑动相干知识，本文对此做介绍

例子

依照惯例，先看效果，再谈原理。可以看到在向上滑动的时候，先滑动AppBarLayout，AppBarLayout完全消失以后，在滑动NestedScrollView。而在向下滑动的时候，仍然是先滑动AppBarLayout，等AppBarLayout完全滑下来以后，再滑动NestedScrollView。

代码非常简单,以下所示，关键代码就2句，toolbar内的app:layout_scrollFlags=”scroll|enterAlways”和NestedScrollView内的 app:layout_behavior=”@string/appbar_scrolling_view_behavior”

<?xml version="1.0" encoding="utf⑻"?>
<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="com.fish.behaviordemo.MainActivity">

    <android.support.design.widget.AppBarLayout
        android:layout_width="match_parent"
        android:theme="@style/AppTheme.AppBarOverlay"
        android:layout_height="wrap_content">

        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            app:popupTheme="@style/AppTheme.PopupOverlay"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            android:background="?attr/colorPrimary"
            app:layout_scrollFlags="scroll|enterAlways" />
            <!--app:layout_scrollFlags="scroll" />-->


    </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">

        <LinearLayout
            android:id="@+id/linear"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical">

        </LinearLayout>
    </android.support.v4.widget.NestedScrollView>


    <android.support.design.widget.FloatingActionButton
        android:id="@+id/fab"

        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom|end"
        android:layout_margin="@dimen/fab_margin"
        android:src="@android:drawable/ic_dialog_email"
        app:layout_behavior="com.fish.behaviordemo.fab.MyBehavior" />

</android.support.design.widget.CoordinatorLayout>

解决方案

在分析原理前，我们可以先想一想，如果要自己实现该怎样实现？
这个例子要求是，Toolbar可滑时，滑动Toolbar，Toolbar滑完后，滑动NestedScrollView。滑动时Toolbar优先于NestedScrollView

简单想了下，最少有以下4种解决方案
1、最古老的实现方式就是，在Toolbar+ NestedScrollView的外层包1个NestedScrollView（简称p），重写p的onInterceptTouchEvent，如果p可滑动就拦截，若p不可滑动，就交给c处理，p的高度要设置为toolbar+content的高度。这个方式有个缺点，那就是在1次滑动进程中，如果p滑动了，那c不可能滑动，也就是说不可能在1次滑动进程中，既滑动了p也滑动了c，但是上面的例子是可以实现既滑动p又滑动c的
2、使用嵌套滑动，一样需要在Toolbar+ NestedScrollView的外层包1个NestedScrollView（简称p），在p的onNestedPreScroll里处理滑动事件，这个可以实现和例子1样的效果，其实该例子用的就是嵌套滑动的方法，只是更复杂1点
3、把NestedScrollView加1个header，恰好和Toolbar叠在1起，1开始上滑的时候，NestedScrollView其实已在滑动了，但是我们看不出来，由于在滑head，而toolbar监视NestedScrollView的滑动，然后滑动自己。这类实现方式，本质是NestedScrollView1直在滑，而toolbar监视到p滑动以后自己再滑动,其实此时是2个view同时在滑动
4、把NestedScrollView加1个padding，和Toolbar1样大，然后设置android:clipToPadding=”false”，再由toolbar监视NestedScrollView的滑动，然后滑动自己，这个方法是方法3的1个变种，此时也是2个view同时在滑动

原理分析

先大概讲1下原理，不然看代码会晕。

初始时NestedScrollView上滑会触发CoordinatorLayout的onNestedPreScroll，在这里把滑动分发给AppBarLayout，触发AppBarLayout的上移，和NestedScrollView 的上移，看起来好像是CoordinatorLayout在转动1样。

然后AppBarLayout由于上移逐步消失，那末AppBarLayout就没法消耗滑动事件，所以触发NestedScrollView自己的滑动
这里有坑，未独占，可能被拦截。
下滑的时候也1样，下滑触发CoordinatorLayout的onNestedPreScroll，分发给AppBarLayout，AppBarLayout如果可以滑，就由AppBarLayout消费掉，如果AppBarLayout不能滑，就NestedScrollView自己消费。

AppBarLayout的滑动，我们之前已说过了。

子view与behavior

view	behavior
AppBarLayout	AppBarLayout.Behavior
NestedScrollView	AppBarLayout.ScrollingViewBehavior
FloatingActionButton	MyBehavior

上滑源码分析

嵌套滑动初始化

我这里默许大家对嵌套滑动的知识有所了解，不了解的可以参考
我们先来找嵌套滑动的链表，

NestedScrollView-> CoordinatorLayout

CoordinatorLayout实现了NestedScrollingParent，所以是嵌套滑动链上的NestedScrollView父节点，会收到NestedScrollView滑动的各种事件。
手指在屏幕上滑动，会触发NestedScrollView的move事件。

再来看真正建立嵌套滑动链表的代码，NestedScrollView调用startNestedScroll，会调用CoordinatorLayout的onStartNestedScroll
onStartNestedScroll内的逻辑是遍历子view，如果子view的behavior的onStartNestedScroll返回true，那末调用acceptNestedScroll把mDidAcceptNestedScroll置为true。这里触及到了behavior的另外一个函数onStartNestedScroll，这个函数有甚么意义，CoordinatorLayout可以接收嵌套滑动事件并且交给他的子view去处理，onStartNestedScroll就代表了子view是不是愿意接收嵌套滑动事件。

   public boolean onStartNestedScroll(View child, View target, int nestedScrollAxes) {
        boolean handled = false;

        final int childCount = getChildCount();
        //遍历子节点
        for (int i = 0; i < childCount; i++) {
            final View view = getChildAt(i);
            final LayoutParams lp = (LayoutParams) view.getLayoutParams();
            final Behavior viewBehavior = lp.getBehavior();
            if (viewBehavior != null) {
                final boolean accepted = viewBehavior.onStartNestedScroll(this, view, child, target,
                        nestedScrollAxes);
                handled |= accepted;

                lp.acceptNestedScroll(accepted);
            } else {
                lp.acceptNestedScroll(false);
            }
        }
        return handled;
    }

     void acceptNestedScroll(boolean accept) {
            mDidAcceptNestedScroll = accept;
        }

而看看本文的3个子view的behavior，AppBarLayout.ScrollingViewBehavior和MyBehavior的onStartNestedScroll都是返回默许值false的，只有AppBarLayout.Behavior有可能返回true。看下边代码

     @Override
        public boolean onStartNestedScroll(CoordinatorLayout parent, AppBarLayout child,
                View directTargetChild, View target, int nestedScrollAxes) {
            // Return true if we're nested scrolling vertically, and we have scrollable children
            // and the scrolling view is big enough to scroll
            final boolean started = (nestedScrollAxes & ViewCompat.SCROLL_AXIS_VERTICAL) != 0
                    && child.hasScrollableChildren()
                    && parent.getHeight() - directTargetChild.getHeight() <= child.getHeight();
                ...
            return started;
        }

要想返回true，得满足3个条件，首先是纵向滑动，我们的NestedScrollView是纵向滑动的，满足。然后AppBarLayout有可滑动的子view，这里Toolbar内写有app:layout_scrollFlags=”scroll|..”,所以的确存在可滑动的子view，满足。
再看第3点CoordinatorLayout.getHeight() - NestedScrollView.getHeight() <= AppBarLayout.getHeight()

我们来看看这些高度分别是甚么
在这里我们曾详细分析过CoordinatorLayout的measure和layout进程，
假定屏幕高度为H，navigatorbar高度为N，toolbar高度为T，状态栏高度为S，那末CoordinatorLayout的高度为H-N，AppBarLayout高度为T，NestedScrollView的高度是H-S-N(插1句如果toolbar不可滚，那末NestedScrollView的高度为H-S-N-T,缘由可以参考HeaderScrollingViewBehavior#onMeasureChild),所以上边那个不等式就相当于T>=S，1般来讲toolbar高度肯定大于statubar高度，所以条件3满足。

3个条件满足，返回true，建立嵌套滑动链，AppBarLayout的LayoutParams的mDidAcceptNestedScroll置为true。

开始上滑

上滑1开始是NestedScrollView的 dispatchNestedPreScroll，会发给上层CoordinatorLayout的onNestedPreScroll 代码以下，然后CoordinatorLayout发给子view。只有lp.mDidAcceptNestedScroll为true的才有资历接收嵌套事件，这里就是发给AppBarLayout.Behavior的onNestedPreScroll。

    //CoordinatorLayout
  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();
            //同等于!lp.mDidAcceptNestedScroll
            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);
        }
    }

AppBarLayout.Behavior的onNestedPreScroll代码以下所示，上滑的时候走的是L13，获得min=-AppBarLayout.getUpNestedPreScrollRange()，getUpNestedPreScrollRange就是调用getTotalScrollRange，所以min是获得可滑动部份的高度的相反数（getTotalScrollRange的结果是toolbar的高度T）。
然后调用scroll进行滑动（其实就是调用offsetTopAndBottom），注意这里还有个返回值，返回的值就表示实际滑动了多少，由于有可能越界了，consumed[1]代表的是真正滑动的距离，会返回给NestedScrollView。如果没有完全消费掉这个move事件，那末NestedScrollView还会滑动。
再看传入scroll的min和max，这是范围束缚，min为-T，max为0.

        //AppBarLayout.Behavior
       @Override
        public void onNestedPreScroll(CoordinatorLayout coordinatorLayout, AppBarLayout child,
                View target, int dx, int dy, int[] consumed) {
            if (dy != 0 && !mSkipNestedPreScroll) {
                int min, max;
                if (dy < 0) {
                    // We're scrolling down
                    min = -child.getTotalScrollRange();
                    max = min + child.getDownNestedPreScrollRange();
                } else {
                    // We're scrolling up
                    min = -child.getUpNestedPreScrollRange();
                    max = 0;
                }
                consumed[1] = scroll(coordinatorLayout, child, dy, min, max);
            }
        }

   private int getUpNestedPreScrollRange() {
        return getTotalScrollRange();
    }

下滑源码分析

下滑的逻辑跟上滑类似，但有所不同。嵌套滑动初始化，建立嵌套滑动链表是1样的，重点看看下滑的代码。看下滑的代码，关注L7,L8.min为-T，getDownNestedPreScrollRange得到结果为T（why？），所以max为0。offset束缚范围是 [-T,0]

   @Override
        public void onNestedPreScroll(CoordinatorLayout coordinatorLayout, AppBarLayout child,
                View target, int dx, int dy, int[] consumed) {
            if (dy != 0 && !mSkipNestedPreScroll) {
                int min, max;
                if (dy < 0) {
                    // We're scrolling down
                    min = -child.getTotalScrollRange();
                    max = min + child.getDownNestedPreScrollRange();
                } else {
                    // We're scrolling up
                    min = -child.getUpNestedPreScrollRange();
                    max = 0;
                }
                consumed[1] = scroll(coordinatorLayout, child, dy, min, max);
            }
        }

再仔细看看getDownNestedPreScrollRange,为什么返回T呢？

  private int getDownNestedPreScrollRange() {
        if (mDownPreScrollRange != INVALID_SCROLL_RANGE) {
            // If we already have a valid value, return it
            return mDownPreScrollRange;
        }

        int range = 0;
        for (int i = getChildCount() - 1; i >= 0; i--) {
            final View child = getChildAt(i);
            final LayoutParams lp = (LayoutParams) child.getLayoutParams();
            final int childHeight = child.getMeasuredHeight();
            final int flags = lp.mScrollFlags;

            if ((flags & LayoutParams.FLAG_QUICK_RETURN) == LayoutParams.FLAG_QUICK_RETURN) {
                // First take the margin into account
                range += lp.topMargin + lp.bottomMargin;
                // The view has the quick return flag combination...
                if ((flags & LayoutParams.SCROLL_FLAG_ENTER_ALWAYS_COLLAPSED) != 0) {
                    // If they're set to enter collapsed, use the minimum height
                    range += ViewCompat.getMinimumHeight(child);
                } else if ((flags & LayoutParams.SCROLL_FLAG_EXIT_UNTIL_COLLAPSED) != 0) {
                    // Only enter by the amount of the collapsed height
                    range += childHeight - ViewCompat.getMinimumHeight(child);
                } else {
                    // Else use the full height
                    range += childHeight;
                }
            } else if (range > 0) {
                // If we've hit an non-quick return scrollable view, and we've already hit a
                // quick return view, return now
                break;
            }
        }
        return mDownPreScrollRange = Math.max(0, range - getTopInset());
    }

可以看出上述代码是，查找满足FLAG_QUICK_RETURN的view，把他的高度统计下来，FLAG_QUICK_RETURN是甚么，看下边就是SCROLL_FLAG_SCROLL和SCROLL_FLAG_ENTER_ALWAYS，我们的toolbar满足条件，所以返回T
（如果for循环内存在多个满足FLAG_QUICK_RETURN的view，那第2个的margin会被计算进去，但是本身高度不会算到range里面）

static final int FLAG_QUICK_RETURN = SCROLL_FLAG_SCROLL | SCROLL_FLAG_ENTER_ALWAYS;

去掉enterAlways

此时，上滑的时候,先滑AppBarLayout，然后滑NestedScrollView，下滑的时候先滑NestedScrollView后滑AppBarLayout。
为什么会这样呢？首先安装嵌套滑动的逻辑实际上是NestedScrollView和CoordinatorLayout为嵌套父子view，此处CoordinatorLayout把滑动都交给了AppBarLayout。所以可以简单认为AppBarLayout和NestedScrollView为嵌套父子view，那不管上滑下滑的时候，都是在pre的时候由AppBarLayout滑动(step1)，然后NestedScrollView自己滑(step2)，然后再交由AppBarLayout滑动(step3)。怎样分配step1,step2,step3,AppBarlayout里有几个变量mTotalScrollRange，mDownPreScrollRange，mDownScrollRange就发挥作用了，下滑的时候，先履行step1，step1可以滑多远？mDownPreScrollRange。然后履行step2，step3，step3可以滑多远看mDownScrollRange。而上滑的时候，只有step1，step2，并没有step3（可以看AppBarLayout.Behavior#onNestedScroll内没有对上滑的处理）。

去掉enterAlways为什么下滑的逻辑会变呢？
由于mDownPreScrollRange变了，getDownNestedPreScrollRange里面此时就不会把toolbar高度算进去，结果就是0.

   @Override
        public void onNestedPreScroll(CoordinatorLayout coordinatorLayout, AppBarLayout child,
                View target, int dx, int dy, int[] consumed) {
            if (dy != 0 && !mSkipNestedPreScroll) {
                int min, max;
                if (dy < 0) {
                    // We're scrolling down
                    min = -child.getTotalScrollRange();
                    max = min + child.getDownNestedPreScrollRange();
                } else {
                    // We're scrolling up
                    min = -child.getUpNestedPreScrollRange();
                    max = 0;
                }
                consumed[1] = scroll(coordinatorLayout, child, dy, min, max);
            }
        }

下滑走L7，此时
minOffset==maxOffset,所以其实就制止了preScroll，enterAlways禁止了下拉的时候的preScroll。

那为什么NestedScrollView滑完后，会滑动AppBarLayout呢？
此时子view滑完，触发父view CoordinatorLayout的onNestedScroll,CoordinatorLayout把这个交给AppBarLayout的behavior，此时是下滑，所以dyUnconsumed<0，走到L8，开始滑动。

  @Override
        public void onNestedScroll(CoordinatorLayout coordinatorLayout, AppBarLayout child,
                View target, int dxConsumed, int dyConsumed,
                int dxUnconsumed, int dyUnconsumed) {
            if (dyUnconsumed < 0) {
                // If the scrolling view is scrolling down but not consuming, it's probably be at
                // the top of it's content
                scroll(coordinatorLayout, child, dyUnconsumed,
                        -child.getDownNestedScrollRange(), 0);
                // Set the expanding flag so that onNestedPreScroll doesn't handle any events
                mSkipNestedPreScroll = true;
            } else {
                // As we're no longer handling nested scrolls, reset the skip flag
                mSkipNestedPreScroll = false;
            }
        }

可以看出无enteralways的时候下滑有何不同，AppBarLayout滑动在NestedScrollView以后（onNestedScroll），而有enteralways的时候，AppBarLayout滑动在NestedScrollView之前（onNestedPreScroll）。这个时候可以简单的把AppBarLayout和NestedScrollView看作嵌套滑动里的父子，子view滑前会问父view是不是滑（onNestedPreScroll），子view滑后，若未消耗完距离，会再问1遍父view是不是滑（onNestedScroll）。这里的逻辑是1样的，AppBarLayout可以在NestedScrollView滑前滑，也能够在NestedScrollView滑完以后滑，还可以在NestedScrollView之前滑1部份，以后再滑剩下的。
而AppBarLayout内有3个变量来记录像关数据，mTotalScrollRange，mDownPreScrollRange，mDownScrollRange。

mDownPreScrollRange代表子view滑之前，我可滑多少
mDownScrollRange代表子view滑以后，我可以滑多少
这里有enterAlways时候， mTotalScrollRange= mDownPreScrollRange=T
无enterAlways时候， mTotalScrollRange= mDownScrollRange =T

总结

1、CoordinatorLayout可以作为嵌套滑动的父view，但他和1般的父view不1样（1般的父view是传给父父view处理）他收到嵌套滑动事件以后，会发给子view处理。
2、上滑进程肯定是AppBarlayout优先滑
3、下滑进程为AppBarlayout先滑(step1)，NestedScrollView再滑，AppBarlayout再滑，这个进程由mDownPreScrollRange和mDownScrollRange控制，受enterAlways影响

参考资料

http://android-developers.blogspot.com/2015/05/android-design-support-library.html
http://stackoverflow.com/questions/33984944/toolbar-overlaps-status-bar
http://www.jcodecraeer.com/a/anzhuokaifa/androidkaifa/2015/0717/3196.html
http://blog.csdn.net/qibin0506/article/details/50290421#reply
https://github.com/JakeWharton/DrawerBehavior
http://blog.csdn.net/eclipsexys/article/details/46349721
https://github.com/chrisbanes/cheesesquare (谷歌官方)

https://github.com/rufflez/SupportDesignLibrarySample
https://www.youtube.com/watch?v=Kz_s6DFjTcw
http://www.jianshu.com/p/7caa5f4f49bd
http://www.jianshu.com/p/360fd368936d

生活不易，码农辛苦
如果您觉得本网站对您的学习有所帮助,可以手机扫描二维码进行捐赠
程序员人生

------分隔线----------------------------

上一篇 Leetcode 71 Simplify Path

下一篇 【Bash百宝箱】shell内建命令之cd、getopts

分享到:

------分隔线----------------------------

为码而活

积分：4237

15粉丝

7关注

栏目热点