热门标签 | HotTags
当前位置:  开发笔记 > Android > 正文

Android中转场动画的实现与兼容性处理

大家都知道Android中的动画有很多,除了在一个界面上使用帧动画、属性动画将一个或多个View进行动画处理以外,还可以用于两个界面之间过渡、跳转。本文的内容包括:Android5.0+的转场动画和Android4.X模拟实现Android5.0+转场效果。有需要的可以参考借鉴。

前言

在 Android 5.0 之前,我们已经有了 overridePendingTransition() 方法来实现一些转场效果。然而,在 Android 5.0 以后,转场效果更加炫酷。

比如下面的动画:

一、Android L 中的转场动画

实现转场动画只需三步:

       在 res/ 目录下创建 transition 文件夹,在该文件夹下定义界面转场动画和共享元素的动画。

       在 res/value/style 文件中为每个 Activity 指定转场动画的 style ,并在 AndroidManifest.xml 文件中为每个 Activity 设置对应的 android:theme。

       在 Activity 调用 startActivity() 切换动画前,使用 ActivityOptionsCompat 来创建转场动画时的共享对象。
下面就来对这三步进行详细讲解。

二、定义转场动画

在 res/ 目录下创建了 transition 资源文件夹后,就可以在该文件夹下对每一种动画进行定义。

一般来说,对 Activity 定义一个过渡动画可以写成下面的形式:


 
  
  
 

其中, 是动画效果的名称,Android 5.0(API 级别 21)支持这些进入与退出转换:

       1、分解(explode):从场景中心移入或移出视图。

       2、滑动(slide):从场景边缘移入或移出视图。

       3、淡入淡出(fade):通过调整透明度在场景中增添或移除视图。

而每一种动画效果,都有额外的属性。比如滑动 slide,可以使用 android:slideEdge="top" 设置滑动的方向;淡入淡出(fade)可以使用 android:fadingMode="fade_in" 设置具体是淡入(fade_in)还是淡出(fade_out)等。

标签里面定义需要转场(或者不需要转场)的目标 id ,这个 id 可以使系统自带的,也可以是我们自己视图中的 view 的 id,每一个 id 需要单独在 标签中定义,android:targetId 表示目标ID需要进行过渡转换的 view,而 android:excludeId 表示我们不需要该 ID 的 view 进行过渡转场。上面的那段代码的意思是说,除了状态栏和导航栏以外所有的 view,都执行 explode 动画。

如果我们想要在同一个过渡状态中实现两种或多种动画效果怎么办?也简单,将根标签替换为 ,然后定义每一种动画效果,最后记得在根标签中使用 android:transitionOrdering 注明这几种动画的演示顺序,sequential 表示顺序执行,而 together 表示同时执行。

比如像下面的代码:


 
  
   
  
 

 
  
   
   
   
  
 

这段代码的意思就很简单了,该 xml 定义了两个过渡动画,并且同时执行。第一个动画是针对 id 为 cardView 的 view 进行滑动,第二个动画将除了状态栏、导航栏和 cardview 以外的 view,进行淡入淡出。

三、为每个 Activity 定义转场样式

这里的每一种动画,指的是在进行界面跳转过渡时,两个界面的状态。比如对于 Activity A 和 Activity B 这两个界面,可能的状态如下:

       1、界面 A 跳转至界面 B :这时界面 A 是退出(exit )过渡状态,而对应的界面B是进入(enter)过渡状态。

       2、界面 B 返回到界面 A :这时界面 A 是重新进入(reenter)过渡,而对应的界面B则是返回(return)过渡。

一般来说,所有的 Activity 过渡动画都可以定义成如下的形式:


当然,你可以不用写全,比如在我的 Demo 中一个界面的转场动画文件如下:


四、调用 ActivityOptionsCompat

转场动画是在两个界面的跳转返回时发生的,所以,当使用 intent 跳转界面时,需要调用 ActivityOptionsCompat来指定动画的运行。

一般来说,调用 ActivityOptionsCompat 的模板代码如下:

// 创建一个包含过渡动画信息的 ActivityOptions 对象
ActivityOptions optiOns= ActivityOptions.makeSceneTransitionAnimation(this, view, getString(R.string.image_transition_name));

// 使用 Intent 跳转界面,并传递共享对象信息
Intent intent = new Intent(this, DetailActivity.class);
startActivity(intent, optionsCompat.toBundle());

ActivityOptionsCompat 是在support v4 包里面的,其实它是 ActivityOptions 的一个兼容(ActivityOptions是API 16引入的)。

然后,我们需要在第二个 Activity 中,将转场的图片获取并显示到界面中。

多个共享元素的过渡实现

有时候我们需要让多个元素产生动画效果,可以使用 Pair<> 来实现:

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

五、手动实现一个转场动画

现在市面上,Android 5.0 以下的手机系统还有一定的市场份额,所以为了照顾这些用户,我们只能手动实现一下共享元素的转场动画效果。

