Question

我正在尝试通过MotionLayout创建折叠的视图动画。我想使视图在向下滚动时折叠，并且直到完全向上滚动才显示。我的动画现在不起作用（video）。此外，直到第一次单击，我的回收者视图才可见。我究竟做错了什么？谢谢

MainActivity布局：

<androidx.constraintlayout.motion.widget.MotionLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/gray_more_white"

app:layoutDescription="@xml/collapsing_toolbar"
tools:showPaths="true">

<include
    android:id="@+id/include"
    layout="@layout/toolbar"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent" />

<com.github.florent37.shapeofview.shapes.ArcView
    android:id="@+id/header_view"
    android:layout_width="0dp"
    android:layout_height="100dp"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    app:layout_constraintTop_toBottomOf="@id/include"
    app:shape_arc_cropDirection="outside"
    app:shape_arc_height="20dp"
    app:shape_arc_position="bottom">

    <View
        android:id="@+id/header"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@color/colorPrimaryDark" />

</com.github.florent37.shapeofview.shapes.ArcView>

<androidx.swiperefreshlayout.widget.SwipeRefreshLayout
    android:id="@+id/swipe_view"
    android:layout_width="0dp"
    android:layout_height="0dp"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toBottomOf="@id/include">

    <androidx.recyclerview.widget.RecyclerView
        android:id="@+id/recyclerView"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

</androidx.swiperefreshlayout.widget.SwipeRefreshLayout>

</androidx.constraintlayout.motion.widget.MotionLayout>

MotionScene：

<MotionScene
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:motion="http://schemas.android.com/apk/res-auto">

<Transition
    app:constraintSetEnd="@id/end"
    app:constraintSetStart="@id/start"
    app:duration="1000">

    <OnSwipe
        app:touchAnchorId="@id/swipe_view"
        app:dragDirection="dragDown"
        app:touchAnchorSide="top"
        app:moveWhenScrollAtTop="true"/>
</Transition>

<ConstraintSet android:id="@+id/start">
    <Constraint
        android:id="@id/header_view"
        android:layout_width="0dp"
        android:layout_height="100dp"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toBottomOf="@id/include">
    </Constraint>
</ConstraintSet>

<ConstraintSet android:id="@+id/end">
    <Constraint
        android:id="@id/header_view"
        android:layout_width="0dp"
        android:layout_height="0dp"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toBottomOf="@id/include">
    </Constraint>
</ConstraintSet>

</MotionScene>

Answer 1

因此，经过多次尝试，我设法修复了该错误。

1）动画的触发器（在我的例子中为RecyclerView）必须与动画的目标相关。并且不一定直接（在我的情况下，RecyclerView和标头通过Space连接）

2）动画的触发器或链接它们的元素不应与动画所指向的元素重叠。（在我的情况下，Space应该使用constraintBottom_toBottomOf =“ @ id /标头” + marginBottom而不是constraintTop_toBottomOf =“ @ id /标头”。

所以，这是最终的布局。

<androidx.constraintlayout.motion.widget.MotionLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/gray_more_white"
app:layoutDescription="@xml/catalog_motion">

<com.github.florent37.shapeofview.shapes.ArcView
    android:id="@+id/header"
    android:layout_width="0dp"
    android:layout_height="100dp"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    app:layout_constraintTop_toBottomOf="@+id/include"
    app:shape_arc_cropDirection="outside"
    app:shape_arc_height="20dp"
    app:shape_arc_position="bottom">

    <View
        android:id="@+id/header_view"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@color/colorPrimaryDark" />

</com.github.florent37.shapeofview.shapes.ArcView>

<Space
    android:id="@+id/space"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginBottom="100dp"
    app:layout_constraintBottom_toBottomOf="@id/header"
    app:layout_constraintStart_toStartOf="@id/header"
    app:layout_constraintEnd_toEndOf="@id/header"/>

<androidx.recyclerview.widget.RecyclerView
    android:id="@+id/recyclerView"
    android:layout_width="0dp"
    android:layout_height="0dp"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toBottomOf="@+id/space" />

<include
    android:id="@+id/include"
    layout="@layout/toolbar"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent"/>

MotionLayout没有动画

1 个答案: