运动布局。 OnSwipe 无法正确处理拖动事件。根本问题是什么？

Question

所以，我有一个简单的场景：

 <Transition
        motion:constraintSetStart="@id/motion_01_cl_start"
        motion:constraintSetEnd="@id/motion_01_cl_end"
        motion:duration="300">

    <OnSwipe
        motion:touchRegionId="@id/imageView"
        motion:dragDirection="dragUp"/>
</Transition>


<ConstraintSet android:id="@+id/motion_01_cl_start">
    <Constraint
            android:id="@+id/testView"
            android:layout_width="200dp"
            android:layout_height="250dp"

            motion:layout_constraintBottom_toBottomOf="parent"
            motion:layout_constraintStart_toStartOf="parent"
            motion:layout_constraintTop_toTopOf="parent"
            motion:layout_constraintEnd_toEndOf="parent"
            android:layout_marginTop="0dp"
            android:elevation="3dp"/>

    <Constraint
            android:id="@+id/imageView"
            android:layout_width="200dp"
            android:layout_height="250dp"

            motion:layout_constraintBottom_toBottomOf="parent"
            motion:layout_constraintStart_toStartOf="parent"
            motion:layout_constraintTop_toTopOf="parent"
            motion:layout_constraintEnd_toEndOf="parent"
            android:layout_marginTop="0dp"
            android:elevation="4dp"/>

</ConstraintSet>

<ConstraintSet android:id="@+id/motion_01_cl_end">
    <Constraint
            android:id="@+id/testView"
            android:layout_width="300dp"
            android:layout_height="300dp"
            android:elevation="10dp"
            android:layout_marginTop="100dp"
            motion:layout_constraintStart_toStartOf="parent"
            motion:layout_constraintTop_toTopOf="parent"
            motion:layout_constraintEnd_toEndOf="parent"
    />

    <Constraint
            android:id="@+id/imageView"
            android:layout_width="200dp"
            android:layout_height="290dp"
            android:elevation="25dp"
            android:layout_marginTop="40dp"
            motion:layout_constraintStart_toStartOf="parent"
            motion:layout_constraintTop_toTopOf="parent"
            motion:layout_constraintEnd_toEndOf="parent"
    />
</ConstraintSet>

如您所见，在 Transition 中，我使用 dragDirection "dragUp" 进行滑动处理。但问题是它作为 dragDown 工作，不明白为什么。我尝试将 dragDirection 设置为 dragDown，但它按预期工作。方向处理有问题吗？

这是我的布局：

<androidx.constraintlayout.motion.widget.MotionLayout
        android:layout_width="match_parent"
        app:layoutDescription="@xml/scene"
        android:layout_height="match_parent"
        android:id="@+id/motionLayout">

    <androidx.cardview.widget.CardView
            android:id='@+id/testView'
            android:layout_height="400dp"
            android:layout_width="300dp"/>


    <ImageView
           android:layout_width="300dp"
           android:layout_height="400dp"
           android:id="@+id/imageView"
           android:src="@drawable/img"
           android:scaleType="centerInside"/>
</androidx.constraintlayout.motion.widget.MotionLayout>

你现在知道为什么我会出现这个问题吗？

Answer 1

why onSwipe does not handle correct drag event?

拖动方向由 MotionLayout 渲染引擎根据 touchAnchorId 的位置自行决定。

要解决此问题，请添加一个虚拟视图作为 touchAnchorId 并在所需方向为该视图添加滑动动画。由于我们不需要让这个虚拟视图在 UI 上可见，我们可以使用 android SDK 提供的“Space”视图作为虚拟视图。

 <Space
        android:id="@+id/space"
        android:layout_width="1dp"
        android:layout_height="1dp"
        motion:layout_constraintEnd_toEndOf="parent"
        motion:layout_constraintTop_toTopOf="parent" />

将 ConstraintLayout 依赖项添加到您的 build.gradle 文件中

dependencies {
    implementation 'androidx.constraintlayout:constraintlayout:2.0.0-beta2'
}

因此，您的布局和动作资源文件将如下所示

activity_main.xml

<androidx.constraintlayout.motion.widget.MotionLayout 
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:motion="http://schemas.android.com/apk/res-auto"
    android:id="@+id/motionLayout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    motion:layoutDescription="@xml/motionscene">

    <androidx.cardview.widget.CardView
        android:id='@+id/testView'
        android:layout_height="400dp"
        android:layout_width="300dp"/>


    <ImageView
        android:layout_width="300dp"
        android:layout_height="400dp"
        android:id="@+id/imageView"
        android:src="@drawable/abd"
        android:scaleType="centerInside"/>
    <Space
        android:id="@+id/space"
        android:layout_width="1dp"
        android:layout_height="1dp"
        motion:layout_constraintEnd_toEndOf="parent"
        motion:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.motion.widget.MotionLayout>

motionscene.xml

<MotionScene xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:motion="http://schemas.android.com/apk/res-auto">
    <Transition
        motion:constraintSetStart="@id/motion_01_cl_start"
        motion:constraintSetEnd="@id/motion_01_cl_end"
        motion:duration="300">

        <OnSwipe
            motion:touchAnchorId="@id/space"
            motion:dragDirection="dragUp"/>
    </Transition>


    <ConstraintSet android:id="@+id/motion_01_cl_start">
        <Constraint
            android:id="@+id/testView"
            android:layout_width="200dp"
            android:layout_height="250dp"

            motion:layout_constraintBottom_toBottomOf="parent"
            motion:layout_constraintStart_toStartOf="parent"
            motion:layout_constraintTop_toTopOf="parent"
            motion:layout_constraintEnd_toEndOf="parent"
            android:layout_marginTop="0dp"
            android:elevation="3dp"/>

        <Constraint
            android:id="@+id/imageView"
            android:layout_width="200dp"
            android:layout_height="250dp"

            motion:layout_constraintBottom_toBottomOf="parent"
            motion:layout_constraintStart_toStartOf="parent"
            motion:layout_constraintTop_toTopOf="parent"
            motion:layout_constraintEnd_toEndOf="parent"
            android:layout_marginTop="0dp"
            android:elevation="4dp"/>
        <Constraint
            android:id="@+id/space"
            motion:layout_constraintBottom_toBottomOf="parent"
            motion:layout_constraintStart_toStartOf="parent"
            />
    </ConstraintSet>

    <ConstraintSet android:id="@+id/motion_01_cl_end">
        <Constraint
            android:id="@+id/testView"
            android:layout_width="300dp"
            android:layout_height="300dp"
            android:elevation="10dp"
            android:layout_marginTop="100dp"
            motion:layout_constraintStart_toStartOf="parent"
            motion:layout_constraintTop_toTopOf="parent"
            motion:layout_constraintEnd_toEndOf="parent"
            />

        <Constraint
            android:id="@+id/imageView"
            android:layout_width="200dp"
            android:layout_height="290dp"
            android:elevation="25dp"
            android:layout_marginTop="40dp"
            motion:layout_constraintStart_toStartOf="parent"
            motion:layout_constraintTop_toTopOf="parent"
            motion:layout_constraintEnd_toEndOf="parent"
            />
        <Constraint
            android:id="@+id/space"
            motion:layout_constraintTop_toTopOf="parent"
            motion:layout_constraintStart_toStartOf="parent"
            />
    </ConstraintSet>
</MotionScene>

输出将类似于下面的 gif

运动布局。 OnSwipe 无法正确处理拖动事件。根本问题是什么？

Motion layout. OnSwipe doesn't handle correctly drag event. What is the root problem?

android

android-motionlayout