实现的思路也比较简单,大概的步骤如下:

        1、确定第一个界面的共享元素,将其信息传递个第二个界面

        2、第二个界面接收信息,开始的时候将界面设置为透明,并只显示共享元素。

        3、将第二个界面的共享元素进行动画处理。

那么我们开始一步步实现上面的步骤。

获取共享元素位置信息

在第一个界面中,我们需要获取到共享元素的位置信息,并将其传递给下一个界面。于是乎,我们可以在第一个界面元素点击事件中,这么写:

public void imageClick(View view) {
 Intent intent = new Intent(AnimeActivity.this, AnimeDetailActivity.class);
 // 创建一个 rect 对象来存储共享元素位置信息
 Rect rect = new Rect();
 // 获取元素位置信息
 view.getGlobalVisibleRect(rect);
 // 将位置信息附加到 intent 上
 intent.setSourceBounds(rect);
 CustomImage customImage = (CustomImage) view;
 intent.putExtra(AnimeDetailActivity.EXTRA_IMAGE, customImage.getImageId());
 startActivity(intent);
 // 屏蔽 Activity 默认转场效果
 overridePendingTransition(0, 0);
}

其中,getGlobalVisibleRect() 方法的含义是,获取 可见的状态栏高度+可见的标题栏高度+Rect左上角到标题栏底部的距离,如果标题栏被隐藏了,那么可见标题栏高度为0。

接下来,就在在第二个界面接收位置信息并将该图片展示出来了。

模拟转场动画

在第二个界面中,我们需要做如下的操作:

       1、获取上共享元素信息。

       2、计算共享元素缩放比例和位移距离。

       3、调用动画,完成模拟转场效果。

我将上面三个步骤的代码如下。

private void initial() {
 // 获取上一个界面传入的信息
 mRect = getIntent().getSourceBounds();
 mRescourceId = getIntent().getExtras().getInt(EXTRA_IMAGE);

 // 获取上一个界面中,图片的宽度和高度
 mOriginWidth = mRect.right - mRect.left;
 mOriginHeight = mRect.bottom - mRect.top;

 // 设置 ImageView 的位置,使其和上一个界面中图片的位置重合
 FrameLayout.LayoutParams params = new FrameLayout.LayoutParams(mOriginWidth, mOriginHeight);
 params.setMargins(mRect.left, mRect.top - getStatusBarHeight(), mRect.right, mRect.bottom);
 mImageView.setLayoutParams(params);

 // 设置 ImageView 的图片和缩放类型
 mImageView.setImageResource(mRescourceId);
 mImageView.setScaleType(ImageView.ScaleType.CENTER_CROP);

 // 根据上一个界面传入的图片资源 ID,获取图片的 Bitmap 对象。
 BitmapDrawable bitmapDrawable = (BitmapDrawable) getResources().getDrawable(mRescourceId);
 Bitmap bitmap = bitmapDrawable.getBitmap();

 // 计算图片缩放比例和位移距离
 getBundleInfo(bitmap);

 // 创建一个 Pallette 对象
 mImagePalette = Palette.from(bitmap).generate();
 // 使用 Palette 设置背景颜色
 mContainer.setBackgroundColor(
   mImagePalette.getVibrantColor(ContextCompat.getColor(this, android.R.color.black)));
}

在12行,通过设置 Margin 的形式来确定图片的位置,需要注意的是,由于状态栏是在父控件 FramLayout 之外的,因此我们要将 Rect.top 的值减去状态栏的高度,这样才是相对于屏幕的绝对位置。然后,getBundleInfo() 方法的代码如下:

private void getBundleInfo(Bitmap bitmap) {
 // 计算图片缩放比例,并存储在 bundle 中
 if (bitmap.getWidth() >= bitmap.getHeight()) {
  mScaleBundle.putFloat(SCALE_WIDTH, (float) mScreenWidth / mOriginWidth);
  mScaleBundle.putFloat(SCALE_HEIGHT, (float) bitmap.getHeight() / mOriginHeight);
 } else {
  mScaleBundle.putFloat(SCALE_WIDTH, (float) bitmap.getWidth() / mOriginWidth);
  mScaleBundle.putFloat(SCALE_HEIGHT, (float) mScreenHeight / mOriginHeight);
 }
 // 计算位移距离,并将数据存储到 bundle 中
 mTransitionBundle.putFloat(TRANSITION_X, mScreenWidth / 2 - (mRect.left + (mRect.right - mRect.left) / 2));
 mTransitionBundle.putFloat(TRANSITION_Y, mScreenHeight / 2 - (mRect.top + (mRect.bottom - mRect.top) / 2));
}

动画处理

最后我们需要使用动画来模拟转场效果,代码如下:

