Android5.0新特性详解之全新的动画_Android

 在Material Design设计中,为用户与app交互反馈他们的动作行为和提供了视觉上的连贯性。Material主题为控件和Activity的过渡提供了一些默认的动画,在android L上,允许自定义这些动画:

Touch feedback 触摸反馈

Circular Reveal 圆形展示

Curved motion 曲线运动

View state changes 视图状态变化

Vector Drawables 矢量图动画

Activity transitions 活动转场

触摸反馈

触摸反馈是指用户在触摸控件时的一种可视化交互,在Android L之前,通常是通过press色变来凸显,但是因为是瞬间变化的效果,不如动画生动。

在Android L使用了RippleDrawable类,用一个水波纹扩散效果在两种不同的状态间过渡。

使用Material Design样式的应用,button默认带有该效果。除了默认的效果外,系统还提供了另外两种效果,我们只把button的背景指定为:

?android:attr/selectableItemBackground`
?android:attr/selectableItemBackgroundBorderless`

任何view处于可点击状态,都可以使用RippleDrawable来达到水波纹特效。

我们也可以通过设置RippleDrawable的颜色属性来调节动画颜色,系统默认的颜色为主题的一个属性颜色:

android:colorControlHighlight,所以我们可以通过修改该颜色值来统一修改默认的水波纹颜色。android:colorAccent可以修改checkbox的选中颜色,更多颜色设置请参考主题。

系统的三种触摸反馈都是通过xml构建的,内容如下:

默认:

<ripplexmlns:android="http://schemas.android.com/apk/res/android"
android:color="?android:attr/colorControlHighlight">
<item>
<inset
android:insetLeft="4dp"
android:insetTop="6dp"
android:insetRight="4dp"
android:insetBottom="6dp">
<shape android:shape="rectangle">
<corners android:radius="2dp"/>
<solid android:color="?android:attr/colorButtonNormal"/>
<padding android:left="8dp"
android:top="4dp"
android:right="8dp"
android:bottom="4dp"/>
</shape>
</inset>
</item>
</ripple>

?android:attr/selectableItemBackground

<ripplexmlns:android="http://schemas.android.com/apk/res/android"
android:color="?android:attr/colorControlHighlight">
<item android:id="@android:id/mask">
<color android:color="@android:color/white"/>
</item>
</ripple>

?android:attr/selectableItemBackgroundBorderless

<ripple xmlns:android="http://schemas.android.com/apk/res/android"
android:color="?android:attr/colorControlHighlight"/>

代码设置

RippleDrawableColorStateList stateList = getResources().getColorStateList(R.color.tint_state_color);
RippleDrawable rippleDrawable = new RippleDrawable(stateList,null,null);
view.setBackground(rippleDrawable);

圆形展示

我们通常会显示或者隐藏一个view,在Android L之前,这是一个生硬瞬间变化动作,现在,有了一个新的api为此效果提供一个圆形的显示或者隐藏的动画效果。

RevealAnimator和之前的动画使用没什么区别,同样可以设置监听器和加速器来实现各种各样的特效,该动画主要用在隐藏或者显示一个view,改变view的大小等过渡效果。

通过ViewAnimationUtils.createCircularReveal来创建一个动画,该api接受5个参数

view :操作的视图

centerX: 动画开始的中心点X

centerY :动画开始的中心点Y

startRadius: 动画开始半径

startRadius :动画结束半径

沿着中心的缩小的动画

Animatoranimator = ViewAnimationUtils.createCircularReveal(
view, //操作的视图
view.getWidth() / 2,//动画开始的中心点X
view.getHeight() / 2,//动画开始的中心点Y
view.getWidth(),//动画开始半径
0 //动画结束半径
);
animator.setInterpolator(newLinearInterpolator());
animator.setDuration(1000);
animator.start();

从左上角扩展的圆形动画

Animatoranimator = ViewAnimationUtils.createCircularReveal(
view,0,0,0,(float) Math.hypot(view.getWidth(), view.getHeight()));
animator.setDuration(1000);
animator.start();

曲线运动

曲线动画在Android L之前我们可以通过继承位移动画重载applyTransformation函数来实现运动轨迹算法,但是操作起来比较繁琐:

通过继承位移动画,来改写applyTransformation来修改位移的轨迹

