如何制作从 ViewPager 到另一个 Fragment 的共享过渡动画？

Question

我有下一个情况。 Activity[FragmentWithPager[PageWithGrid]] 我想制作从 list item 到 DetailFragment 的传统动画，但我不知道我做错了什么。我已将相同的 transitionName 添加到 list item 和 fragment detail 布局中的视图，并尝试使用以下代码制作过渡动画。

val fragmentTransaction = supportFragmentManager.beginTransaction()
transitionItems.forEach { view ->
    fragmentTransaction.addSharedElement(view, view.transitionName)
}

val fragment = DetailFragment()
val transitionSet = TransitionSet().apply {
     addTransition(ChangeTransform())
     addTransition(ChangeClipBounds())
     addTransition(ChangeBounds())
}
fragment.sharedElementEnterTransition = transitionSet
fragment.sharedElementReturnTransition = transitionSet

fragmentTransaction.replace(R.id.root, fragment)
fragmentTransaction.addToBackStack(null)
fragmentTransaction.commit()

Answer 1

实现共享转换的步骤是

制作过渡动画。
您的 xml 视图中的转换名称
添加带有 fragmentTransition 对象的 SharedElement 以及目标视图和要执行的转换。

可以参考一下1, , 3

Answer 2

共享元素转换 API 有点棘手并且有一些未定义的行为，即使您可以设法实现它，转换也不会很顺利，这是我实现的解决方法几个月前：

不是直接在 ViewPagerFragment 中托管 GridFragment，而是添加另一个 Fragment 作为容器：

Activity[ViewPagerFragment[ContainerFragment[GridFragment]]]

现在您有一个简单的 Fragment 到 Fragment Transition 可以顺利运行。

这是my github repo

中的示例代码

Screen Shot

Answer 3

我发现 google 这个示例非常有用，它以非常漂亮的方式处理片段 google transition sample

希望对你有帮助

Answer 4

我发现我做错了什么。 如果您使用 pager 切换片段，列表和页面中的每个项目的转换名称必须是唯一的。当我为每个转换名称添加页面和列表索引时，动画开始工作。

example project

如何制作从 ViewPager 到另一个 Fragment 的共享过渡动画？

How to make shared transition animation from ViewPager to another Fragment?

android

android-fragments

android-viewpager

kotlin

android-transitions