MotionLayout联动RecyclerView滚动时列表项被截断的问题及解决诉求

你的问题核心在于反向动画没有触发条件限制，导致只要向上滚动RecyclerView，不管是否在顶部都会触发头部显示动画，遮挡列表内容。我们可以通过以下两步修复：

1. 完善MotionScene的双向Transition配置 #

显式定义正向（头部隐藏）和反向（头部显示）的Transition，给反向Transition添加motion:moveWhenScrollAtTop="true"属性，确保只有当RecyclerView滚动到顶部时，才允许触发头部显示的动画。

修改后的fragment_scene.xml：

<?xml version="1.0" encoding="utf-8"?>
<MotionScene xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:motion="http://schemas.android.com/apk/res-auto">

    <!-- 正向动画：向下滚动RecyclerView，隐藏头部 -->
    <Transition
        motion:constraintSetStart="@id/start"
        motion:constraintSetEnd="@id/end"
        motion:duration="500">
        <OnSwipe
            motion:dragDirection="dragUp"
            motion:touchAnchorId="@id/recyclerview"
            motion:touchAnchorSide="top"
            motion:onTouchUp="stop"
            motion:moveWhenScrollAtTop="false"/>
    </Transition>

    <!-- 反向动画：仅在RecyclerView顶部时，向上拖动显示头部 -->
    <Transition
        motion:constraintSetStart="@id/end"
        motion:constraintSetEnd="@id/start"
        motion:duration="500">
        <OnSwipe
            motion:dragDirection="dragDown"
            motion:touchAnchorId="@id/recyclerview"
            motion:touchAnchorSide="top"
            motion:onTouchUp="stop"
            motion:moveWhenScrollAtTop="true"/>
    </Transition>

    <ConstraintSet android:id="@+id/start">
        <!-- 初始状态：头部可见，RecyclerView顶部有250dp间距 -->
        <Constraint
            android:id="@+id/image_view"
            android:layout_width="match_parent"
            android:layout_height="300dp"
            android:elevation="1dp"
            android:alpha="1"
            android:visibility="visible"
            motion:layout_constraintEnd_toEndOf="parent"
            motion:layout_constraintStart_toStartOf="parent"
            motion:layout_constraintTop_toTopOf="parent" />

        <Constraint
            android:id="@+id/spacer"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_marginTop="250dp"
            motion:layout_constraintEnd_toEndOf="parent"
            motion:layout_constraintStart_toStartOf="parent"
            motion:layout_constraintTop_toTopOf="parent" />
    </ConstraintSet>

    <ConstraintSet android:id="@+id/end">
        <!-- 结束状态：头部透明隐藏，RecyclerView顶到父布局 -->
        <Constraint
            android:id="@+id/image_view"
            android:layout_width="match_parent"
            android:layout_height="300dp"
            android:elevation="1dp"
            android:alpha="0"
            android:visibility="invisible"
            motion:layout_constraintEnd_toEndOf="parent"
            motion:layout_constraintStart_toStartOf="parent"
            motion:layout_constraintTop_toTopOf="parent" />

        <Constraint
            android:id="@+id/spacer"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_marginTop="0dp"
            motion:layout_constraintEnd_toEndOf="parent"
            motion:layout_constraintStart_toStartOf="parent"
            motion:layout_constraintTop_toTopOf="parent" />
    </ConstraintSet>

</MotionScene>

关键调整点： #

• 新增反向Transition，指定dragDirection="dragDown"，对应RecyclerView向上滚动（拖动列表向下）的操作
• 给反向Transition添加motion:moveWhenScrollAtTop="true"，这会让MotionLayout仅在RecyclerView滚动到第一个item完全可见时，才响应反向拖动操作
• 将ImageView的visibility切换改为alpha动画（从1到0），让隐藏/显示过程更平滑，避免瞬间闪烁

2. 代码层面强化滚动状态控制（可选） #

如果MotionScene的配置还存在边缘情况（比如快速滚动时的动画冲突），可以在Fragment/Activity中添加RecyclerView滚动监听，强制控制MotionLayout的状态：

// 假设你的MotionLayout实例是motionLayout
recyclerview.addOnScrollListener(object : RecyclerView.OnScrollListener() {
    override fun onScrolled(recyclerView: RecyclerView, dx: Int, dy: Int) {
        super.onScrolled(recyclerView, dx, dy)
        val layoutManager = recyclerView.layoutManager as LinearLayoutManager
        // 检查第一个item是否完全可见
        val firstFullVisiblePos = layoutManager.findFirstCompletelyVisibleItemPosition()
        
        if (firstFullVisiblePos == 0) {
            // 在顶部，允许反向动画
            motionLayout.setTransition(R.id.end, R.id.start)
        } else {
            // 不在顶部，强制保持头部隐藏状态
            motionLayout.setTransition(R.id.start, R.id.end)
            motionLayout.progress = 1f
        }
    }
})

为什么原来的配置有问题？ #

你之前只定义了单向Transition，MotionLayout默认会自动生成反向Transition，但这个自动生成的反向Transition没有触发条件限制，导致只要有向上滚动的手势就会执行动画。通过显式定义反向Transition并添加moveWhenScrollAtTop="true"，就精准限制了反向动画的触发时机。

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