Material Design - 页面切换动画
bryan-minear
项目中为了页面就切换能够更加友好，通常会给切换过程添加上动画。页面切换动画的方法最早是在 api 2.0 的时候加入的。今天我们来了解，目前所有可以实现页面切换的方法。
首先还是先说明一下设置动画的 xml 文件怎么写，虽然多数人都已经对这个熟记于心，但是对于不怎么用动画的人而言，实在是很容易遗忘。
用于页面切换的动画文件需要写在 res/anim 中，这个目录新工程是需要手动创建的。之后我们需要在这个目录下创建页面划入和滑出的动画文件。我们暂时以左进右出为例来说明代码。
在 anim 文件下创建的 xml 文件是以<set/>为根节点的，在这个节点下，我们可以添加<translate/>、<alpha/>、<scale/>、<rotate/>等常见的动画。对于页面而言的话，其实有前两种就够了。如果需要更详细的内容，不妨看看官网的介绍：链接
总之，这里是我的 xml 文件：
<!-- in_from_left.xml 从屏幕左边进入 -->
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate
android:duration="@integer/anim_activity_duration"
android:fromXDelta="-100%"
android:interpolator="@android:anim/accelerate_interpolator"
android:toXDelta="0" />
<alpha
android:duration="@integer/anim_activity_duration"
android:fromAlpha="1"
android:interpolator="@android:anim/accelerate_interpolator"
android:toAlpha="1" />
</set>
<!-- out_to_right.xml 从屏幕右边退出 -->
<set xmlns:android="http://schemas.android.com/apk/res/android" >
<translate
android:duration="@integer/anim_activity_duration"
android:fromXDelta="0%p"
android:interpolator="@android:anim/accelerate_interpolator"
android:toXDelta="100%p" />
<alpha
android:duration="@integer/anim_activity_duration"
android:fromAlpha="1"
android:interpolator="@android:anim/accelerate_interpolator"
android:toAlpha="1" />
</set>
下面，我们来看看切换的实现方法。
方法一
这应该是目前适配了安卓 4.0 的最常见的方法：Activity#overridePendingTransition(int enterAnim, int exitAnim)。文档中对于这个方法的说明十分简单，只需要在Activity#startActivity或者Activity.finish之后调用就可以了。
那么不如就来试试。在 MainActivity 中添加按钮，跳转到 TargetActivity 中去。
MainActivity:
@Override
public void onClick(View view){
switch (view.getId()) {
case R.id.main_btn_1:
startActivity(new Intent(MainActivity.this,TargetActivity.class));
MainActivity.this.overridePendingTransition(R.anim.in_from_left, R.anim.out_to_right);
break;
}
}
TargetActivity:
@Override
public void onBackPressed() {
super.onBackPressed();
overridePendingTransition(R.anim.in_from_right,R.anim.out_to_left);
}
可以看到，最简单的切换动画就实现了，一点也不复杂。如果是项目中使用，只要封装到 BaseActivity 中，就可以应用到所有页面上。
GIF.gif
需要注意的是，如果没有在 onBackPressed() 或者页面其他调用 finish() 的地方调用 overridePendingTransition，页面销毁的时候是没有动画的，可以参考下面的效果：
GIF.gif
方法二
在 AppTheme 中做文章。Android 的内部属性太多，如果不是特别需要一般也不会去找这样一条属性来实现相应效果。而对于 Activity 而言，这里确实有这样一个属性可以使用。
<!-- Application theme. -->
<style name="AppTheme" parent="AppBaseTheme">
<!-- All customizations that are NOT specific to a particular API-level can go here. -->
<item name="android:windowNoTitle">true</item>
<item name="android:windowAnimationStyle">@style/ActivityAnim</item>
</style>
<style name="ActivityAnim">
<item name="android:activityOpenEnterAnimation">@anim/in_from_right</item>
<item name="android:activityOpenExitAnimation">@anim/out_to_left</item>
<item name="android:activityCloseEnterAnimation">@anim/in_from_left</item>
<item name="android:activityCloseExitAnimation">@anim/out_to_right</item>
</style>
这样设置好之后，所有页面的切换效果就都变成了@style/ActivityAnim设置的样子，如果有特殊页面需要其他的动画，可以利用方法一调用方法跳转，这样的页面最好把入口方法统一起来，以免之后开发的人忘记这个页面的动画是不一样的。
方法三
上面介绍的都是可以支持 android 4.0 以上机型的方法，但是之后这种是 5.0 以上版本的方法。如果应用需要在 5.0 以下版本也实现动画，就不建议使用这种方法。
** 3.1 动画说明
Transition API 主要描述了页面四种状态的动画，分别为：退出（exit），进入（enter），返回（return）和再次进入（reenter）。我们以 A 页面跳转到 B 页面为例说明上面的动画：
Activity A的退出变换（exit transition）决定了在A调用B的时候，A中的View是如何播放动画的。
Activity B的进入变换（enter transition）决定了在A调用B的时候，B中的View是如何播放动画的。
Activity B的返回变换（return transition）决定了在B返回A的时候，B中的View是如何播放动画的。
Activity A的再次进入变换（reenter transition）决定了在B返回A的时候，A中的View是如何播放动画的。
** 3.2 动画使用
要在应用中使用 Transition API 需要在应用动画的两个 Activity 中设定 Window.FEATURE_ACTIVITY_TRANSITIONS
和 Window.FEATURE_CONTENT_TRANSITIONS。
//通过主题设定
<item name="android:windowContentTransitions">true</item>
//通过代码设定，需要在 setContentView 之前调用
getWindow().requestFeature(Window.FEATURE_CONTENT_TRANSITIONS);
然后，我们可以通过下面的方法使用动画(这些代码需要在 setContentView 之前调用)：
Activity.getWindow().setExitTransition(Transition transition)
Activity.getWindow().setEnterTransition(Transition transition)
Activity.getWindow().setReturnTransition(Transition transition)
Activity.getWindow().setReenterTransition(Transition transition)
在 TargetActivity 中我添加了下面的动画：
getWindow().requestFeature(Window.FEATURE_CONTENT_TRANSITIONS);
Slide slide = new Slide();
slide.setDuration(1000);
getWindow().setReturnTransition(slide);
getWindow().setEnterTransition(slide);
setContentView(R.layout.activity_target);
可以看到效果：
GIF.gif
上面的效果中，ActionBar 和 NavigationBar 都有了动画，一般情况下我们是不需要的，这里我们可以在 Transition 中去除这两个 View，使它们不执行动画。
slide.excludeTarget(android.R.id.statusBarBackground,true);
slide.excludeTarget(android.R.id.navigationBarBackground,true);
上面的方法对于导航栏已经生效了，但是不知道为什么，对于顶部的菜单栏并没有失效，经过一番搜索也没有找到其他可以用的属性，不过对于开发影响也不是很大，毕竟现在没什么应用会用这个默认的顶部菜单栏。但是如果有人知道这里应该如何屏蔽这个布局的动画，请务必私信我，感恩。
Fragment 的切换动画
对于 Fragment 而言，就比较简单了，在 FragmentTransaction 类中有这样的方法：
/**
* Set specific animation resources to run for the fragments that are
* entering and exiting in this transaction. These animations will not be
* played when popping the back stack.
*/
public abstract FragmentTransaction setCustomAnimations(@AnimRes int enter,
@AnimRes int exit);
/**
* Set specific animation resources to run for the fragments that are
* entering and exiting in this transaction. The <code>popEnter</code>
* and <code>popExit</code> animations will be played for enter/exit
* operations specifically when popping the back stack.
*/
public abstract FragmentTransaction setCustomAnimations(@AnimRes int enter,
@AnimRes int exit, @AnimRes int popEnter, @AnimRes int popExit);
在调用 commit() 方法提交事务之前，设置自定义的动画就可以了，具体的细节操作这里就不再说明了，基本和 Activity.overridePendingTransition 是一样的。
同时，对于 API 21 以上，我们可以直接在 Fragment 中找到这样的方法：
setExitTransition(Transition transition)
setEnterTransition(Transition transition)
setReturnTransition(Transition transition)
setReenterTransition(Transition transition)
用法同 Activity。
以上。
