AndroidMaterialDesign动画之Activity Transitions

姑且称之为：转场动画，过度动画。

该动画的场景：1，视图的切换。2，相同元素的共享。
1，视图的切换就是activity之间的enter(进入) or exit(退出)。
可以理解为startActivity() or finish()。
2，共享元素：2个activity之间有相同的元素(比如image)，只不过image在大小或者位置上不同，通过changeImageTransform(图片转换器)让图片在2个activity之间平滑的移动和缩放。

Android 5.0(api 21)提供以下进入和退出效果：

explode(爆裂) - 从场景中间移动视图进入或者退出屏幕
slide(滑动) - 视图从场景的一个边缘进入或者退出屏幕
fade(淡入淡出) - 从场景添加或者移除一个视图时改变他的透明

explode - Moves views in or out from the center of the scene.
slide - Moves views in or out from one of the edges of the scene.
fade - Adds or removes a view from the scene by changing its opacity.

进入或者退出这种动画效果必须继承Visibility类，更多信息可以参看Transition类的api。

Android5.0(api 21)也支持共享元素过渡效果：

changeBounds - 改变目标视图的布局边界
changeClipBounds - 裁剪目标视图边界
changeTransform - 改变目标视图的缩放比例和旋转角度
changeImageTransform - 改变目标图片的大小和缩放比例

google指出activity间的过渡动画默认是淡入淡出效果。

Specify custom transitions： 自定义转场动画。
继承Material 主题，设置android:windowContentTransitions属性。
android:windowContentTransitions的设置有2中方式：1，主题。2，代码。
1，主题中：

<style name="BaseAppTheme" parent="android:Theme.Material">  <!-- enable window content transitions -->  <item name="android:windowContentTransitions">true</item>  <!-- specify enter and exit transitions --> <item name="android:windowEnterTransition">@transition/explode</item> <item name="android:windowExitTransition">@transition/explode</item>  <!-- specify shared element transitions -->  <item name="android:windowSharedElementEnterTransition">    @transition/change_image_transform</item>  <item name="android:windowSharedElementExitTransition">    @transition/change_image_transform</item></style>

在google提供的例子中 change_image_transform 是这样写的。

<!-- res/transition/change_image_transform.xml --><!-- (see also Shared Transitions below) --><transitionSet xmlns:android="http://schemas.android.com/apk/res/android">  <changeImageTransform/></transitionSet>

changeImageTransform 通过ChangeImageTransform类实现。
更多信息可以参看Transition类的api。

2，在代码里面设置：

// inside your activity (if you did not enable transitions in your theme)getWindow().requestFeature(Window.FEATURE_CONTENT_TRANSITIONS);// set an exit transitiongetWindow().setExitTransition(new Explode());

To specify transitions in your code, call these methods with a Transition object:

Window.setEnterTransition()
Window.setExitTransition()
Window.setSharedElementEnterTransition()
Window.setSharedElementExitTransition()

退出动画：
The setExitTransition() and setSharedElementExitTransition() methods define the exit transition for the calling activity.

进入动画：
The setEnterTransition() and setSharedElementEnterTransition() methods define the enter transition for the called activity.

注意事项：
To get the full effect of a transition, you must enable window content transitions on both the calling and called activities. Otherwise, the calling activity will start the exit transition, but then you’ll see a window transition (like scale or fade).
为了得到一个完整的动画效果，我们必须在2个activity(当前的和正要启动的)上都要设置android:windowContentTransitions属性。否则，正要启动的activity就会使用退出的动画，你会看到一个缩放或者淡入淡出的动画。

To start an enter transition as soon as possible,
use the Window.setAllowEnterTransitionOverlap() method on the called activity.
This lets you have more dramatic enter transitions.
请使用Window.setAllowEnterTransitionOverlap() 方法，这样你会看到一个令人激动的动画。

Start an activity using transitions：使用转场动画启动activity
如果你为一个activity设置了退出时的动画，当你启动其他activity的时候，该动画会被激活。

startActivity(intent,
ActivityOptions.makeSceneTransitionAnimation(this).toBundle());

如果你为一个activity设置了进入时的动画， 当该activity启动时，动画就会被激活。但是如果你不想激活(禁用)该动画提供一个 a null options bundle。

Start an activity with a shared element：启动一个activity，该activity中包含一各共享元素。

包含这么几个步骤：
1，Enable window content transitions in your theme.开启转场动画效果
2，Specify a shared elements transition in your style.制定共享元素动画效果
3，Define your transition as an XML resource.定义动画(感觉这个在前面)
4，Assign a common name to the shared elements in both layouts
with the android:transitionName attribute.
在两个activity中指定共享元素名称，通过android:transitionName属性。
5，Use the ActivityOptions.makeSceneTransitionAnimation() method.
使用该方法启动activity。

