MotionLayout和ConstraintLayout无法围绕孩子的身高进行动画制作

时间:2018-08-22 18:08:07

标签: android android-recyclerview android-constraintlayout android-transitions android-motionlayout

在RecyclerView中播放MotionLayouts时,我注意到,如果MotionLayouts的高度发生变化,MotionLayouts不会对其子对象进行动画处理。

重现此行为的简单方法是使用以下布局:

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <android.support.constraint.motion.MotionLayout
        android:id="@+id/motion_container"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@color/colorPrimary"
        app:layoutDescription="@xml/scene">

        <View
            android:id="@+id/child"
            android:layout_width="0dp"
            android:layout_height="200dp"
            android:background="@color/colorAccent"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent"/>

    </android.support.constraint.motion.MotionLayout>

</FrameLayout>

以及带有OnClick触发器的关联MotionScene:

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

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

        <OnClick
            motion:target="@id/child"
            motion:mode="toggle"/>

    </Transition>

    <ConstraintSet android:id="@+id/start">

        <Constraint
            android:id="@id/child"
            android:layout_height="200dp"/>

    </ConstraintSet>

    <ConstraintSet android:id="@+id/end">

        <Constraint
            android:id="@id/child"
            android:layout_height="400dp"/>

    </ConstraintSet>

</MotionScene>

哪个会给出以下结果:

Behaviour demonstration

如您所见,过渡开始后,MotionLayout的高度将设置为最终的预期高度,使其蓝色背景可见,直到子视图完成其自身的高度过渡并完全重叠。

如果您尝试实现消耗项动画,在RecyclerView中也会发生同样的事情。

是否有一种方法可以使MotionLayout在过渡期间完全适合其子代的高度,或者这样做的成本效益太高?

1 个答案:

答案 0 :(得分:1)

避免调整MotionLayout的边界大小。取而代之的是,使其更大,并仅为子对象的大小设置动画。您可以使空白区域透明,并将触摸事件传递给基础视图。

来源和示例: https://medium.com/vrt-digital-studio/picture-in-picture-video-overlay-with-motionlayout-a9404663b9e7