开发者社区> yungfan> 正文
阿里云
为了无法计算的价值
打开APP
阿里云APP内打开

Android开发之Activity转场动画

简介: 引子 相信开发过iOS的程序员都知道iOS ViewController之间的跳转动画非常多,很酷对不对?这让开发Android的羡慕不已,曾几何时,Android中的Activity跳转是何等的生硬,But,在Android 5.0以后,Google也为Activity的转场设计了更加友好的动画效果。
+关注继续查看
引子

相信开发过iOS的程序员都知道iOS ViewController之间的跳转动画非常多,很酷对不对?这让开发Android的羡慕不已,曾几何时,Android中的Activity跳转是何等的生硬,But,在Android 5.0以后,Google也为Activity的转场设计了更加友好的动画效果。

转场动画(Activity Transition)基本介绍

Android 5.0 提供了三种Transition类型
进入:决定Activity中的所有的视图怎么进入屏幕。
退出:决定一个Activity中的所有视图怎么退出屏幕。
共享元素:决定两个activities之间的过渡,怎么共享(它们)的视图。

进入和退出包含如下动画效果
  • explode(分解) – 从屏幕中间进或出
  • slide(滑动) - 从屏幕边缘进或出地
  • fade(淡出) –通过改变屏幕上视图的不透明度达到添加或者移除视图的效果
共享元素包含如下动画效果
  • changeBounds - 改变目标视图的布局边界
  • changeClipBounds - 裁剪目标视图边界
  • changeTransform - 改变目标视图的缩放比例和旋转角度
  • changeImageTransform - 改变目标图片的大小和缩放比例
实践

1.准备好2个Activity的布局,弄几个按钮,分别对应几种转场动画。

activity_one.xml ActivityOne的布局,其中最后一个Button是为了做共享元素动画

<LinearLayout 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:background="#ff0000"
    android:gravity="center"
    android:orientation="vertical"
    tools:context=".MainActivity">

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center_horizontal"
        android:onClick="explode"
        android:text="explode" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center_horizontal"
        android:onClick="slide"
        android:text="slide" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center_horizontal"
        android:onClick="fade"
        android:text="fade" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center_horizontal"
        android:onClick="share"
        android:text="share" />


    <Button
        android:id="@+id/share"
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_gravity="center_horizontal"
        android:background="@drawable/football" />
</LinearLayout>

activity_two.xml ActivityTwo的布局,里面的Button与第一个布局中的最后一个Button呼应,只是大小不一样

<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:background="#0000ff"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context=".MainActivity">

    <Button
        android:id="@+id/share"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:transitionName="shareTransition"
        android:layout_gravity="center_horizontal"
        android:background="@drawable/football"
        android:layout_centerInParent="true"
        android:onClick="share" />
</RelativeLayout>

2.ActivityOne 与 ActivityTwo

ActivityOne.java

public class ActivityOne extends Activity {


    private Intent intent;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_one);
        intent = new Intent(ActivityOne.this, ActivityTwo.class);
    }

    public void explode(View view) {

        intent.putExtra("transition", "explode");
        //将原先的跳转改成如下方式
        startActivity(intent, ActivityOptions.makeSceneTransitionAnimation(ActivityOne.this).toBundle());

    }

    public void slide(View view) {

        intent.putExtra("transition", "slide");
        //将原先的跳转改成如下方式
        startActivity(intent, ActivityOptions.makeSceneTransitionAnimation(ActivityOne.this).toBundle());

    }

    public void fade(View view) {

        intent.putExtra("transition", "fade");
        //将原先的跳转改成如下方式
        startActivity(intent, ActivityOptions.makeSceneTransitionAnimation(ActivityOne.this).toBundle());

    }

    public void share(View view) {

        //共享元素
        Button share = (Button) findViewById(R.id.share);
        intent.putExtra("transition", "share");

        //将原先的跳转改成如下方式,注意这里面的第三个参数决定了ActivityTwo 布局中的android:transitionName的值,它们要保持一致
        startActivity(intent, ActivityOptions.makeSceneTransitionAnimation(ActivityOne.this, share, "shareTransition").toBundle());

    }


}

ActivityTwo.java

public class ActivityTwo extends Activity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        // 允许使用transitions
        getWindow().requestFeature(Window.FEATURE_CONTENT_TRANSITIONS);

        String transition = getIntent().getStringExtra("transition");

        switch (transition) {
            case "explode":
                // 设置进入时进入动画
                Explode explode = new Explode();
                explode.setDuration(1000);
                getWindow().setEnterTransition(explode);

                break;

            case "slide":
                Slide slide = new Slide();
                slide.setDuration(1000);
                getWindow().setEnterTransition(slide);

                break;

            case "fade":
                Fade fade = new Fade();
                fade.setDuration(1000);
                getWindow().setEnterTransition(fade);

                break;

            case "share":
                break;
        }

        // 所有操作在设置内容视图之前
        setContentView(R.layout.activity_two);

    }

}

说明:
getWindow().setEnterTransition()是进入动画,与之对应的getWindow().setExitTransition()就是退出转场动画,用法和上面一样,就不重复了

3.测试效果
explode

img_daee18fe911c5d7c9081e29d894a8fcd.gif
explode.gif

slide

img_141e7b65b03cc10ef044f02ec48ff4dc.gif
slide.gif

fade

img_ad08c963f84b9183346b805db699d0e5.gif
fade.gif

share

img_66a4425c4a2e55c7121286baee476693.gif
share.gif
问题

explode效果感觉并没有从中间进,而是从上面下来的,这是为什么呢?欢迎知道的告知,感谢。

版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。

相关文章
Android Activity生命周期
 1. Android系统有四个重要的组件,分别是:Activity  Service  BroadcastReceiver  ContentProvider     Activity是Android程序的呈现层,显示可视化的用户界面,并接收与用户交互所产生的界面事件   Android应用程序可以包含一个或多个Activity,一般在程序启动后会呈现一个Activity,用于提示用户
1163 0
Android Activity生命周期以及onSaveInstanceState、onRestoreInstanceState要点备忘
 本文作者:Zhang Phil 原文链接:http://blog.csdn.net/zhangphil/article/details/48155371 Android Activity生命周期以及onSaveI...
818 0
Android——Activity的生命周期
   一,Demo测试Activity的生命周期       写两个Activity:   package com.example.activity_04; import android.
693 0
Android Activity生命周期简明、详细介绍
这篇文章对Android的Activity生命周期做了详细、简洁的介绍,记下作为翻阅的资料。 转载链接在这儿:  http://blog.
553 0
Android activity的生命周期
Android activity的生命周期 activity类处于android.app包中,继承体系如下: 1.java.lang.Object 2.android.content.Context 3.android.app.ApplicationContext 4.android.app.Activity activity是单独的,用于处理用户操作。
519 0
Android下Activity的生命周期
Activity的生命周期如上图所示。当系统调用一个活动时,每个回调函数依次调用。
503 0
2011年Android Activity生命周期学习笔记
2011年Android Activity生命周期学习笔记 一.启动Activity:会依次调用如下三个函数:1.onCreate;2.onStart;3.onResume;二.按BACK键:该Activity将结束,即Destroy销毁掉,会依次调用如下三个函数:1.
693 0
+关注
yungfan
中国&middot;芜湖 80后&middot;理工男 软件开发工程师 移动应用开发专业教师 技术方向:iOS、Android、Java
98
文章
0
问答
文章排行榜
最热
最新
相关电子书
更多
低代码开发师(初级)实战教程
立即下载
阿里巴巴DevOps 最佳实践手册
立即下载
冬季实战营第三期:MySQL数据库进阶实战
立即下载