Android 滑动冲突解决 - ViewPager 篇

LucindaGilb 8年前
   <p>ViewPager 作为一个横向滚动的控件, 在 ViewGroup 中嵌套时会有一些可以优化的细节体验.</p>    <h2>案例一: ViewPager 与 SwipeRefreshLayout</h2>    <ul>     <li> <p>问题说明</p> <p>当 SwipeRefreshLayout 中有 ViewPager 控件, 两者的滑动会相互冲突. 具体表现为 ViewPager 的左右滑动不顺畅, 容易被 SwipeRefreshLayout 拦截(即出现刷新的 View ).</p> </li>     <li> <p>问题原因:</p> <p>ViewPager 本身是处理了滚动事件的冲突, 它在横向滑动时会调用 requestDisallowInterceptTouchEvent() 方法使父控件不拦截当前的 Touch 事件序列. 但是 SwipeRefreshLayout 的 requestDisallowInterceptTouchEvent() 方法置空了, 所以仍然会拦截当前的 Touch 事件序列.</p> </li>     <li> <p>问题分析:</p> <p>为什么 SwipeRefreshLayout 的 requestDisallowInterceptTouchEvent() 方法什么都不做?</p>      <ul>       <li>首先 SwipeRefreshLayout 继承自 ViewGroup .</li>       <li>在 requestDisallowInterceptTouchEvent() 方法置空的情况下, 用户可以从底部下拉刷新一次拉出 LoadingView (即手指不需要离开屏幕).</li>       <li>如果方法调用 ViewGroup 的 requestDisallowInterceptTouchEvent() 方法, 可以解决 ViewPager 的 兼容问题, 但是用户在界面底部下拉至头部后, 无法继续下拉, 需要手指放开一次才能拉出 LoadingView .</li>      </ul> </li>     <li> <p>目标分析:</p> </li>    </ul>    <p>那么为了更加顺滑地滚动, 想要的效果当然是 <strong>一次性拉出 LoadingView</strong> .既然 ViewPager 在左右滑动时才会调用 requestDisallowInterceptTouchEvent() 方法, 那么 SwipeRefreshLayout <strong>只应该在上下滑动时</strong> 才拦截 Touch 事件.</p>    <p>代码具体逻辑如下:</p>    <ol>     <li>记录是否调用了 requestDisallowInterceptTouchEvent() 方法,并且设置为true.</li>     <li>在 SwipeRefreshLayout 中判断是否是上下滑动.</li>     <li>如果同时满足1,2, 则调用 super.requestDisallowInterceptTouchEvent(true) 拦截事件.</li>     <li>否则调用 super.requestDisallowInterceptTouchEvent(false) .</li>    </ol>    <p>注意:因为 ViewGroup 的 requestDisallowInterceptTouchEvent 方法返回 true 后, 接下来的 Touch 事件在不会再传递到 onInterceptTouchEvent() 方法中, 所以需要在 dispatchTouchEvent() 方法中判断是否为上下滑动.</p>    <ul>     <li> <p>实现代码(部分):</p> <pre>  <code class="language-java">//非法按键  private static final int INVALID_POINTER = -1;    //dispatch方法记录第一次按下的x  private float mInitialDisPatchDownX;    //dispatch方法记录第一次按下的y  private float mInitialDisPatchDownY;    //dispatch方法记录的手指  private int mActiveDispatchPointerId = INVALID_POINTER;    //是否请求拦截  private boolean hasRequestDisallowIntercept = false;    @Override  public void requestDisallowInterceptTouchEvent(boolean b) {      hasRequestDisallowIntercept = b;      // Nope.  }    @Override  public boolean dispatchTouchEvent(MotionEvent ev) {      switch (ev.getAction()) {          case MotionEvent.ACTION_DOWN:              mActiveDispatchPointerId = MotionEventCompat.getPointerId(ev, 0);              final float initialDownX = getMotionEventX(ev, mActiveDispatchPointerId);              if (initialDownX != INVALID_POINTER) {                  mInitialDisPatchDownX = initialDownX;              }              final float initialDownY = getMotionEventY(ev, mActiveDispatchPointerId);              if (mInitialDisPatchDownY != INVALID_POINTER) {                  mInitialDisPatchDownY = initialDownY;              }              break;          case MotionEvent.ACTION_MOVE:              if (hasRequestDisallowIntercept) {                  //解决viewPager滑动冲突问题                  final float x = getMotionEventX(ev, mActiveDispatchPointerId);                  final float y = getMotionEventY(ev, mActiveDispatchPointerId);                  if (mInitialDisPatchDownX != INVALID_POINTER && x != INVALID_POINTER &&                          mInitialDisPatchDownY != INVALID_POINTER && y != INVALID_POINTER) {                      final float xDiff = Math.abs(x - mInitialDisPatchDownX);                      final float yDiff = Math.abs(y - mInitialDisPatchDownY);                      if (xDiff > mTouchSlop && xDiff * 0.7f > yDiff) {                          //横向滚动不需要拦截                          super.requestDisallowInterceptTouchEvent(true);                      } else {                          super.requestDisallowInterceptTouchEvent(false);                      }                  } else {                      super.requestDisallowInterceptTouchEvent(false);                  }              }              break;          case MotionEvent.ACTION_UP:          case MotionEvent.ACTION_CANCEL:              if (ev.getAction() == MotionEvent.ACTION_UP || ev.getAction() == MotionEvent.ACTION_CANCEL) {                  hasRequestDisallowIntercept = false;              }              break;      }        return super.dispatchTouchEvent(ev);  }    private float getMotionEventY(MotionEvent ev, int activePointerId) {      final int index = MotionEventCompat.findPointerIndex(ev, activePointerId);      if (index < 0) {          return -1;      }      return MotionEventCompat.getY(ev, index);  }    private float getMotionEventX(MotionEvent ev, int activePointerId) {      final int index = MotionEventCompat.findPointerIndex(ev, activePointerId);      if (index < 0) {          return -1;      }      return MotionEventCompat.getX(ev, index);  }</code></pre> </li>    </ul>    <h2>案例二: ViewPager 与 RecyclerView</h2>    <p><img src="https://simg.open-open.com/show/789c5b1fe4198dd8d68fb19980899eff.png"></p>    <p>如上图, RecyclerView 中嵌套 ViewPager .</p>    <ul>     <li>问题说明      <ol>       <li>当用户滑动 RecyclerView 后放开手指, RecyclerView 会继续滑动并处于 Fling 状态.</li>       <li>此时用户重新触摸屏幕, RecyclerView 滑动停止, 但是无法左右滑动 ViewPager , 只能上下滑动 RecyclerView .</li>      </ol> </li>     <li> <p>问题原因</p> <p>当用户重新触摸屏幕, 此时 RecyclerView 的 onInterceptTouchEvent() 方法还是返回了 true , 所以 ViewGroup 还是继续拦截了事件, 导致 ViewPager 无法处理.</p> </li>     <li> <p>解决思路</p>      <ol>       <li>如果是 Fling 状态的 RecyclerView , 在处理 ACTION_DOWN 事件时, 应该与 IDLE 状态下保持一致.</li>       <li>Fling 状态下处理 ACTION_DOWN , onInterceptTouchEvent() 方法应该返回 false.</li>      </ol> </li>     <li> <p>实现代码:</p> <pre>  <code class="language-java">@Override  public boolean onInterceptTouchEvent(MotionEvent e) {      //isScrolling 为 true 表示是 Fling 状态      boolean isScrolling = getScrollState() == SCROLL_STATE_SETTLING;      boolean ans = super.onInterceptTouchEvent(e);      if (ans && isScrolling && e.getAction() == MotionEvent.ACTION_DOWN) {          //先调用 onTouchEvent() 使 RecyclerView 停下来          onTouchEvent(e);          //反射恢复 ScrollState          try {              Field field = RecyclerView.class.getDeclaredField("mScrollState");              field.setAccessible(true);              field.setInt(this, SCROLL_STATE_IDLE);          } catch (NoSuchFieldException e1) {              e1.printStackTrace();          } catch (IllegalAccessException e1) {              e1.printStackTrace();          }          return false;      }      return ans;  }</code></pre> </li>    </ul>    <h2>案例三: ViewPager 与 ScrollView</h2>    <p>在 ScrollView 嵌套 ViewPager , Fling 状态下会有跟 RecyclerView 一样的问题, 所以解决思路也是一样的, 只是代码部分有所不同.</p>    <pre>  <code class="language-java">@Override  public boolean onInterceptTouchEvent(MotionEvent ev) {      boolean ans = super.onInterceptTouchEvent(ev);      if (ans && ev.getAction() == MotionEvent.ACTION_DOWN) {          onTouchEvent(ev);          Field field = null;          try {              field = NestedScrollView.class.getDeclaredField("mIsBeingDragged");          } catch (NoSuchFieldException e) {              e.printStackTrace();          }          if (field != null) {              field.setAccessible(true);              try {                  field.setBoolean(this, false);              } catch (IllegalAccessException e) {                  e.printStackTrace();              }          }          return false;      }      return ans;  }</code></pre>    <p> </p>    <p>来自:http://niorgai.github.io/2015/10/15/滑动冲突解决-ViewPager/</p>    <p> </p>