如何在Android中实现类似Google Tez的三方滑动开关？交互效果求助

嘿，我刚好做过类似的滑动触发交互，给你分享一个能完美匹配需求的完整方案——既能实现上下滑动触发不同Intent，又能还原Google Tez那种流畅的动态滑动效果！

核心思路 #

我们通过自定义View+手势监听+属性动画的组合来实现：

1. 用GestureDetector精准监听手指的滑动手势，实时同步开关的位置
2. 用ValueAnimator实现三类平滑动画：手指滑动时的实时跟随、松手后未达阈值的回弹、触发Intent时的边界滑动
3. 设定滑动阈值，只有当滑动距离超过阈值时才触发对应的Intent，避免误操作

完整代码实现 #

1. 自定义滑动开关View #

这个View封装了所有滑动逻辑和动画效果，直接用就行：

class SlideSwitchView @JvmOverloads constructor(
    context: Context, attrs: AttributeSet? = null, defStyleAttr: Int = 0
) : View(context, attrs, defStyleAttr) {

    // 当前滑动的Y轴位移
    private var currentY = 0f
    // 初始居中位置
    private val initialY = 0f
    // 触发Intent的滑动阈值（可根据需求调整）
    private val slideThreshold = 120f
    // 手势监听器
    private val gestureDetector = GestureDetector(context, SlideGestureListener())
    // 动画控制器
    private var animator: ValueAnimator? = null

    override fun onTouchEvent(event: MotionEvent): Boolean {
        // 把触摸事件交给手势监听器处理
        return gestureDetector.onTouchEvent(event)
    }

    // 自定义手势监听逻辑
    inner class SlideGestureListener : GestureDetector.SimpleOnGestureListener() {
        override fun onScroll(
            e1: MotionEvent?,
            e2: MotionEvent?,
            distanceX: Float,
            distanceY: Float
        ): Boolean {
            // 计算滑动位移：distanceY为正表示手指上滑，为负表示下滑
            val deltaY = -distanceY
            currentY += deltaY
            // 限制滑动范围，避免滑出边界
            currentY = currentY.coerceIn(-slideThreshold, slideThreshold)
            // 实时更新View位置，实现跟随手指滑动的效果
            translationY = currentY
            return true
        }

        override fun onUp(e: MotionEvent?): Boolean {
            // 手指松开时判断滑动结果
            when {
                // 上滑超过阈值：触发上滑Intent，同时滑到顶部边界
                currentY >= slideThreshold -> {
                    animateToTarget(slideThreshold) {
                        triggerUpIntent()
                    }
                }
                // 下滑超过阈值：触发下滑Intent，同时滑到底部边界
                currentY <= -slideThreshold -> {
                    animateToTarget(-slideThreshold) {
                        triggerDownIntent()
                    }
                }
                // 未达到阈值：回弹到初始位置
                else -> {
                    animateToTarget(initialY)
                }
            }
            return super.onUp(e)
        }
    }

    // 平滑滑动到目标位置的动画
    private fun animateToTarget(targetY: Float, onAnimationEnd: (() -> Unit)? = null) {
        animator?.cancel() // 取消之前的动画，避免冲突
        animator = ValueAnimator.ofFloat(currentY, targetY).apply {
            duration = 350 // 动画时长，可根据需求调整
            interpolator = DecelerateInterpolator() // 减速插值器，让动画更自然
            addUpdateListener { animation ->
                currentY = animation.animatedValue as Float
                translationY = currentY
            }
            addListener(object : Animator.AnimatorListener {
                override fun onAnimationStart(animation: Animator?) {}
                override fun onAnimationEnd(animation: Animator?) {
                    onAnimationEnd?.invoke()
                    // 如果是回弹到初始位置，重置currentY
                    if (targetY == initialY) {
                        currentY = initialY
                    }
                }
                override fun onAnimationCancel(animation: Animator?) {}
                override fun onAnimationRepeat(animation: Animator?) {}
            })
            start()
        }
    }

    // 触发上滑对应的Intent
    private fun triggerUpIntent() {
        val intent = Intent(context, YourUpTargetActivity::class.java)
        context.startActivity(intent)
        // 触发后延迟回弹到初始位置
        postDelayed({ animateToTarget(initialY) }, 600)
    }

    // 触发下滑对应的Intent
    private fun triggerDownIntent() {
        val intent = Intent(context, YourDownTargetActivity::class.java)
        context.startActivity(intent)
        // 触发后延迟回弹到初始位置
        postDelayed({ animateToTarget(initialY) }, 600)
    }
}

2. 布局中使用自定义View #

在XML布局里添加这个滑动开关，你可以自定义它的大小和背景样式：

<com.yourpackage.SlideSwitchView
    android:layout_width="match_parent"
    android:layout_height="150dp"
    android:background="@drawable/slide_switch_bg"
    android:clickable="true" />

额外优化建议 #

• 视觉反馈增强：可以在onScroll方法中添加颜色变化、阴影深浅变化，或者在View内部添加一个指示器图标，跟随滑动位移移动，让用户更直观感受到滑动状态
• 参数自定义：可以通过自定义属性把滑动阈值、动画时长等参数暴露到XML中，方便灵活调整
• 边界限制：如果需要限制滑动的最大范围，可以在onScroll里进一步缩小currentY的取值范围

这样实现的滑动开关，完全能达到Google Tez那种流畅的滑动交互效果，同时精准触发你需要的两个Intent！

内容的提问来源于stack exchange，提问作者user4520896