ViewPager2滑動沖突解決方案
自去年12月份ViewPager2正式版發(fā)布以后,ViewPager2已經(jīng)逐漸開始替代舊版本的ViewPager。許多開發(fā)者也已經(jīng)在項(xiàng)目中使用了ViewPager2。相比ViewPager,ViewPager2的功能不可謂不強(qiáng)大,我在之前寫過的一篇文章《學(xué)不動也要學(xué)!深入了解ViewPager2 》中對ViewPager2的使用做過詳細(xì)的講解。但是,由于當(dāng)時(shí)沒有太多實(shí)戰(zhàn),所以并沒有發(fā)現(xiàn)ViewPager2的嵌套使用存在嚴(yán)重的滑動沖突。直到今年三月份用ViewPager2重構(gòu)BannerViewPager的時(shí)候才發(fā)現(xiàn)這個(gè)問題。因此,在BVP 3.0版本中額外對ViewPager2做了滑動沖突處理,效果還算差強(qiáng)人意。另外,曾在論壇上看到過不少ViewPager2滑動沖突的求助帖子,甚至還有同學(xué)因?yàn)樗阉鱒iewPager2滑動沖突而找到了BannerViewPager的Github主頁。既然如此,不如寫篇文章將BVP處理滑動沖突的經(jīng)驗(yàn)分享給大家,沒準(zhǔn)還能漲知 (fěn) 識 **(sī)**,嘿嘿嘿。
一、為什么ViewPager沒有滑動沖突?
不知道你是否有這個(gè)疑問,在ViewPager時(shí)代,ViewPager嵌套ViewPager并沒有出現(xiàn)過滑動沖突??墒菫槭裁丛赩iewPager的升級版ViewPager2中卻出現(xiàn)了滑動沖突呢?想要搞清楚這個(gè)問題就需要我們深入到ViewPager和ViewPager2的內(nèi)部分析一下它們的源碼了。
我們知道,滑動沖突是需要在onInterceptTouchEvent方法中進(jìn)行處理的,根據(jù)自身?xiàng)l件來決定是否要攔截事件。在ViewPager的源碼中看到以下代碼(方便閱讀,代碼做了刪減):
@Override public boolean onInterceptTouchEvent(MotionEvent ev) { final int action = ev.getAction() & MotionEvent.ACTION_MASK; if (action == MotionEvent.ACTION_CANCEL || action == MotionEvent.ACTION_UP) { // 在事件取消或者抬起手指后重置狀態(tài) resetTouch(); return false; } switch (action) { case MotionEvent.ACTION_MOVE: { // 這里判斷在水平方向上的滑動距離大于豎直方向的2倍,則認(rèn)為是有效的切換頁面的滑動 if (xDiff > mTouchSlop && xDiff * 0.5f > yDiff) { mIsBeingDragged = true; // 禁止Parent View攔截事件,即事件要能夠傳遞到ViewPager requestParentDisallowInterceptTouchEvent(true); setScrollState(SCROLL_STATE_DRAGGING); } else if (yDiff > mTouchSlop) { mIsUnableToDrag = true; } break; } case MotionEvent.ACTION_DOWN: { if (mScrollState == SCROLL_STATE_SETTLING && Math.abs(mScroller.getFinalX() - mScroller.getCurrX()) > mCloseEnough) { // 在Down事件中禁止Parent View攔截事件,是為了事件序列能夠傳遞到ViewPager requestParentDisallowInterceptTouchEvent(true); setScrollState(SCROLL_STATE_DRAGGING); } else { completeScroll(false); mIsBeingDragged = false; } break; } case MotionEvent.ACTION_POINTER_UP: onSecondaryPointerUp(ev); break; } return mIsBeingDragged; }
可以看到在ACTION_DOWN與ACTION_MOVE中根據(jù)一些判斷條件調(diào)用了requestParentDisallowInterceptTouchEvent(true)方法來禁止Parent View攔截事件,也就是說ViewPager已經(jīng)幫我們處理了滑動沖突,所以我們只管用即可,無需擔(dān)心滑動沖突問題。
現(xiàn)在,我們轉(zhuǎn)到ViewPager2中,翻閱源碼發(fā)現(xiàn)只有在RecyclerView 的實(shí)現(xiàn)類中有onInterceptTouchEvent的相關(guān)方法,而且這句代碼僅僅是處理禁用了用戶輸入的邏輯!
private class RecyclerViewImpl extends RecyclerView { .... // 省略部分代碼 @Override public boolean onInterceptTouchEvent(MotionEvent ev) { return isUserInputEnabled() && super.onInterceptTouchEvent(ev); } }
也就是說ViewPager2其實(shí)并沒有幫我們處理滑動沖突!這是為什么呢?難道是ViewPager2的開發(fā)者們把這件事忘了?這里我敢保證肯定不是這樣子的。其實(shí),只要我們看一看ViewPager2的結(jié)構(gòu)大概就能知道了。ViewPager2被聲明了final,意味著我們不能像繼承ViewPager一樣來修改ViewPager2。如果官方在ViewPager2內(nèi)部自行處理了滑動沖突,那么如果有特殊的需求,需要根據(jù)我們自己的情況來處理ViewPager2的滑動,那么官方寫的處理滑動沖突的代碼是不是會影響到我們自己的需求?所以我覺得也正因?yàn)檫@樣,干脆不做任何處理,全權(quán)交給了開發(fā)者自行解決。
二、滑動沖突的處理方案
既然官方不給我們處理,那就需要我們自己動手了。在開始之前我們先來了解以下處理滑動沖突的兩種方案。既然出現(xiàn)滑動沖突,那么一定是由于兩個(gè)布局相互嵌套引起的 。既然是兩個(gè)布局,那么我們就可以分為兩個(gè)方向來處理。即所謂的外部攔截法和內(nèi)部攔截法。
1.外部攔截法
所謂的“外部攔截法“中的外部是指出現(xiàn)滑動沖突的這兩個(gè)布局的外層。我們知道,一個(gè)事件序列是由Parent View先獲取到的,如果Parent View不攔截事件那么才會交由子View去處理。既然是外層先獲知事件,那外層View根據(jù)自身情況來決定是否要攔截事件不就行了嗎?因此外部攔截法的實(shí)現(xiàn)是非常簡單的,大概思路如下:
public boolean onInterceptTouchEvent(MotionEvent event) { boolean intercepted = false; int x = (int) event.getX(); int y = (int) event.getY(); switch (event.getAction()) { case MotionEvent.ACTION_DOWN: { intercepted = false; break; } case MotionEvent.ACTION_MOVE: { if (needIntercept) { // 這里根據(jù)需求判斷是否需要攔截 intercepted = true; } else { intercepted = false; } break; } case MotionEvent.ACTION_UP: { intercepted = false; break; } default: break; } mLastXIntercept = x; mLastYIntercept = y; return intercepted; }
2.內(nèi)部攔截法
所謂的”內(nèi)部攔截法“指的是對內(nèi)部的View做文章,讓內(nèi)部View決定是不是攔截事件。但是現(xiàn)在就有問題了,你怎么知道外部的View是不是要攔截事件????如果外部View把事件攔截了,內(nèi)部的View豈不是連西北風(fēng)都喝不到了?別著急,Google官方當(dāng)然有考慮到這種情況。在ViewGroup中有一個(gè)叫requestDisallowInterceptTouchEvent的方法,這個(gè)方法接受一個(gè)boolean值,意思是是否要禁止ViewGroup攔截當(dāng)前事件。如果是true的話那么該ViewGroup則無法對事件進(jìn)行攔截。有了這個(gè)方法那我們就可以讓內(nèi)部View大顯神通了。來看下內(nèi)部攔截法的代碼:
public boolean dispatchTouchEvent(MotionEvent event) { int x = (int) event.getX(); int y = (int) event.getY(); switch (event.getAction()) { case MotionEvent.ACTION_DOWN: { // 禁止parent攔截down事件 parent.requestDisallowInterceptTouchEvent(true); break; } case MotionEvent.ACTION_MOVE: { int deltaX = x - mLastX; int deltaY = y - mLastY; if (disallowParentInterceptTouchEvent) { // 根據(jù)需求條件來決定是否讓Parent View攔截事件。 parent.requestDisallowInterceptTouchEvent(false); } break; } case MotionEvent.ACTION_UP: { break; } default: break; } mLastX = x; mLastY = y; return super.dispatchTouchEvent(event); }
這么處理之后,兩個(gè)嵌套View就可以和諧工作了。
下面是來自外部View和內(nèi)部View的對話。
外部View:”我想攔截事件!“
內(nèi)部View:”不,你不想。這事件我要定了,耶穌都留不住他。
三、處理ViewPager2的滑動沖突
上一章講了滑動沖突處理的兩種方案,那么本章我們就來解決ViewPager2的滑動沖突。首先,應(yīng)該確定一下存在在哪些需要攔截和不需要攔截的邊界條件。在寫這篇文章之前,我Google搜索了一下ViewPager2的滑動沖突處理方案,關(guān)于這方面的文章還不算少,不過大部分的文章對于ViewPager2的滑動沖突處理考慮的都不夠完善。
下面我們詳細(xì)來分析一下:
- 如果設(shè)置了userInputEnable=false,那么ViewPager2不應(yīng)該攔截任何事件;
- 如果只有一個(gè)Item,那么ViewPager2也不應(yīng)該攔截事件;
- 如果是多個(gè)Item,且當(dāng)前是第一個(gè)頁面,那么只能攔截向左的滑動事件,向右的滑動事件就不應(yīng)該由ViewPager2攔截了;
- 如果是多個(gè)Item,且當(dāng)前是最后一個(gè)頁面,那么只能攔截向右的滑動事件,向左的滑動事件不應(yīng)該由當(dāng)前的ViewPager2攔截;
- 如果是多個(gè)Item,且是中間頁面,那么無論向左還是向右的事件都應(yīng)該由ViewPager2攔截;
- 最后,由于ViewPager2是支持豎直滑動的,那么豎直滑動也應(yīng)該考慮以上條件。
分析完了邊界條件之后,我們看下應(yīng)該使用哪種方案來處理滑動沖突?很明顯,這里應(yīng)該使用內(nèi)部攔截法處理。但是,由于ViewPager2被設(shè)置成了final,我們無法通過繼承的方式來處理,因此就需要我們在ViewPager2外部加一層自定義的Layout。這層Layout其實(shí)相當(dāng)于夾在了內(nèi)層View和外層View的中間,其實(shí)就是這層Layout就變成了內(nèi)層。好了,廢話不多說了,直接貼代碼了。
class ViewPager2Container @JvmOverloads constructor(context: Context, attrs: AttributeSet? = null, defStyleAttr: Int = 0) : RelativeLayout(context, attrs, defStyleAttr) { private var mViewPager2: ViewPager2? = null private var disallowParentInterceptDownEvent = true private var startX = 0 private var startY = 0 override fun onFinishInflate() { super.onFinishInflate() for (i in 0 until childCount) { val childView = getChildAt(i) if (childView is ViewPager2) { mViewPager2 = childView break } } if (mViewPager2 == null) { throw IllegalStateException("The root child of ViewPager2Container must contains a ViewPager2") } } override fun onInterceptTouchEvent(ev: MotionEvent): Boolean { val doNotNeedIntercept = (!mViewPager2!!.isUserInputEnabled || (mViewPager2?.adapter != null && mViewPager2?.adapter!!.itemCount <= 1)) if (doNotNeedIntercept) { return super.onInterceptTouchEvent(ev) } when (ev.action) { MotionEvent.ACTION_DOWN -> { startX = ev.x.toInt() startY = ev.y.toInt() parent.requestDisallowInterceptTouchEvent(!disallowParentInterceptDownEvent) } MotionEvent.ACTION_MOVE -> { val endX = ev.x.toInt() val endY = ev.y.toInt() val disX = abs(endX - startX) val disY = abs(endY - startY) if (mViewPager2!!.orientation == ViewPager2.ORIENTATION_VERTICAL) { onVerticalActionMove(endY, disX, disY) } else if (mViewPager2!!.orientation == ViewPager2.ORIENTATION_HORIZONTAL) { onHorizontalActionMove(endX, disX, disY) } } MotionEvent.ACTION_UP, MotionEvent.ACTION_CANCEL -> parent.requestDisallowInterceptTouchEvent(false) } return super.onInterceptTouchEvent(ev) } private fun onHorizontalActionMove(endX: Int, disX: Int, disY: Int) { if (mViewPager2?.adapter == null) { return } if (disX > disY) { val currentItem = mViewPager2?.currentItem val itemCount = mViewPager2?.adapter!!.itemCount if (currentItem == 0 && endX - startX > 0) { parent.requestDisallowInterceptTouchEvent(false) } else { parent.requestDisallowInterceptTouchEvent(currentItem != itemCount - 1 || endX - startX >= 0) } } else if (disY > disX) { parent.requestDisallowInterceptTouchEvent(false) } } private fun onVerticalActionMove(endY: Int, disX: Int, disY: Int) { if (mViewPager2?.adapter == null) { return } val currentItem = mViewPager2?.currentItem val itemCount = mViewPager2?.adapter!!.itemCount if (disY > disX) { if (currentItem == 0 && endY - startY > 0) { parent.requestDisallowInterceptTouchEvent(false) } else { parent.requestDisallowInterceptTouchEvent(currentItem != itemCount - 1 || endY - startY >= 0) } } else if (disX > disY) { parent.requestDisallowInterceptTouchEvent(false) } } /** * 設(shè)置是否允許在當(dāng)前View的{@link MotionEvent#ACTION_DOWN}事件中禁止父View對事件的攔截,該方法 * 用于解決CoordinatorLayout+CollapsingToolbarLayout在嵌套ViewPager2Container時(shí)引起的滑動沖突問題。 * * 設(shè)置是否允許在ViewPager2Container的{@link MotionEvent#ACTION_DOWN}事件中禁止父View對事件的攔截,該方法 * 用于解決CoordinatorLayout+CollapsingToolbarLayout在嵌套ViewPager2Container時(shí)引起的滑動沖突問題。 * * @param disallowParentInterceptDownEvent 是否允許ViewPager2Container在{@link MotionEvent#ACTION_DOWN}事件中禁止父View攔截事件,默認(rèn)值為false * true 不允許ViewPager2Container在{@link MotionEvent#ACTION_DOWN}時(shí)間中禁止父View的時(shí)間攔截, * 設(shè)置disallowIntercept為true可以解決CoordinatorLayout+CollapsingToolbarLayout的滑動沖突 * false 允許ViewPager2Container在{@link MotionEvent#ACTION_DOWN}時(shí)間中禁止父View的時(shí)間攔截, */ fun disallowParentInterceptDownEvent(disallowParentInterceptDownEvent: Boolean) { this.disallowParentInterceptDownEvent = disallowParentInterceptDownEvent } }
上邊代碼限于篇幅我就不做過多解釋了,注意一下在onFinishInflate中我們通過循環(huán),遍歷了ViewPager2Container的所有子View,如果沒有找到ViewPager2就拋出異常。另外,disallowParentInterceptDownEvent方法注釋寫的比較詳細(xì)就不多說了。
使用方法也很簡單,直接用ViewPager2Container包裹ViewPager2即可:
<com.zhpan.sample.viewpager2.ViewPager2Container android:layout_width="match_parent" android:layout_height="match_parent" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintLeft_toLeftOf="parent" app:layout_constraintRight_toRightOf="parent" app:layout_constraintTop_toTopOf="parent"> <androidx.viewpager2.widget.ViewPager2 android:id="@+id/view_pager2" android:layout_width="match_parent" android:layout_height="match_parent" /> <com.zhpan.indicator.IndicatorView android:id="@+id/indicatorView" android:layout_centerHorizontal="true" android:layout_alignParentBottom="true" android:layout_margin="@dimen/dp_20" android:layout_width="wrap_content" android:layout_height="wrap_content"/> </com.zhpan.sample.viewpager2.ViewPager2Container>
這是關(guān)于ViewPager2滑動出沖突的處理方案,當(dāng)然,由于BannerViewPager支持循環(huán)輪播,所以BannerViewPager的滑動沖突處理相對會更麻煩些。如果有興趣的同學(xué)可以點(diǎn)擊查看BannerViewPager的源碼。
同時(shí),ViewPager2Container 的源碼我也放到了Github,需要用到的可以自取。
以上就是ViewPager2滑動沖突解決方案的詳細(xì)內(nèi)容,更多關(guān)于ViewPager2滑動沖突解決的資料請關(guān)注腳本之家其它相關(guān)文章!
相關(guān)文章
Android實(shí)現(xiàn)音頻條形圖效果(仿音頻動畫無監(jiān)聽音頻輸入)
這篇文章主要介紹了Android實(shí)現(xiàn)音頻條形圖效果(仿音頻動畫無監(jiān)聽音頻輸入)的相關(guān)資料,非常不錯(cuò),具有參考借鑒價(jià)值,需要的朋友可以參考下2016-09-09Android使用HorizontalScrollView實(shí)現(xiàn)水平滾動
這篇文章主要為大家詳細(xì)介紹了Android使用HorizontalScrollView實(shí)現(xiàn)水平滾動,并點(diǎn)擊有相應(yīng)的反應(yīng)效果,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2018-11-11加載頁面遮擋耗時(shí)操作任務(wù)頁面--第三方開源之AndroidProgressLayout
AndroidProgressLayout實(shí)現(xiàn)為界面添加圓形進(jìn)度條。調(diào)用setprogress()方法顯示和隱藏進(jìn)度條,這篇文章主要介紹了加載頁面遮擋耗時(shí)操作任務(wù)頁面--第三方開源之AndroidProgressLayout的相關(guān)資料,需要的朋友可以參考下2015-11-11Android模擬器"Failed To Allocate memory 8"錯(cuò)誤如何解決
這篇文章主要介紹了Android模擬器"Failed To Allocate memory 8"錯(cuò)誤如何解決的相關(guān)資料,需要的朋友可以參考下2017-03-03Android Handler的postDelayed()關(guān)閉的方法及遇到問題
這篇文章主要介紹了Android Handler的postDelayed()關(guān)閉的方法,本文給大家介紹的非常詳細(xì),對大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2021-04-04