FragmentTransaction 动画滑入顶部 [英] FragmentTransaction animation to slide in over top

问题描述

我正在尝试使用 FragmentTransaction.setCustomAnimations 实现以下效果.

I am trying to achieve the following effect using FragmentTransaction.setCustomAnimations.

1. 正在显示片段 A
2. 用片段 B 替换片段 A.在替换过程中片段 A 应保持可见.片段 B 应从右侧滑入.片段 B 应该滑入片段 A 的顶部.

我在动画设置中获取幻灯片没有问题.我的问题是我无法弄清楚如何在动画幻灯片运行时让片段 A 保持原样并位于片段 B 下.无论我做什么，似乎片段 A 都在上面.

I have no problem getting the slide in animation setup. My problem is that I cannot figure out how to make Fragment A stay where it is and be UNDER Fragment B while the slide in animation is running. No matter what I do it seems that Fragment A is on top.

我怎样才能做到这一点?

How can I achieve this?

这里是 FragmentTransaction 代码:

Here is the FragmentTransaction code:

FragmentTransaction ft = getSupportFragmentManager().beginTransaction();
ft.setCustomAnimations(R.anim.slide_in_right, R.anim.nothing, R.anim.nothing,
    R.anim.slide_out_right);
ft.replace(R.id.fragment_content, fragment, name);
ft.addToBackStack(name);
ft.commit();

如您所见，我为out"动画定义了一个动画 R.anim.nothing，因为我实际上不希望片段 A 除了在事务期间停留在原处之外做任何其他事情.

As you can see I have defined an animation R.anim.nothing for the "out" animation because I actually don't want Fragment A to do anything other than just stay where it is during the transaction.

这里是动画资源:

slide_in_right.xml

slide_in_right.xml

<translate xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="@android:integer/config_mediumAnimTime"
    android:fromXDelta="100%p"
    android:toXDelta="0"
    android:zAdjustment="top" />

nothing.xml

nothing.xml

<alpha xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="@android:integer/config_mediumAnimTime"
    android:fromAlpha="1.0"
    android:toAlpha="1.0"
    android:zAdjustment="bottom" />

推荐答案

我找到了一个适合我的解决方案.我最终使用了带有 FragmentStatePagerAdapter 的 ViewPager.ViewPager 提供滑动行为并且 FragmentStatePagerAdapter 在片段中交换.实现在传入页面下方"可见页面效果的最后一个技巧是使用 PageTransformer.PageTransformer 覆盖了 ViewPager 在页面之间的默认转换.下面是一个 PageTransformer 示例，它在左侧页面上实现了平移和少量缩放的效果.

I found a solution which works for me. I ended up using a ViewPager with a FragmentStatePagerAdapter. The ViewPager provides the swiping behavior and the FragmentStatePagerAdapter swaps in the fragments. The final trick to achieve the effect of having one page visible "under" the incoming page is to use a PageTransformer. The PageTransformer overrides the ViewPager's default transition between pages. Here is an example PageTransformer that achieves the effect with translation and a small amount of scaling on the left-hand side page.

public class ScalePageTransformer implements PageTransformer {
    private static final float SCALE_FACTOR = 0.95f;

    private final ViewPager mViewPager;

    public ScalePageTransformer(ViewPager viewPager) {
            this.mViewPager = viewPager;
    }

    @SuppressLint("NewApi")
    @Override
    public void transformPage(View page, float position) {
        if (position <= 0) {
            // apply zoom effect and offset translation only for pages to
            // the left
            final float transformValue = Math.abs(Math.abs(position) - 1) * (1.0f - SCALE_FACTOR) + SCALE_FACTOR;
            int pageWidth = mViewPager.getWidth();
            final float translateValue = position * -pageWidth;
            page.setScaleX(transformValue);
            page.setScaleY(transformValue);
            if (translateValue > -pageWidth) {
                page.setTranslationX(translateValue);
            } else {
                page.setTranslationX(0);
            }
        }
    }

}

这篇关于FragmentTransaction 动画滑入顶部的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！