片段上的约束布局关键帧动画

Question

我最近看到了这个视频Keyframe Animations with ConstraintLayout and ConstraintSet，看起来很酷。所以按照blog post 中显示的步骤以这种方式实施。博客和我的用例之间只有一个区别。我正在使用片段。我认为理论上实现应该是这样的。这是我在两个constrainSet() 上为关键帧动画所做的工作

ConstrainLayout 初始（可以说是 A 点）

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout 
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/fragment_root">


<ImageView
    android:id="@+id/imageView"
    android:layout_width="250dp"
    android:layout_height="250dp"
    android:layout_marginBottom="8dp"
    android:layout_marginEnd="8dp"
    android:layout_marginStart="16dp"
    android:layout_marginTop="8dp"
    android:src="@android:drawable/ic_menu_camera"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="@+id/textView"
    app:layout_constraintTop_toTopOf="parent"
    app:layout_constraintVertical_bias="0.687" />

<TextView
    android:id="@+id/textView"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginBottom="8dp"
    android:layout_marginTop="8dp"
    android:gravity="center_vertical"
    android:padding="10dp"
    android:text="@string/missing_permission"
    android:textSize="18sp"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintTop_toBottomOf="@+id/imageView"
    app:layout_constraintVertical_bias="0.476" />

<Button
    android:id="@+id/setting_button"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginBottom="8dp"
    android:layout_marginEnd="8dp"
    android:layout_marginStart="8dp"
    android:layout_marginTop="76dp"
    android:text="@string/settings"
    app:layout_constraintBottom_toTopOf="@+id/imageView"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintHorizontal_bias="0.0"
    app:layout_constraintStart_toStartOf="@+id/imageView"
    app:layout_constraintTop_toTopOf="parent"
    app:layout_constraintVertical_bias="0.511" />

</android.support.constraint.ConstraintLayout>

ConstrainLayout初始（B点目的地，布局的最终​​样子）

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout 
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:id="@+id/fragment_root">

<ImageView
    android:id="@+id/imageView"
    android:layout_width="150dp"
    android:layout_height="150dp"
    android:layout_marginBottom="8dp"
    android:layout_marginEnd="8dp"
    android:layout_marginStart="8dp"
    android:layout_marginTop="136dp"
    android:src="@android:drawable/ic_menu_camera"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent"
    app:layout_constraintVertical_bias="0.0" />

<TextView
    android:id="@+id/textView"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginEnd="8dp"
    android:layout_marginStart="8dp"
    android:gravity="center_vertical"
    android:padding="10dp"
    android:text="@string/missing_permission"
    android:textSize="18sp"
    app:layout_constraintBottom_toBottomOf="@+id/imageView"
    app:layout_constraintEnd_toEndOf="@+id/imageView"
    app:layout_constraintStart_toStartOf="@+id/imageView"
    app:layout_constraintTop_toBottomOf="parent"
    app:layout_constraintVertical_bias="0.858" />

<Button
    android:id="@+id/setting_button"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginBottom="164dp"
    android:layout_marginEnd="8dp"
    android:layout_marginStart="8dp"
    android:text="@string/settings"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="@+id/imageView"
    app:layout_constraintStart_toStartOf="@+id/imageView" />

</android.support.constraint.ConstraintLayout>

这是我的关键帧转换代码片段

var goToSettings: () -> Unit = {}

private lateinit var root: ConstraintLayout

override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle?): View?
        = inflater.inflate(R.layout.nocamera_permission_fragment_alt, container, false).also {
    root = it.findViewById(R.id.fragment_root)
}


override fun onViewCreated(view: View, savedInstanceState: Bundle?) =
        super.onViewCreated(view, savedInstanceState).run {
            setting_button.setOnClickListener { goToSettings() }

            val constraintSet = ConstraintSet()
            constraintSet.clone(activity, R.layout.nocamera_permission_fragment)

            val transition = ChangeBounds().apply {
                interpolator = OvershootInterpolator()
                duration = 1000
            }

            TransitionManager.beginDelayedTransition(root, transition)
            constraintSet.applyTo(root)
        }

我对布局没有影响，应用程序在运行后呈现最终布局R.layout.nocamera_permission_fragment。有人知道吗？

Answer 1

您应用过渡太快（视图甚至还没有附加到窗口并且没有布局传递），所以延迟过渡被丢弃。尝试使用post 而不是run。