12.7　Activity过渡动画

12.7　Activity过渡动画" level="2">12.7　Activity过渡动画

12.7　Activity过渡动画" class="reference-link">12.7　Activity过渡动画

曾经的Android在Activity进行跳转的时候，只是非常生硬的切换，即使通过overridePendingtransition(int inId, int outId)这个方法来给Activity增加一些切换动画，效果也只是差强人意。而在Android 5.X中，Google对动画效果进行了更深一步的诠释，为Activity的转场效果设计了更加丰富的动画效果。

    Android 5.X提供了三种Transition类型。

进入：一个进入的过渡动画决定Activity中的所有的视图怎么进入屏幕。
退出：一个退出的过渡动画决定一个Activity中的所有视图怎么退出屏幕。
共享元素：一个共享元素过渡动画决定两个Activities之间的过渡，怎么共享它们的视图。

其中，进入和退出效果包括：

explode（分解）——从屏幕中间进或出，移动视图
slide（滑动）——从屏幕边缘进或出，移动视图
fade（淡出）——通过改变屏幕上视图的不透明度达到添加或者移除视图

共享元素包括：

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

可以发现，在Android 5.X上，动画效果的种类变得更加丰富了。

首先来看看普通的三种Activity过渡动画，要使用这些动画非常简单，例如从ActivityA跳转到ActivityB，只需要在ActivityA中将基本的startActivity(intent)方法改为如下代码即可。

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

而在ActivityB中，只需要设置下如下所示代码。

    getWindow().requestFeature(Window.FEATURE_CONTENT_TRANSITIONS);

或者在样式文件中设置如下所示代码。

    <item name="android:windowContentTransitions">true</item>

那么接下来就可以设置进入ActivityB的具体的动画效果了，代码如下所示。

    getWindow().setEnterTransition(new Explode());
    getWindow().setEnterTransition(new Slide());
    getWindow().setEnterTransition(new Fade());

或者通过如下代码来设置离开ActivityB的动画效果。

    getWindow().setExitTransition (new Explode());
    getWindow().setExitTransition (new Slide());
    getWindow().setExitTransition (new Fade());

而对于共享元素的动画效果，可以借用开发者网站上的一张图来帮助大家理解，如图12.16所示。

图12.16　共享元素转场动画</h4>

第一张图中的Android机器人就是共享元素，即Activity1和Activity2都拥有的元素，只是在Activity2中对Android机器人进行了强调，所以视图被放大，在Activity1跳转到Activity2的时候，其他元素消失，而共享元素——Android机器人通过动画效果直接显示到Activity2中，这个动画效果在Google IO大会的App上已经有了非常好的展示效果，感兴趣的读者可以下载Google IO App来观看其效果。

要想在程序中使用共享元素的动画效果也非常简单，首先需要在Activity1的布局文件中设置共享的元素，给它增加相应的属性，代码如下所示。

    android:transitionName="XXX"

同时在Activity2的布局文件中，给要实现共享效果的元素也增加相同的属性，代码如下所示。

    android:transitionName="XXX"

这里需要注意的是一定要保证命名相同，这样系统才能找到共享元素。

如果只要一个共享元素，那么在Activity1中只需要使用如下代码。

    startActivity(intent,
            ActivityOptions.makeSceneTransitionAnimation(
                    this,
                    view,
                    "share").toBundle());

使用的参数就是在前面普通动画的基础上增加了共享的View和前面取的名字。

如果有多个共享的元素，那么可以通过Pair.create()来创建多个共享元素，代码如下所示。

    startActivity(intent,
            ActivityOptions.makeSceneTransitionAnimation(
            this,
            Pair.create(view, "share"),
            Pair.create(fab, "fab")).toBundle());

下面通过一个实例来演示Activity的过渡动画，Activity1代码如下所示。

    package com.yishengxu.myapplication;
 
    import android.app.Activity;
    import android.app.ActivityOptions;
    import android.content.Intent;
    import android.os.Bundle;
    import android.util.Pair;
    import android.view.View;
 
 
    public class MainActivity extends Activity {
 
        private Intent intent;
 
        @Override
        protected void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            setContentView(R.layout.activity_transition);
        }
 
        //设置不同动画效果
        public void explode(View view) {
            intent = new Intent(this, Transitions.class);
            intent.putExtra("flag", 0);
            startActivity(intent,
                    ActivityOptions.makeSceneTransitionAnimation(this)
                            .toBundle());
        }
        //设置不同动画效果
        public void slide(View view) {
            intent = new Intent(this, Transitions.class);
            intent.putExtra("flag", 1);
            startActivity(intent,
                    ActivityOptions.makeSceneTransitionAnimation(this)
                            .toBundle());
        }
 
        //设置不同动画效果
        public void fade(View view) {
            intent = new Intent(this, Transitions.class);
            intent.putExtra("flag", 2);
            startActivity(intent,
                    ActivityOptions.makeSceneTransitionAnimation(this)
                            .toBundle());
        }
        //设置不同动画效果
        public void share(View view) {
            View fab = findViewById(R.id.fab_button);
            intent = new Intent(this, Transitions.class);
            intent.putExtra("flag", 3);
            //创建单个共享元素
    //        startActivity(intent,
    //                ActivityOptions.makeSceneTransitionAnimation(
    //                        this, view, "share").toBundle());
            startActivity(intent,
                    ActivityOptions.makeSceneTransitionAnimation(
                            this,
                            //创建多个共享元素
                            Pair.create(view, "share"),
                            Pair.create(fab, "fab")).toBundle());
        }
    }