public classArcTranslateAnimationextendsAnimation {
private float mFromXValue,mToXValue,mFromYValue,mToYValue;
private float mFromXDelta,mToXDelta,mFromYDelta,mToYDelta;
private PointF mStart,mControl,mEnd;
public ArcTranslateAnimation(floatfromXValue, floattoXValue, floatfromYValue, floattoYValue) {
mFromXValue = fromXValue;
mToXValue = toXValue;
mFromYValue = fromYValue;
mToYValue = toYValue;
}
protected void applyTransformation(floatinterpolatedTime,Transformationt) {
float dx =calcBezier(interpolatedTime,mStart.x,mControl.x,mEnd.x);
float dy =calcBezier(interpolatedTime,mStart.y,mControl.y,mEnd.y);
t.getMatrix().setTranslate(dx,dy);
}
public void initialize(intwidth, intheight, intparentWidth, intparentHeight) {
super.initialize(width,height,parentWidth,parentHeight);
mFromXDelta = resolveSize(ABSOLUTE,mFromXValue,width,parentWidth);
mToXDelta = resolveSize(ABSOLUTE,mToXValue,width, parentWidth);
mFromYDelta = resolveSize(ABSOLUTE,mFromYValue,height,parentHeight);
mToYDelta = resolveSize(ABSOLUTE,mToYValue,height, parentHeight);
mStart =newPointF(mFromXDelta,mFromYDelta);
mEnd =newPointF(mToXDelta,mToYDelta);
mControl =newPointF(mFromXDelta,mToYDelta);
}
private long calcBezier(floatinterpolatedTime, floatp0, floatp1, float p2) {
return Math.round((Math.pow((1- interpolatedTime),2) * p0)
+ (2 * (1-interpolatedTime) * interpolatedTime * p1) +
(Math.pow(interpolatedTime,2) * p2);
}
}

现在我们有了更简单的实现方式。

ObjectAnimator新增了path方式来构建动画,并且可以同时对x,y两个属性做动画,我们只用指定一个曲线的path,即可作出曲线的动画,可以用quadTo/cubicTo绘制贝塞尔曲线,也可以使用arcTo绘制普通的弧线

新增了PathInterpolator动画插入器,新的基于贝塞尔曲线或路径对象的插入器。这个插入器指定了一个1x1正方形运动曲线,它使用(0,0)为锚点,(1,1)为控制点,作为构造函数的参数。
视图状态变化

Android L在原有的图片选择器和颜色选择器上进行了增强,不仅是控件能根据不同的状态显示不同的背景图片,还能在两种状态切换时指定一个动画,来增加过渡效果,吸引用户眼球,以突出重点内容。

StateListAnimator类和图片选择器,颜色选择器类似,可以根据view的状态改变呈现不同的动画效果,通过xml我们可以构建对应不同状态的动画合集,其使用方式也非常简单,在对应的状态指定一个属性动画即可:

<selectorxmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true">
<set>
<objectAnimator android:propertyName="translationZ"
android:duration="200"
android:valueTo="20dp"
android:valueType="floatType"/>
</set>
</item>
<item android:state_enabled="true"android:state_pressed="false">
<set>
<objectAnimator android:propertyName="translationZ"
android:duration="200"
android:valueTo="0"
android:valueType="floatType"/>
</set>
</item>
</selector>

在xml中通过android:stateListAnimator来指定状态动画,代码中可以通过AnimationInflater.loadStateListAnimator()加载动画,并使用View.setStateListAnimator()将其指定给View。

可以在状态切换的过程指定多个属性动画的合集,继承了Material主题后,按钮默认拥有了z属性动画。如果想取消这种默认状态,可以把状态动画指定为null。

除了StateListAnimator类指定状态切换的属性动画外,还可以通过AnimatedStateListDrawable来指定状态切换的帧动画:

<animated-selectorxmlns:android="http://schemas.android.com/apk/res/android">
<item android:id="@+id/pressed"android:drawable="@drawable/btn_check_15"
android:state_pressed="true"/>
<item android:id="@+id/normal" android:drawable="@drawable/btn_check_0"/>
<transition android:fromId="@+id/normal"android:toId="@+id/pressed">
<animation-list>
<item android:duration="20"android:drawable="@drawable/btn_check_0"/>
<item android:duration="20"android:drawable="@drawable/btn_check_1"/>
<item android:duration="20"android:drawable="@drawable/btn_check_2"/>
</animation-list>
</transition>
</animated-selector>

矢量图动画

前面我们学习了矢量图,AnimatedVectorDrawable类让你能使一个矢量图动起来。矢量图动画比帧动画更平滑的展现图片的变化过程,并且无论在内存占用,还是包体积占用上都要优于帧动画。通常定义一个矢量图动画需要三步:

在drawable资源目录下定义一个矢量图

<vectorxmlns:android="http://schemas.android.com/apk/res/android"
android:height="64dp"
android:width="64dp"
android:viewportHeight="600"
android:viewportWidth="600">
<group
android:name="rotationGroup"
android:pivotX="300.0"
android:pivotY="300.0"
android:rotation="45.0">
<path
android:name="v"
android:fillColor="#000000"
android:pathData="M300,70 l0,-70 70,70 0,0 -70,70z"/>
</group>
</vector>

在anim下顶一个objectAnimator,并在动画中修改矢量图的path

<setxmlns:android="http://schemas.android.com/apk/res/android">
<objectAnimator
android:duration="3000"
android:propertyName="pathData"
android:valueFrom="M300,70 l0,-70 70,70 0,0 -70,70z"
android:valueTo="M300,70 l0,-70 70,0 0,140 -70,0z"
android:valueType="pathType"/>
</set>

在drawable下定义一个animated-vector,并把drawable指向矢量图,把target中的动画指定为之前定义的objectAnimator

<animated-vectorxmlns:android="http://schemas.android.com/apk/res/android"
android:drawable="@drawable/vector_drawable">
<target
android:name="v"
android:animation="@anim/vector_anim"/>
</animated-vector>

转场动画

在Android L之前,我们可以在startActivity之后调用overridePendingTransition来指定Activity的转场动画。现在Android L给我们带来了更绚丽的转场动画。

新的转场动画分为两大类,一种是普通的过渡动画,另一种是共享元素的过渡动画。

要想使用新的转场动画,可以继承Material Design主题后在style风格中指定:

<stylename="DefaultTheme"parent="android:Theme.Material">
<!-- 允许使用transitions -->
<item name="android:windowContentTransitions">true</item>
<!-- 指定进入、退出、返回、重新进入时的transitions -->
<item name="android:windowEnterTransition">@transition/explode</item>
<item name="android:windowExitTransition">@transition/explode</item>
<item name="android:windowReturnTransition">@transition/explode</item>
<item name="android:windowReenterTransition">@transition/explode</item>
<!-- 指定进入、退出、返回、重新进入时的共享transitions -->
<item name="android:windowSharedElementEnterTransition">@transition/change</item>
<item name="android:windowSharedElementExitTransition">@transition/change</item>
<item name="android:windowSharedElementReturnTransition">@transition/change</item>
<item name="android:windowSharedElementReenterTransition">@transition/change</item>
</style>

也可以在activity的oncreate方法中进行代码设置:

// 允许使用transitions
getWindow().requestFeature(Window.FEATURE_CONTENT_TRANSITIONS);
// 指定进入、退出、返回、重新进入时的transitions
getWindow().setEnterTransition(newExplode());
getWindow().setExitTransition(newExplode());
getWindow().setEnterTransition(newExplode());
getWindow().setExitTransition(newExplode());
// 指定进入、退出、返回、重新进入时的共享transitions
getWindow().setSharedElementEnterTransition(newChangeTransform());
getWindow().setSharedElementExitTransition(newChangeTransform());
getWindow().setSharedElementReturnTransition(newChangeTransform());
getWindow().setSharedElementReenterTransition(newChangeTransform());

普通转场动画

所有继承自visibility类都可以作为进入、退出的过度动画。如果我们想自定义进入和退出时的动画效果,只需要继承Visibility,重载onAppear和onDisappear方法来定义进入喝退出的动画。系统提供了三种默认方式:

explode 从屏幕中心移入或移出视图

slide 从屏幕边缘移入或移出视图

fade 改变视图的透明度

想在xml中指定自定义的进入、退出的过度动画需要先对动画进行定义:

<transitionclass="my.app.transition.CustomTransition"/>

注意:其中CustomTransition是你自定义的动画,它必须继承自Visibility。

想以普通转场动画的方式启动一个Activity,必须在startActivity函数中传递一个ActivityOptions的Bundle对象:

ActivityOptionsoptions = ActivityOptions.makeSceneTransitionAnimation(activity);
startActivity(intent,options.toBundle());

如果想让返回也具备转场效果,那么在返回的Activity中不要再调用finish函数,而是应该使用finishAfterTransition来结束一个Activity,该函数会等待动画执行完毕才结束该Activity。

共享转场动画

当两个Activity具备某些相遇的元素时,共享转场动画将是一个非常好的选择。使用转场动画需要将相同的元素通过android:transitionName或者view.setTransitionName设置为相同的名称,这样系统才能区分出相同的元素。

共享转场动画支持以下共享元素:

changeBounds 对目标视图的大小进行动画

changeClipBounds 对目标视图的剪裁大小进行动画

changeTransform 对目标视图进行缩放、旋转、位移动画

changeImageTransform 对目标图片进行缩放

通过下面的函数启动一个共享元素动画:

ActivityOptionsoptions = ActivityOptions.makeSceneTransitionAnimation(activity,view, "name");
startActivity(intent,options.toBundle());

如果有多个共享元素,则可以通过Pair进行包装处理:

ActivityOptionsoptions = ActivityOptions.makeSceneTransitionAnimation(activity,Pair.create(view1,"name1"),Pair.create(view2,"name2"));
startActivity(intent,.toBundle());

返回时如果需要具备转场动画,那么也需要用finish函数替代finishAfterTransition来结束一个Activity。

共享转场动画通常可以根据指定的元素判断出合适的转场动画效果,不需要我们做额外的处理,也可以通过之前学习的方法进行指定共享元素转场动画效果。

组合转场动画

我们可以把多个转场动画进行组合,作出更具个性的转场效果,在资源文件中通过以下方式:

<transitionSetxmlns:android="http://schemas.android.com/apk/res/android">
<explode/>
<transition class="my.app.transition.CustomTransition"/>
<<changeImageTransform/>
</transitionSet>

代码中我们可以通过TransitionSet类组合多个转场动画:

TransitionSettransitionSet =new TransitionSet();
transitionSet.addTransition(newFade());
transitionSet.addTransition(newChangeBounds());

组合可以同时针对普通转场动画和共享元素转场动画。

转场动画也可以像普通动画一样设置持续时间,延期执行时间,速率插入器,以及动画的监听等。

转场动画通常是对整个布局起作用,如果我们想对某个特定的view实施转场动画,可以把该view设置为转场动画的target,这样转场动画将只对特定的view起作用。共享元素的动画的target需要指定为transitionName

以上所述是小编给大家介绍的Android5.0新特性详解之全新的动画,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对网站的支持!

以上是小编为您精心准备的的内容,在的博客、问答、公众号、人物、课程等栏目也有的相关内容,欢迎继续使用右上角搜索按钮进行搜索android
, 动画
, 5.0
新特性
android5.0新特性详解、java8新特性详解、jdk1.8 新特性 详解、android6.0新特性详解、android7.0新特性详解,以便于您获取更多的相关知识。

时间: 2024-08-31 03:48:03

Android5.0新特性详解之全新的动画_Android的相关文章

Android5.0新特性详解之全新的动画

在Material Design设计中,为用户与app交互反馈他们的动作行为和提供了视觉上的连贯性.Material主题为控件和Activity的过渡提供了一些默认的动画,在android L上,允许自定义这些动画: Touch feedback 触摸反馈 Circular Reveal 圆形展示 Curved motion 曲线运动 View state changes 视图状态变化 Vector Drawables 矢量图动画 Activity transitions 活动转场 触摸反馈 触

Android群英传笔记——第十二章:Android5.X 新特性详解,Material Design UI的新体验

Android群英传笔记--第十二章:Android5.X 新特性详解,Material Design UI的新体验 第十一章为什么不写,因为我很早之前就已经写过了,有需要的可以去看 Android高效率编码-第三方SDK详解系列(二)--Bmob后端云开发,实现登录注册,更改资料,修改密码,邮箱验证,上传,下载,推送消息,缩略图加载等功能 这一章很多,但是很有趣,也是这书的最后一章知识点了,我现在还在考虑要不要写这个拼图和2048的案例,在此之前,我们先来玩玩Android5.X的新特性吧!

Servlet 3.0新特性详解

简介:Servlet 是 Java EE 规范体系的重要组成部分,也是 Java 开发人员必须具备的基础技能, Servlet 3.0 是 Servlet 规范的最新版本.本文主要介绍了 Servlet 3.0 引入的若干重要新特性,包括 异步处理.新增的注解支持.可插性支持等等,为读者顺利向新版本过渡扫清障碍. Servlet 3.0 新特性概述 Servlet 3.0 作为 Java EE 6 规范体系中一员,随着 Java EE 6 规范一起发布.该版本在前一版本 (Servlet 2.5

Android 6.0权限申请详解及权限资料整理_Android

在android 6.0开始,部分的权限需要我们动态申请,也就是说当我们的打开app的时候系统不会主动像您申请app所需要的部分权限,需要客户在使用app的时候主动的去申请. 一.权限的申请两步骤: 1.权限申请: /** * @param permissions需要申请的权限 * @param requestCode申请回调code */ public static void requestPermissions(final @NonNull Activity activity,final @

SQL Server 2012 FileTable 新特性详解

FileTable是基于FILESTREAM的一个特性.有以下一些功能: •一行表示一个文件或者目录. •每行包含以下信息: • •file_Stream流数据,stream_id标示符(GUID). •用户表示和维护文件及目录层次关系的path_locator和parent_path_locator •有10个文件属性 •支持对文件和文档的全文搜索和语义搜索的类型列. •filetable强制执行某些系统定义的约束和触发器来维护命名空间的语义 •针对非事务访问时,SQL Server配置FIL

Flash MX 新特性详解(一)工作流程

详解 1. 灵活性操作的工作区 Macromedia Flash MX 拥有一个可定制,简单易用的用户界面, 无论对于设计师, 动画制作师还是程序开发员都一样顺手好用.可定制的特性包括有:面板设计.加速键.发布设置.用户界面和Macromadia其它软件工具界面更一致,这将有助于那些使用不止一个macromedia 的产品的用户更好的提高效率. 2. 新的属性面板 当选中工作区中某个对象后,面板中立即显示该对象相应的属性,然后允许用户直接通过该面板修改对象属性.这种受欢迎的工作方式最初是用于Dr

Flash MX 新特性详解(六) 脚本语言功能

脚本|详解 一.新的脚本语言命令 1.脚本语言编辑器 在ActionScript应用方面,不管是专家模式还是普通模式,其开发环境都有了很大的改善.代码提示.代码颜色标记.搜索.替代和自动格式检查这些功能,无论对于专家还是初学者都大大提高了他们的工作效率.拖拽脚本,查阅参考资料,源代码提供等等, 都使初学者在学习ActionScript时更轻松.另外新增加了一个在脚本和描述区域里跳转显示条,可以让你快速地选择你需要用到的脚本语句.. 2.可定制的脚本语言编辑器 定制脚本语言的编辑环境更加灵活:包括

Flash MX 新特性详解(二)赋有创意的设计工具

设计|详解 1. 直观的自然绘图和贝賽尔绘图工具 应用自然的画笔工具和基于贝賽尔曲线的技术工具,Flash MX提供了一个丰富的图形设计环境.例如:画笔工具和隐藏的可选工具,可用来绘出比较复杂的图形 2.自由变形工具 用一个简单易用的工具就可以很容易地对一个图片对象进行缩放.旋转.倾斜,扭曲,这个新工具会使你在对形状.组件和图片元素进行修改时更富有创造性和灵活性. 3.形状的扭曲变形工具 通过尖端和扭曲变形你可以创造出基于矢量图的任何效果,只要你能想到的,就可以做的到. 4.图形封装工具 通过新

JAVA8 十大新特性详解_java

"Java is still not dead-and people are starting to figure that out." 本教程将用带注释的简单代码来描述新特性,你将看不到大片吓人的文字. 一.接口的默认方法 Java 8允许我们给接口添加一个非抽象的方法实现,只需要使用 default关键字即可,这个特征又叫做扩展方法,示例如下: 复制代码 代码如下: interface Formula {    double calculate(int a);     defaul