Android-解决ViewPager2嵌套ViewPager2冲突

图片来源网络

业务场景:
LinearLayout+ViewPager2实现底部导航,然后Fragment当中MagicIndicator+ViewPager2,实现顶部导航栏。两个页面都是滑动切换的情况。这样两个ViewPager2会出现滑动冲突。

解决的办法

  1. 从网上一个大佬的博客当中复制出来一个类:
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滑动冲突问题的小伙伴有所帮助。

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容