Android共享元素转换：英雄视图在其他元素前面绘制

Question

请看这段显示共享元素活动转换的视频。这是从列表活动到详细信息活动的过渡。

[视频链接不再工作]

如您所见，imageview绘制在选项卡前面。

我所期望的是选项卡在imageview上以字体绘制，并在整个转换过程中淡出（以便在动画结束时它们消失）。

唯一有效的方法是将windowSharedElementsUseOverlay设置为true，但这会产生其他不好的效果，因此这似乎不是一个选项。

最常见的建议方法是在转换本身中包含选项卡，但问题是选项卡不在详细活动中，因此无法共享。

代码：我按如下方式启动详细信息活动：

options = ActivityOptionsCompat.makeSceneTransitionAnimation(activity, pairs);
ActivityCompat.startActivity(activity, subActivity, options.toBundle());

Answer 1

我的呼叫活动中同时有一个tablayout和一个工具栏，每次我进行转换时，图像都会出现在tablayout和工具栏的顶部，使转换看起来不整洁。

我非常优雅地修复了这个问题，只是在我的调用活动中添加了一个“虚拟”桌面和一个“虚拟”工具栏。“虚拟”元素不可见，所以它不会影响我调用的活动的布局，但是如果你把它们添加进来，过渡效果会正常工作。

                <android.support.v7.widget.Toolbar
                    android:id="@+id/toolbar2"
                    android:transitionName="toolbar"
                    android:visibility="gone"
                    android:layout_width="match_parent"
                    android:layout_height="?attr/actionBarSize" />

                <android.support.design.widget.TabLayout
                    android:id="@+id/sliding_tabs"
                    android:layout_width="match_parent"
                    android:layout_height="60dp"
                    android:visibility="gone"
                    android:transitionName="tab"
                    ></android.support.design.widget.TabLayout>

然后，我在过渡中添加了tablayout和工具栏作为一对：

        Pair<View, String> p4 = Pair.create(getActivity().findViewById(R.id.sliding_tabs), "tab");
        Pair<View, String> p5 = Pair.create(getActivity().findViewById(R.id.toolbar), "toolbar");
        Bundle options = ActivityOptionsCompat.makeSceneTransitionAnimation(getActivity(), p1, p2, p3, p4, p5).toBundle();

Answer 2

您应该尝试以下操作：在退出的活动中，调用getWindow（）。setExitTransition（空）；

在输入活动时，调用getWindow（）. setEnTransition（null）；

它将防止退出活动的淡出和进入活动的淡入，这消除了明显的闪烁效果，使过渡平滑。

Answer 3

我相信您可能需要从过渡动画中排除而不是包括选项卡布局。

因此，在列表活动的onCreate中，包括：

Transition fade = new Fade();
fade.excludeTarget(R.id.tab, true); // use appropriate id for you tab
getWindow().setExitTransition(fade);
getWindow().setEnterTransition(fade); // try getWindow().setReenterTransition(fade); instead

一定要看看Alex Lockwood关于如何防止状态栏和导航栏在活动场景动画转换期间设置动画的回答？在那里，他对这个话题作了更深入、更深入但易于理解的解释。您可能还想考虑在该帖子中添加/实现解决方案。