图片来源网络
业务场景:
LinearLayout+ViewPager2实现底部导航,然后Fragment当中MagicIndicator+ViewPager2,实现顶部导航栏。两个页面都是滑动切换的情况。这样两个ViewPager2会出现滑动冲突。
解决的办法
- 从网上一个大佬的博客当中复制出来一个类:
import android.content.Context
import android.util.AttributeSet
import android.view.MotionEvent
import android.widget.RelativeLayout
import androidx.viewpager2.widget.ViewPager2
import kotlin.math.abs
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)
}
}
/**
* 设置是否允许在当前View的{@link MotionEvent#ACTION_DOWN}事件中禁止父View对事件的拦截,该方法
* 用于解决CoordinatorLayout+CollapsingToolbarLayout在嵌套ViewPager2Container时引起的滑动冲突问题。
*
* 设置是否允许在ViewPager2Container的{@link MotionEvent#ACTION_DOWN}事件中禁止父View对事件的拦截,该方法
* 用于解决CoordinatorLayout+CollapsingToolbarLayout在嵌套ViewPager2Container时引起的滑动冲突问题。
*
* @param disallowParentInterceptDownEvent 是否允许ViewPager2Container在{@link MotionEvent#ACTION_DOWN}事件中禁止父View拦截事件,默认值为false
* true 不允许ViewPager2Container在{@link MotionEvent#ACTION_DOWN}时间中禁止父View的时间拦截,
* 设置disallowIntercept为true可以解决CoordinatorLayout+CollapsingToolbarLayout的滑动冲突
* false 允许ViewPager2Container在{@link MotionEvent#ACTION_DOWN}时间中禁止父View的时间拦截,
*/
fun disallowParentInterceptDownEvent(disallowParentInterceptDownEvent: Boolean) {
this.disallowParentInterceptDownEvent = disallowParentInterceptDownEvent
}
}
使用方式也很简单的,直接在子Fragment的嵌套使用:
<com.xxx.xxxx.ViewPager2Container
android:layout_width="match_parent"
android:layout_height="0dp"
app:layout_constraintTop_toBottomOf="@id/xxx"
app:layout_constraintBottom_toBottomOf="parent">
<net.lucode.hackware.magicindicator.MagicIndicator
android:id="@+id/xxxx"
android:layout_width="match_parent"
android:layout_height="@dimen/dp_44"
android:layout_gravity="center_horizontal"
android:background="@color/white" />
<androidx.viewpager2.widget.ViewPager2
android:id="@+id/xxxxx"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="@id/xxxxxx"/>
</com.ttww.hr.driver.viewpager2.ViewPager2Container>
完美的解决了ViewPager2
嵌套ViewPager2
滑动冲突的问题。参考的博客:
这可能是ViewPager2滑动冲突最全的处理方案
希望我的这篇博客对有ViewPager2
嵌套ViewPager2
滑动冲突问题的小伙伴有所帮助。