Android5.0之后的页面切换动画

Android5.0之后给我们开发者剩了好多的事情,为什么这么说呢?还记得刚开始的时候,Android里面的所有的动画都要我们开发者自己来写,现在不需要了,因为5.0之后自带了好多的动画,比如:按钮点击的动画、页面切换的动画(在android5.0之前想都不敢想的)。 
今天我着重讲一下页面之间的切换,目前5.0系统自带了三种动画方式:Explode(缩放)、Fade(淡入淡出)、Slide(滑动进入)。下面就这三中方式进行介绍一下。 
在讲解之前,现对于动画的方式进行介绍一下。通常,我们进行页面跳转到时候,进本都是A到B,然后再从B返回到A。 
 
这个过程应该是调用页面A中的 getWindow().setExitTransition(transition);和页面B的getWindow().getEnterTransition(transition); 
含义就是:从页面A到页面B首先要先退出页面A,然后在进入页面B,所以要先调用页面A的退出动画,然后再去调用页面B点进入动画。 
 
和前面一个的意思相反,从界面B退回到界面A,首页要调用页面B的getWindow().setReturnTransition(transition);然后在调用页面A的getWindow().setReenterTransition(transition); 
含义就是:从页面B到页面A是一个返回的过程,所以要先调用页面B点返回方法,然后在调用重新进入页面A的方法。 
接着看一下代码:

public class MainActivity extends AppCompatActivity implements View.OnClickListener{

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        findViewById(R.id.btn1).setOnClickListener(this);
        findViewById(R.id.btn2).setOnClickListener(this);
        findViewById(R.id.btn3).setOnClickListener(this);
    }

    @Override
    public void onClick(View view) {
        Transition transition = null;
        Intent intent = null;
        switch (view.getId()) {
            case R.id.btn1:
                //缩放
                intent = new Intent(MainActivity.this,Main2Activity.class);
                transition = new Explode();
                break;
            case R.id.btn2:
                //淡入淡出
                intent = new Intent(MainActivity.this,Main3Activity.class);
                transition = new Fade();
                break;
            case R.id.btn3:
                //滑动
                intent = new Intent(MainActivity.this,Main4Activity.class);
                transition = new Slide();
                break;
        }
        transition.setDuration(1000);
        getWindow().setEnterTransition(transition);
        getWindow().setExitTransition(transition);
        getWindow().setReenterTransition(transition);
        getWindow().setReturnTransition(transition);
        startActivity(intent, ActivityOptions.makeSceneTransitionAnimation(MainActivity.this).toBundle());
    }
}

缩放界面:

public class Main2Activity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        getWindow().requestFeature(Window.FEATURE_CONTENT_TRANSITIONS);
        getWindow().setAllowEnterTransitionOverlap(true);
        getWindow().setAllowReturnTransitionOverlap(true);
        Explode explode = new Explode();
        explode.setDuration(1000);
        getWindow().setEnterTransition(explode);
        getWindow().setExitTransition(explode);
        setContentView(R.layout.activity_main2);
    }

    @Override
    public void onBackPressed() {
        super.onBackPressed();
        finishAfterTransition();
    }
}

淡入淡出:

public class Main3Activity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        getWindow().requestFeature(Window.FEATURE_CONTENT_TRANSITIONS);
        getWindow().setAllowEnterTransitionOverlap(true);
        getWindow().setAllowReturnTransitionOverlap(true);
        Fade fade = new Fade();
        fade.setDuration(1000);
        getWindow().setEnterTransition(fade);
        getWindow().setReturnTransition(fade);
        setContentView(R.layout.activity_main3);
    }

    @Override
    public void onBackPressed() {
        super.onBackPressed();
        finishAfterTransition();
    }
}

滑动:

public class Main4Activity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        getWindow().requestFeature(Window.FEATURE_CONTENT_TRANSITIONS);
        getWindow().setAllowEnterTransitionOverlap(true);
        getWindow().setAllowReturnTransitionOverlap(true);
        Slide slide = new Slide();
        slide.setDuration(1000);
        getWindow().setReturnTransition(slide);
        getWindow().setEnterTransition(slide);
        setContentView(R.layout.activity_main4);
    }

    @Override
    public void onBackPressed() {
        super.onBackPressed();
        finishAfterTransition();
    }
}

效果: 

时间: 2024-08-05 21:37:25

Android5.0之后的页面切换动画的相关文章

赞!超炫的页面切换动画效果【附源码下载】