XML代码如下所示。

    <?xml version="1.0" encoding="utf-8"?>
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:orientation="vertical"
        android:layout_height="match_parent">
 
        <Button
            android:layout_width="match_parent"
            android:layout_height="100dp"
            android:onClick="explode"
            android:text="explode" />
 
        <Button
            android:layout_width="match_parent"
            android:layout_height="100dp"
            android:onClick="slide"
            android:text="slide" />
 
        <Button
            android:layout_width="match_parent"
            android:layout_height="100dp"
            android:onClick="fade"
            android:text="fade" />
 
        <Button
            android:layout_width="match_parent"
            android:layout_height="100dp"
            android:transitionName="share"
            android:onClick="share"
            android:text="share" />
 
        <Button
            android:id="@+id/fab_button"
            android:layout_width="56dp"
            android:transitionName="fab"
            android:layout_height="56dp"
            android:background="@drawable/ripple_round"
            android:elevation="5dp"/>
    </LinearLayout>

ActivityB代码如下所示。

    package com.yishengxu.myapplication;
 
    import android.app.Activity;
    import android.os.Bundle;
    import android.transition.Explode;
    import android.transition.Fade;
    import android.transition.Slide;
    import android.view.Window;
 
    public class Transitions extends Activity {
 
        @Override
        protected void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            getWindow().requestFeature(
    Window.FEATURE_CONTENT_TRANSITIONS);
            int flag = getIntent().getExtras().getInt("flag");
            //设置不同的动画效果
            switch (flag) {
                case 0:
                    getWindow().setEnterTransition(new Explode());
                    break;
                case 1:
                    getWindow().setEnterTransition(new Slide());
                    break;
                case 2:
                    getWindow().setEnterTransition(new Fade());
                    getWindow().setExitTransition(new Fade());
                    break;
                case 3:
                    break;
            }
            setContentView(R.layout.activity_transition_to);
 
        }
    }

XML代码如下所示：

    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:tools="http://schemas.android.com/tools"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:paddingBottom="@dimen/activity_vertical_margin"
        tools:context=".MyActivity">
 
        <View
            android:id="@+id/holder_view"
            android:layout_width="match_parent"
            android:layout_height="300dp"
            android:transitionName="share"
            android:background="?android:colorPrimary" />
 
        <Button xmlns:android="http://schemas.android.com/apk/res/android"
            android:id="@+id/fab_button"
            android:transitionName="fab"
            android:layout_width="56dp"
            android:layout_height="56dp"
            android:layout_marginRight="@dimen/activity_horizontal_margin"
            android:background="@drawable/ripple_round"
            android:elevation="5dp"
            android:layout_below="@+id/holder_view"
            android:layout_marginTop="-26dp"
            android:layout_alignParentEnd="true" />
 
        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:paddingTop="10dp"
 
            android:layout_below="@id/holder_view">
 
            <Button
                android:layout_width="match_parent"
                android:layout_height="60dp"
                android:id="@+id/button"
                android:layout_below="@+id/button4"
                android:layout_marginTop="10dp" />
 
            <Button
                android:layout_width="match_parent"
                android:layout_height="60dp"
                android:layout_marginTop="10dp"
                android:id="@+id/button4"
                android:layout_alignParentStart="true" />
 
        </RelativeLayout>
    </RelativeLayout>

程序运行效果如图12.17、图12.18所示。


图12.17　转场动画效果演示（前）	图12.18转场动画效果演示（后）

由于本实例涉及很多动态效果，所以很难在书本上让读者体验到实际效果，所以希望读者能实际运行一下本实例，体验Android 5.X中的Activity转场动画效果。

12.7 Activity过渡动画

12.7 Activity过渡动画" class="reference-link">12.7 Activity过渡动画

12.7　Activity过渡动画" class="reference-link">12.7　Activity过渡动画