Fragment过度动画分析一

Sliding Fragment

介绍:该案例为传统的Fragment增加了个性化的补间动画,其效果是原有fragment向屏幕内做一定的下沉,新的fragment显示在最上层,产生层叠效果的多个fragments。
Video: http://www.youtube.com/watch?v=xbl5cxfA1n4

Source:http://developer.android.com/shareables/devbytes/SlidingFragments.zip

本文将简单分析其实现流程及原理
Step1:添加Fragment并设置点击的切换事件
首先添加一个fragment,并设置显示内容已做区别,案例中显示了一张图片,接着设置单击事件,为了使得我们单击任意位置都能触发fragment的切换动画,这
里需要为用于展示图片的fragment,显示文本的fragment以及黑色背景view都添加该事件监听器。

Step2:fragment切换实现
这里只有2个fragment,一个是用于显示图片,另一个显示文本,预期效果是单击屏幕后,图片下沉,文本显示到顶层,再次单击后则恢复原状,即,文本消失>,图片上浮。
分析这些动画的顺序和效果,图片的下沉可以通过一个组合animation来做,1.缩放,例如缩小为原图80%,2.旋转,这里的下层效果是首先图片x轴旋转40度,>然后再将旋转角度设置为0,3.添加一个半透明的遮罩,以示图片当前出于幕后状态,


文本的出现则在图片的动作完成后,通过manager动态讲其添加到画面上,这里的文本不是全屏的,否则就看不到后面的图片背景,文本的出现也可以添加动画>,这里文本出现时由下至上,消失时由上至下。

private void switchFragments () {
        if (mIsAnimating) {
            return;
        }
        mIsAnimating = true;
        if (mDidSlideOut) {
            mDidSlideOut = false;
            getFragmentManager().popBackStack();
        } else {
            mDidSlideOut = true;

            AnimatorListener listener = new AnimatorListenerAdapter() {
                @Override
                public void onAnimationEnd(Animator arg0) {
                    FragmentTransaction transaction = getFragmentManager().beginTransaction();
                    transaction.setCustomAnimations(R.animator.slide_fragment_in, 0, 0,
                            R.animator.slide_fragment_out);
                    transaction.add(R.id.move_to_back_container, mTextFragment);
                    transaction.addToBackStack(null);
                    transaction.commit();
                }
            };
            slideBack (listener);
        }
    }

  

原文地址:https://www.cnblogs.com/avenwu/p/3372736.html