// get the element that receives the click eventfinal View imgContainerView = findViewById(R.id.img_container);// get the common element for the transition in this activityfinal View androidRobotView = findViewById(R.id.image_small);// define a click listenerimgContainerView.setOnClickListener(new View.OnClickListener() {   @Override   public void onClick(View view) {     Intent intent = new Intent(this, Activity2.class);     // create the transition animation - the images in the layouts    // of both activities are defined with android:transitionName="robot"     ActivityOptions options = ActivityOptions     .makeSceneTransitionAnimation(this, androidRobotView, "robot");        // start the new activity        startActivity(intent, options.toBundle());    }});

For shared dynamic views that you generate in your code, use the View.setTransitionName() method to specify a common element name in both activities.
在代码中动态生成code，在2个activity中使用View.setTransitionName()方法指定该共享元素的name。

To reverse the scene transition animation when you finish the second activity, call the Activity.finishAfterTransition() method instead of Activity.finish().
如果你想在第二个activity关闭的时候，逆转这种动画效果，请调用Activity.finishAfterTransition()去替换之前的Activity.finish()方法。

Start an activity with multiple shared elements：多个共享元素。
就是多加了一个参数，其他都一样。

ActivityOptions options = ActivityOptions.makeSceneTransitionAnimation(this,        Pair.create(view1, "agreedName1"),        Pair.create(view2, "agreedName2"));

---

实例代码：
1，自定义主题：AndroidManifest文件中2个activity都要设置theme

<style name="transitions" parent="android:Theme.Material">       <!-- enable window content transitions 默认值为false -->       <!--如果指定了android:windowEnterTransition       和android:windowEnterTransition 设不设置都一样-->        <item name="android:windowContentTransitions">false</item><!-- specify enter and exit transitions这里你可以写自己的Transition-->        <item name="android:windowEnterTransition">        @android:transition/explode</item>       <item name="android:windowExitTransition">            @android:transition/explode       </item>       <!-- activity执不执行动画，false不执行动画，设置什么都没用 -->        <item name="android:windowActivityTransitions">true</item>        <!-- specify shared element transitions -->        <!--        <item name="android:windowSharedElementEnterTransition">            @transition/change_image_transform</item>         <item name="android:windowSharedElementExitTransition">            @transition/change_image_transform          </item>        -->    </style>

2，代码设置：记得是2个activity中都要设置。

protected void onCreate(Bundle savedInstanceState) {     getWindow().requestFeature(Window.FEATURE_CONTENT_TRANSITIONS);// set an exit transition  启动一个新activity时，执行当前视图移除屏幕外的动画。并不是finish时候的动画。getWindow().setExitTransition(new Slide(Gravity.RIGHT));getWindow().setEnterTransition(new Explode());//上面的设置要放到setContentView之前。super.onCreate(savedInstanceState);setContentView(R.layout.activity_main5_transition);}

重要说明：finishAfterTransition();
会逆转当前activity的进入动画，并且触发逆转第一个activity的退出动画。
比如：第一个activity的退出动画是right，第二个activity的进入动画是bttom(从底部到头部)
那么：就会先逆转当前activity(第二个)的进入动画变为top(从头部到底部)，然后在逆转第一个activity的退出动画变为left(从右到左)

启动Activity方式：

getWindow().setAllowEnterTransitionOverlap(true);Intent intent = new Intent(Android5Activity.this, TransitionActivity.class);ActivityOptions options  = ActivityOptions.makeSceneTransitionAnimation(Android5Activity.this);startActivity(intent,options.toBundle());

---

共享元素的动画
1，设置主题

 <style name="transitions_share" parent="android:Theme.Material">        <item name="android:windowContentTransitions">true</item>        <!-- specify shared element transitions -->        <item name="android:windowSharedElementEnterTransition">@transition/change_image_transform</item>        <item name="android:windowSharedElementExitTransition">@transition/change_image_transform</item>    </style>

2，imageview的转场动画在/res/transition目录下

<transitionSet xmlns:android="http://schemas.android.com/apk/res/android" >    <!-- <explode /> -->    <changeBounds />    <changeTransform />    <changeClipBounds />    <changeImageTransform /></transitionSet>

3，启动activity

getWindow().setAllowEnterTransitionOverlap(true);Intent intent = new Intent(TransitionActivity.this, TransitionShareActivity.class);//共享控件及transitionName。 第一个参数是控件，第二个参数是name。Pair<View, String> pair1 = new Pair<View, String>(iv_1, "iv_test");//Pair.create(iv_1, "iv_test");     ActivityOptions options  = ActivityOptions.makeSceneTransitionAnimation(TransitionActivity.this,pair1);startActivity(intent,options.toBundle());

4，在第二个activity中设置：
1，设置主题。2设置要共享的imageview。
ViewCompat.setTransitionName(iv_second, “iv_test”);
或者iv_second.setTransitionName(“iv_test”);

下面这个就是google给的共享多个元素的demo,使用的图片框架是picasso。图片地址已改成Imageloader中的图片。

Activity_Transitions_Demo

来几张效果图，不会弄gif，呜呜呜呜呜~~~~
点击第一张图片，显示详情界面。

点击下载Activity_Transitions_Demo