【问题标题】:Shared elements and content transitions in FragmentsFragments 中的共享元素和内容转换
【发布时间】:2015-04-26 02:59:04
【问题描述】:

我有以下问题:

我正在尝试从 Fragment A 过渡到 Fragment B。这些片段之间有一个共享元素,形式为 Button 和其他一些 View's(请参阅布局)。

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:flipper="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <com.mypackage.view.IndicatorViewFlipper
        android:transitionGroup="true"
        android:id="@+id/intro_viewflipper"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        flipper:indicatorColor="@color/white"
        flipper:indicatorMargin="4dp"
        flipper:indicatorRadius="4dp"
        flipper:indicatorBarMargin="104dp"/>

    <Button
        android:id="@+id/account_create_btn"
        style="?android:attr/borderlessButtonStyle"
        android:textColor="@color/white"
        android:layout_width="match_parent"
        android:layout_height="@dimen/button_standard_height"
        android:layout_above="@+id/txt_already_account"
        android:background="@drawable/button_yellow_selector"
        android:transitionName="create_account"
        android:text="@string/account_create_btn"
        android:textSize="24sp"
        android:textAllCaps="false" />

    <TextView
        android:id="@+id/txt_already_account"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:layout_above="@+id/account_login_btn"
        android:layout_marginTop="24dp"
        android:text="@string/account_welcome_already_account"/>

    <Button
        android:id="@+id/account_login_btn"
        style="?android:attr/borderlessButtonStyle"
        android:layout_width="match_parent"
        android:layout_height="@dimen/button_standard_height"
        android:layout_marginTop="8dp"
        android:layout_alignParentBottom="true"
        android:transitionName="login"
        android:background="@drawable/button_blue_selector"
        android:textColor="@color/white"
        android:textSize="24sp"
        android:textAllCaps="false"
        android:text="@string/account_create_login_btn"/>

</RelativeLayout>

我正在尝试做的是让Fragment中的所有内容除了共享元素,过渡(向左滑动)并让所有内容形成Fragment B 共享元素除外从右侧滑入。在此内容转换期间,我希望共享元素保持在其原始位置,直到内容转换完成,然后让它滑动到 Fragment B 中的新位置。

最后一个行为是它出错的地方:一旦我在Fragment A 中开始退出转换,共享元素就会消失并从右侧滑入Fragment B 的内容转换。共享元素的行为是如果我不添加任何退出/进入转换,则正确。

代码(在FragmentA):

Fragment fragment = MyFragment.newInstance();
FragmentTransaction fragmentTransaction = getFragmentManager().beginTransaction();
fragmentTransaction.hide(this);
fragmentTransaction.add(R.id.frame_container, fragment, fragment.getClass().getSimpleName());
fragmentTransaction.addSharedElement(sharedElement, sharedElementTag);
Transition sharedElementTransaction = TransitionInflater.from(getActivity()).inflateTransition(android.R.transition.move);
sharedElementTransaction.setStartDelay(400);
fragment.setSharedElementEnterTransition(sharedElementTransaction);
setExitTransition(new Slide(Gravity.LEFT).setDuration(200));
fragment.setEnterTransition(new Slide(Gravity.RIGHT).setDuration(200));

谁能帮我获得想要的行为?

更新:

我已经做了一个工作,几乎可以做到我想要在我的视图上使用animate() 来滑动/淡化它们,并在完成此动画时触发共享元素事务:

Transition sharedElementTransition = TransitionInflater.from(getActivity()).inflateTransition(android.R.transition.move);
sharedElementTransition.setStartDelay(400);
fragment.setSharedElementEnterTransition(sharedElementTransition);
setSharedElementReturnTransition(sharedElementTransition);

mLoginBtn.animate()
   .x(-mLoginBtn.getWidth())
   .setDuration(400)
   .start();

viewFlipper.animate()
   .x(-viewFlipper.getWidth())
   .setDuration(400)
   .setListener(new AnimatorListenerAdapter() {
   @Override
   public void onAnimationEnd(Animator animation) {
        super.onAnimationEnd(animation);
        transaction.commit();
   }
})
.start();

fragment.setEnterSharedElementCallback(new SharedElementCallback() {
   @Override
   public void onSharedElementStart(List<String> sharedElementNames, List<View> sharedElements, List<View> sharedElementSnapshots) {
   super.onSharedElementStart(sharedElementNames, sharedElements, sharedElementSnapshots);
   viewFlipper.animate()
           .x(0)
           .setDuration(400)
           .setListener(null)
           .start();

   mLoginBtn.animate()
           .x(0)
           .setDuration(400)
           .start();
   });

这个解决方案的问题是我不能在被调用的FragmentViews 中滑动,所以我现在只是淡入Views

【问题讨论】:

  • 愚蠢的问题,但你有没有看过scenes。你可以给出相同的元素ID,然后可以为所需元素提供(或删除)转换。
  • @Droidekas 我看过场景,但我不知道如何使用它们来解决我的问题......我已经做了一个几乎可以满足我想要的工作,我'将用当前的解决方案更新我的问题。但仍在寻找一种使用 Transitions 框架的方法。
  • 如果您可以详细说明为什么需要两个片段中的两个不同按钮实例,如果这两个按钮确实将向用户共享一个视觉“视图”,这可能有助于讨论。如果用户只看到一个按钮......那么为什么不拥有一个 Button 实例(由 Activity 维护,或者可能是另一个单一用途的片段),然后让您的两个内容片段以某种方式获取对它的引用?
  • 我使用了两个Fragment,因为我希望每个Fragment负责Button的行为,这在两个Fragment中是不同的,并且可以轻松地为两个屏幕进行布局,除了共享按钮完全不同。如果我将 Button 放置在 Activity 的布局中,我将很难获得正确的布局。但如果这是获得共享元素所需行为的唯一方法,那么我可能会试一试。
  • 您能否提供该问题的视频?这将有助于更好地了解您要实现的目标以及问题所在

标签: android android-transitions


【解决方案1】:

如果您只需要在按钮静止时为片段设置动画,您可以将按钮移动到 Activity 并为片段设置动画。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2023-04-03
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2021-05-03
    • 1970-01-01
    • 1970-01-01
    • 2015-08-06
    相关资源
    最近更新 更多