Custom vertical viewpager not work with onClick listener on a child view

Question

I have this custom ViewPager created from here (Android: Vertical ViewPager):

class VerticalViewPager : ViewPager {

@JvmOverloads
constructor(
        context: Context,
        attrs: AttributeSet? = null)
        : super(context, attrs){
    setPageTransformer(false, DefaultTransformer())
    overScrollMode = OVER_SCROLL_NEVER
}

override fun onInterceptTouchEvent(ev: MotionEvent): Boolean {
    val intercepted = super.onInterceptTouchEvent(swapXY(ev))
    swapXY(ev) // return touch coordinates to original reference frame for any child views
    return intercepted
}

override fun onTouchEvent(ev: MotionEvent?): Boolean {
    return super.onTouchEvent(ev)
}

/**
 * Swaps the X and Y coordinates of your touch event.
 */
private fun swapXY(ev: MotionEvent): MotionEvent {
    val width = width.toFloat()
    val height = height.toFloat()

    val newX = ev.y / height * width
    val newY = ev.x / width * height

    ev.setLocation(newX, newY)

    return ev
}

private class VerticalPageTransformer : ViewPager.PageTransformer{
    override fun transformPage(view: View, position: Float) {
        if (position < -1) { // [-Infinity,-1)
            // This page is way off-screen to the left.
            view.alpha = 0f

        } else if (position <= 1) { // [-1,1]
            view.alpha = 1f

            // Counteract the default slide transition
            view.translationX = view.getWidth() * -position

            //set Y position to swipe in from top
            val yPosition = position * view.getHeight()
            view.translationY = yPosition

        } else { // (1,+Infinity]
            // This page is way off-screen to the right.
            view.alpha = 0f
        }
    }

}

}

I use an adapter that loads an ImageView inside each page. This ImageView has a onClickListener.

open class VerticalViewPagerAdapter(var mContext: Context, val photos : RealmList<ProfilePhoto>?, onPhotoClick: OnPhotoClick?) : PagerAdapter() {

var mLayoutInflater : LayoutInflater? = null
val onPhotoListener = onPhotoClick

init {
    mLayoutInflater = mContext.getSystemService(Context.LAYOUT_INFLATER_SERVICE) as LayoutInflater
}

override fun getCount(): Int {
    return photos?.size!!
}

override fun isViewFromObject(view: View, `object`: Any): Boolean {
    return view === `object` as FrameLayout
}

override fun instantiateItem(container: ViewGroup, position: Int): Any {
    val itemView = mLayoutInflater?.inflate(R.layout.view_image_profile_viewpager_item, container, false)

    val imageView = itemView?.findViewById(R.id.profileImageItemIv) as ImageView

    imageView.setOnClickListener{
        onPhotoListener?.onPhotoClick(position)
    }

    imageView.loadUrlImage(photos!![position]?.photo)

    container.addView(itemView)

    return itemView
}

override fun destroyItem(container: ViewGroup, position: Int, `object`: Any) {
    container.removeView(`object` as FrameLayout)
}
}

The swipe on the custom viewpager doesn't work if the ImageView has this listener. If I remove the listener, works fine.

Anybody know what can be the problem?

score 0 · Accepted Answer · edited May 11 '18 at 09:09

Finally I solved the problem. I was to add logic to onInterceptTouchEvent to release the onTouch event if user only tap the viewpager and not swapping. This is the final code:

class VerticalViewPager : ViewPager {

var originalPosY = 0

@JvmOverloads
constructor(
        context: Context,
        attrs: AttributeSet? = null)
        : super(context, attrs){
    setPageTransformer(false, DefaultTransformer())
}

private fun swapTouchEvent(event: MotionEvent): MotionEvent {
    val width = width.toFloat()
    val height = height.toFloat()

    val swappedX = event.y / height * width
    val swappedY = event.x / width * height

    event.setLocation(swappedX, swappedY)

    return event
}

override fun onInterceptTouchEvent(event: MotionEvent): Boolean {

    var y : Int = event.rawY.toInt()

    return when (event.action) {

        MotionEvent.ACTION_DOWN -> {
            originalPosY = y
            val intercept = super.onInterceptTouchEvent(swapTouchEvent(event))
            swapTouchEvent(event)
            false
        }

        MotionEvent.ACTION_MOVE -> {

            val intercept = super.onInterceptTouchEvent(swapTouchEvent(event))
            val i = swapTouchEvent(event)
            true

        }

        MotionEvent.ACTION_UP -> {

            if (Math.abs(originalPosY - y) > 10) {
                super.onInterceptTouchEvent(swapTouchEvent(event))
                val i = swapTouchEvent(event)
                true
            }else
                false
        }

        else -> super.onInterceptTouchEvent(swapTouchEvent(event))

    }
}

override fun onTouchEvent(event: MotionEvent): Boolean = super.onTouchEvent(swapTouchEvent(event))
}

The result is not all accurate that I want. If someone can improve it, it will be welcome

Custom vertical viewpager not work with onClick listener on a child view

1 Answers1