Sliding Fragment

介绍：该案例为传统的Fragment增加了个性化的补间动画，其效果是原有fragment向屏幕内做一定的下沉，新的fragment显示在最上层，产生层叠效果的多个fragments。

Video:

Source:

本文将简单分析其实现流程及原理

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);        }    }