private void runEnterAnim() {
 mImageView.animate()
    .setInterpolator(DEFAULT_INTERPOLATOR)
    .setDuration(DURATION)
    .scaleX(mScaleBundle.getFloat(SCALE_WIDTH))
    .scaleY(mScaleBundle.getFloat(SCALE_HEIGHT))
    .translationX(mTransitionBundle.getFloat(TRANSITION_X))
    .translationY(mTransitionBundle.getFloat(TRANSITION_Y))
    .start();
}

很简单,自此,入场动画效果基本模拟完毕。

而退场动画就更简单了,直接上代码:

private void runExitAnim() {
 mImageView.animate()
    .setInterpolator(DEFAULT_INTERPOLATOR)
    .setDuration(DURATION)
    .scaleX(1)
    .scaleY(1)
    .translationX(0)
    .translationY(0)
    .withEndAction(new Runnable() {
     @Override
     public void run() {
      finish();
      overridePendingTransition(0, 0);
     }
    })
    .start();
}

总结

以上就是Android中实现转场动画的全部内容,所以,是不是很简单?希望这篇文章的内容对各位Android开发者们能有所帮助,如果有疑问大家可以留言交流。


推荐阅读
  • 本文介绍了如何使用Postman构建和发送HTTP请求,包括四个主要部分:方法(Method)、URL、头部(Headers)和主体(Body)。特别强调了Body部分的重要性,并详细说明了不同类型的请求体。 ... [详细]
  • 短视频app源码,Android开发底部滑出菜单首先依赖三方库implementationandroidx.appcompat:appcompat:1.2.0im ... [详细]
  • SvpplyTable: 实现可扩展和可折叠的菜单动画
    SvpplyTable 是一个示例项目,旨在实现类似 Svpply 应用程序中的可扩展和可折叠的菜单动画效果。该项目托管在 GitHub 上,地址为 https://github.com/liuminqian/SvpplyTable。 ... [详细]
  • 本文介绍了一种使用CSS3和jQuery实现的35款SVG图标加载动画。这些动画不仅视觉效果出色,还能提升用户体验。通过本文,您可以了解如何在项目中应用这些动画。 ... [详细]
  • 如何解决TS1219:实验性装饰器功能可能在未来版本中更改的问题
    本文介绍了两种方法来解决TS1219错误:通过VSCode设置启用实验性装饰器,或在项目根目录下创建配置文件(jsconfig.json或tsconfig.json)。 ... [详细]
  • 本文介绍了如何查看PHP网站及其源码的方法,包括环境搭建、本地测试、源码查看和在线查找等步骤。 ... [详细]
  • 本文介绍了如何使用Python爬取妙笔阁小说网仙侠系列中所有小说的信息,并将其保存为TXT和CSV格式。主要内容包括如何构造请求头以避免被网站封禁,以及如何利用XPath解析HTML并提取所需信息。 ... [详细]
  • PHP 5.5.31 和 PHP 5.6.17 安全更新发布
    PHP 5.5.31 和 PHP 5.6.17 已正式发布,主要包含多个安全修复。强烈建议所有用户尽快升级至最新版本以确保系统安全。 ... [详细]
  • 本文介绍了一种支付平台异步风控系统的架构模型,旨在为开发类似系统的工程师提供参考。 ... [详细]
  • 使用 Git Rebase -i 合并多个提交
    在开发过程中,频繁的小改动往往会生成多个提交记录。为了保持代码仓库的整洁,我们可以使用 git rebase -i 命令将多个提交合并成一个。 ... [详细]
  • Manacher算法详解:寻找最长回文子串
    本文将详细介绍Manacher算法,该算法用于高效地找到字符串中的最长回文子串。通过在字符间插入特殊符号,Manacher算法能够同时处理奇数和偶数长度的回文子串问题。 ... [详细]
  • malloc 是 C 语言中的一个标准库函数,全称为 memory allocation,即动态内存分配。它用于在程序运行时申请一块指定大小的连续内存区域,并返回该区域的起始地址。当无法预先确定内存的具体位置时,可以通过 malloc 动态分配内存。 ... [详细]
  • 华为捐赠欧拉操作系统,承诺不推商用版
    华为近日宣布将欧拉开源操作系统捐赠给开放原子开源基金会,并承诺不会推出欧拉的商用发行版。此举旨在推动欧拉和鸿蒙操作系统的全场景融合与生态发展。 ... [详细]
  • 本文介绍了多种开源数据库及其核心数据结构和算法,包括MySQL的B+树、MVCC和WAL,MongoDB的tokuDB和cola,boltDB的追加仅树和mmap,levelDB的LSM树,以及内存缓存中的一致性哈希。 ... [详细]
  • Python多线程详解与示例
    本文介绍了Python中的多线程编程,包括僵尸进程和孤儿进程的概念,并提供了具体的代码示例。同时,详细解释了0号进程和1号进程在系统中的作用。 ... [详细]
author-avatar
一恒谢永泰_661
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有