1

我正在尝试使用共享元素在片段之间实现一些不错的转换，这就是我想要实现的目标：

在此处输入图像描述

当我从片段 1切换到片段 2时：

  • 片段 1淡出
  • 徽标移动到左上角
  • 片段 2来自底部。

当我从片段 2切换到片段 3时：

  • 片段 2淡出
  • 标志“不动”
  • 标题 1向左移动
  • 标题2来自右边
  • 片段 3来自底部

这是片段 1的设置：

Fagment1.java：

fragment.setExitTransition("fade"); //parameter shortened for readability

XML:

<ImageView [...]
    android:id="@+id/octopuss"
    android:transitionName="@string/octopuss"/>

这是片段 2的设置：

片段2.java：

fragment3.setEnterTransition("slide_bottom");
fragment3.setSharedElementEnterTransition("move");
fragment3.setExitTransition("fade");

XML:

<ImageView [...]
    android:transitionName="@string/octopuss"/>

<TextView [...]
    android:transitionName="title1"
    android:id="@+id/title1" />

在 Activity 中调用片段 2：

FragmentTransaction ft = getSupportFragmentManager().beginTransaction()
    .replace(R.id.fullscreen_content, fragment2)
    .addToBackStack("connection_transaction");
if(Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP)     
    ft.addSharedElement(findViewById(R.id.octopuss), getString(R.string.octopuss));
ft.commit();

这是片段 3的设置：

片段3.java：

fragment3.setEnterTransition("slide_bottom");
fragment3.setSharedElementEnterTransition("slide_right");

XML:

<ImageView [...]
    android:transitionName="@string/octopuss"/>

<TextView [...]
    android:transitionName="title1"/>

在活动中调用fragmen 3：

FragmentTransaction ft = getSupportFragmentManager().beginTransaction()
    .replace(R.id.fullscreen_content, fragment3)
    .addToBackStack("preferences_transaction");
if(Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP)
    ft.addSharedElement(findViewById(R.id.title1), "title1");
ft.commit();

片段 1和片段 2之间的每个过渡都非常有效。

但是当我调用片段 3时，每个片段都会开始它的 enterTransition\exitTansition ，就像它们根本没有共享元素一样：

  • 标题 1 与片段 2一起淡出
  • 标题 2 来自底部和片段 3

有人可以帮我找出原因吗？我错过了什么？

4

1 回答 1

1

这变成了一个冗长的答案：解释为什么它不起作用以及如何使它起作用。

问题

我认为这里对于共享元素的构成及其工作方式存在一些混淆。

请记住，基本思想是您正在从一个屏幕（活动或片段）移动到另一个屏幕，并且共享元素代表两个屏幕上都存在的东西。为了连续性和更平滑的过渡，您希望该项目从它在第一个屏幕上的位置平滑地更改到第二个屏幕上的位置。

共享元素不仅仅是在过渡期间独立于布局其余部分移动的项目。

说了这么多；在这个例子中，第一个大的中央标志变成角落里的小标志的过渡是共享元素过渡的一个很好的例子。

第二个并不是真正的共享元素转换。我不确定该行fragment3.setSharedElementEnterTransition("slide_right");包含什么（为了清楚起见，我认为您将其缩写）但我怀疑它在您的应用程序运行时被忽略，因为它不是有效的共享元素转换。

告诉共享元素“向右滑动”是没有意义的，因为根据定义，元素移动的方向取决于其对应元素的位置；它会移动到那里，无论发生在哪个方向。

Title 1 和 Title 2 之间的实际共享元素转换看起来一点也不像，因为它们在同一个地方的大小相同，它们只会呆在那里。

一切都没有丢失

使用共享元素过渡来完成这项工作的方法是将标题 1 和标题 2 放在两个片段中并添加两个共享元素。在一个片段中，标题 1 将处于正常位置，而标题 2 将隐藏在屏幕右侧。在另一个标题 2 将处于正常位置，标题 1 将隐藏在屏幕左侧。

对于您的屏幕外 TextViews 使用android:translationX="-86dp"（或其他一些数字将其定位在屏幕的左侧或右侧）。

注意事项：您不会在布局预览中看到 translationX 属性的效果，只有在您运行应用程序时。

确保为title1 和title2 匹配适当的transitionNames。

于 2016-01-13T17:48:10.927 回答