在下面的示例中罗列了一组动画,可以被应用到页面切换过程中,创造出很有趣的导航效果.虽然有些效果都非常简单,只是简单的滑动动作,但另外的一些则是利用了视角(Perspective)和 3D 转换(3D Transforms)来创造一些立体动感的效果. 立即下载      在线演示 温馨提示:为保证最佳的效果,请在 IE10+.Chrome.Firefox 和 Safari 等现代浏览器中浏览. CSS 动画根据它们的实现的效果分为不同的组.为展示页面过渡效果,我们使用以下结构: <div id=&qu

太赞了!超炫的页面切换动画效果【附源码下载】

今天我们想与大家分享一组创意的页面切换熊效果集合.我们已经在示例中罗列了一组动画,可以被应用到页面切换过程中,创造出很有趣的导航效果.虽然有些效果都非常简单,只是简单的滑动动作,但另外的一些则是利用了视角(Perspective)和 3D 转换(3D Transforms)来创造一些立体动感的效果. 立即下载      在线演示 温馨提示:为保证最佳的效果,请在 IE10+.Chrome.Firefox 和 Safari 等现代浏览器中浏览. CSS 动画根据它们的实现的效果分为不同的组.为展示

QtQuick多页面切换、多页面切换动画、多个qml文件数据交互

一.QtQuick多页面切换方法 (1)“隐藏法” 前一个视图visible设为false或者透明度opacity设为0,相当于“隐藏”了,实际还存在: 要显示的视图visible设为true或者透明度opacity设为1,显示出来: (2)“动态” var component = Qt.createComponent("Page1.qml").createObject(container,{width:100,heisght:100): 创建一个基于“Page1.qml”的组件,在组

activity切换动画和页面切换动画

Activity切换动画 要实现Activity切换动画需要靠overridePendingTransition来实现,里面有两个参数分别是进入Activity时的动画和离开Activity时的动画. 需要注意的是必须在StartActivity()或finish()之后立即调用 比如在MainActivity中有一个Button,点击Button后跳转到OtherActivity中代码如下: Intent intent = new Intent(this, OtherActivity.clas

(转)Android中的页面切换动画

这段时间一直在忙Android的项目,总算抽出点时间休息一下,准备把一些项目用到的Android经验分享一下. 在Android开发过程中,经常会碰到Activity之间的切换效果的问题,下面介绍一下如何实现左右滑动的切换效果,首先了解一下Activity切换的实现,从Android2.0开始在Activity增加了一个方法: public void overridePendingTransition (int enterAnim, int exitAnim) 其中: enterAnim 定义A

PresentViewController切换界面(一些系统自带的页面切换动画)

视图切换,没有NavigationController的情况下,一般会使用presentViewController来切换视图并携带切换时的动画, 其中切换方法如下: – presentViewController:animated:completion: 弹出,出现一个新视图 可以带动画效果,完成后可以做相应的执行函数经常为nil– dismissViewControllerAnimated:completion:退出一个新视图 可以带动画效果,完成后可以做相应的执行函数经常为nil 切换动画

Angular 全局页面切换动画 me-pageloading

最近看了Codrops的一篇文章, 里面讲到了一个页面切换的效果, 详情点击此处. 看了这个效果感觉很赞, 觉得这个效果可以用在angular的页面切换中, 所以将这个效果移植到angular中, 做成一个angular module, 方便以后添加类似效果时, 直接使用. Github: https://github.com/jeremial/me-pageloading 做好的demo效果 配合 angular-ui-router使用, 效果http://isay.me/me-pageloa

添加页面切换动画, 避免冷启动

欢迎Follow我的GitHub, 关注我的CSDN. 在启动Android应用时, 直接显示页面, 就称之为冷启动(Cold Start). 为了增强用户体验, 可以添加控件动画, 让启动页面更有趣, 用户也更加容易接受. 提升应用的用户体验. 主要讲解两种启动方式, 一种是中心动画, 一种是预留位置. 中心动画: 使用动画效果逐渐显示控件, 如位移, 渐变, 缩放等. 预留位置: 改变控件的位置和大小直至匹配, 如坍塌, 滑入等. 本文的GitHub下载地址 动画效果 1. 中心动画 在显示

iOS页面切换动画实现方式。

1.使用UIView animateWithDuration:animations:completion方法 Java代码 [UIView animateWithDuration:0.2f animations:^{ detail.view.frame = CGRectMake(0, 0, detail.view.frame.size.width, detail.view.frame.size.height); } completion:^(BOOL finished) { UITableVie