Android:Material Design(三) 动画
Android:Material Design(一) 概述
Android:Material Design(二) Material主题
Android:Material Design(三) 动画
Android:Material Design(四) UI控件
Android:Material Design(五) 视图和阴影
Android:Material Design(六) 使用Drawable
Android:Material Design(七) 兼容性
Material Design包含了很多内容，今天跟大家分享一下Material新增的动画：
在Android L中新增了如下几种动画：
- Touch feedback（触摸反馈）
- Reveal effect（揭露效果）
- Activity transitions（Activity转换效果）
- Curved motion（曲线运动）
- View state changes （视图状态改变）
- Animate Vector Drawables（可绘矢量动画）
接下来我们一一讲解
Touch feedback（触摸反馈）
在Android 5.0中加入了触摸反馈动画。其中最明显，最具代表性的就是波纹动画，比如当点击按钮时会从点击的位置产生类似于波纹的扩散效果。关于buttons默认的触摸反馈动画，使用了RippleDrawable类，用一个波纹(涟漪)效果在两种不同的状态间过渡。
波纹效果（Ripple）：
当你使用了Material主题后，波纹动画会自动应用在所有的控件上，我们当然可以来设置其属性来调整到我们需要的效果。
在xml里可以通过如下代码设置波纹的背景：
?android:attr/selectableItemBackground //有界限的波纹 ?android:attr/selectableItemBackgroundBorderless //波纹超出边界 设置颜色
我们也可以通过设置xml属性来调节动画颜色，从而可以适应不同的主题：
android:colorControlHighlight：设置波纹颜色
android:colorAccent：设置checkbox等控件的选中颜色
<?xml version="1.0" encoding="utf-8"?><resources> <style name="AppTheme" parent="android:Theme.Material"> <item name="android:colorControlHighlight">#00ff00</item> </style></resources>使用效果
B1是不设任何背景的按钮
B2设置了?android:attr/selectableItemBackground
B3设置了?android:attr/selectableItemBackgroundBorderless
设置checkbox等控件的选中颜色为红色
<item name="android:colorAccent" >#ff0000</item>Reveal effect（揭露效果）
Circular Reveal是Android L新增的一个动画效果。
使用方法
应用ViewAnimationUtils.createCircularReveal()方法可以去创建一个RevealAnimator动画ViewAnimationUtils.createCircularReveal源码如下：
public static Animator createCircularReveal(View view, int centerX, int centerY, float startRadius, float endRadius) { return new RevealAnimator(view, centerX, centerY, startRadius, endRadius); }源码非常简单，就是通过createCircularReveal方法根据5个参数来创建一个RevealAnimator动画对象。这5个参数分别是：
1. view 操作的视图
2. centerX 动画开始的中心点X
3. centerY 动画开始的中心点Y
4. startRadius 动画开始半径
5. startRadius 动画结束半径
根据下面的效果图和代码可以很容易的了解这几个参数的作用：
final View oval = this.findViewById(R.id.oval); oval.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { Animator animator = ViewAnimationUtils.createCircularReveal( oval, oval.getWidth()/2, oval.getHeight()/2, oval.getWidth(), 0); animator.setInterpolator(new AccelerateDecelerateInterpolator()); animator.setDuration(2000); animator.start(); } }); final View rect = this.findViewById(R.id.rect); rect.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { Animator animator = ViewAnimationUtils.createCircularReveal( rect, 0, 0, 0, (float) Math.hypot(rect.getWidth(), rect.getHeight())); animator.setInterpolator(new AccelerateInterpolator()); animator.setDuration(2000); animator.start(); } });
总结
RevealAnimator和之前的动画使用没什么区别，同样可以设置监听器和加速器来实现各种各样的特效。这些效果常用在视图的添加，删除，状态，大小改变的时候。
Activity transitions（Activity转换效果）
Activity Transition是Material Design中提供的一种动画效果。它通过运动和切换不同状态之间的元素来产生各种动画效果。
简介
Activity Transition提供了两种Transition类型：
Enter（进入）：进入一个Activity的效果
Exit（退出）：退出一个Activity的效果
而这每种类型又分为普通和共享元素Transition。
普通Transition
- explode：从场景的中心移入或移出
- slide：从场景的边缘移入或移出
- fade：调整透明度产生渐变效果
Shared Elements Transition 共享元素转换
它的作用就是共享两个acitivity中共同的元素，在Android 5.0下支持如下效果：
1. changeBounds - 改变目标视图的布局边界
2. changeClipBounds - 裁剪目标视图边界
3. changeTransform - 改变目标视图的缩放比例和旋转角度
4. changeImageTransform - 改变目标图片的大小和缩放比例
Activity Transition使用
使用Activity Transition十分简单，只需要如下两个步骤：
步骤一：设置允许使用transition，并且设置transition
xml方式：
首先，如果要使用transition需要先修改style文件，在继承了material主题的style.xml中添加如下属性：
<style name="myTheme" 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> <!-- 指定shared element transitions --> <item name="android:windowSharedElementEnterTransition"> @transition/change_image_transform</item> <item name="android:windowSharedElementExitTransition"> @transition/change_image_transform</item> </style>下面再来看看如何定义transition动画：
<transitionSet xmlns:android="http://schemas.android.com/apk/res/android"> <explode/> <changeBounds/> <changeTransform/> <changeClipBounds/> <changeImageTransform/> </transitionSet>transition里面的元素就是之前介绍过的，使用方法和以前的AnimationSet差不多，具体如何使用大家可以参考官方文档。
代码方式：
在代码中同样可以完成对于transition的设置：
// 允许使用transitions
getWindow().requestFeature(Window.FEATURE_CONTENT_TRANSITIONS);
// 设置一个exit transition
getWindow().setExitTransition(new Explode());
getWindow().setExitTransition(new Slide());
可以通过如下方法在代码总设置transition效果：
Window.setEnterTransition()：普通transition的进入效果
Window.setExitTransition()：普通transition的退出效果
Window.setSharedElementEnterTransition()：共享元素transition的进入效果
Window.setSharedElementExitTransition()：共享元素transition的退出效果
步骤二：启动Activity
当你已经设置了允许使用Transition并设置了Transition动画，你就可以通过ActivityOptions.makeSceneTransitionAnimation()方法启动一个新的Activity来激活这个Transition：
启用普通的Transition：
startActivity(intent, ActivityOptions.makeSceneTransitionAnimation(this).toBundle());启用共享元素Transition：
启动shared element transition和普通的transition稍有不同
在所有需要共享视图的Activity中，使用android:transitionName属性对于需要共享的元素分配一个通用的名字。
Intent intent = new Intent(this, Activity2.class); // shareView: 需要共享的视图 // "shareName": 设置的android:transitionName="shareName" ActivityOptions options = ActivityOptions .makeSceneTransitionAnimation(this, shareView, "shareName"); startActivity(intent, options.toBundle());如果有多个View需要共享，则通过Pair.create()方法创建多个匹配对然后传入ActivityOptions.makeSceneTransitionAnimation。代码如下：
ActivityOptions options = ActivityOptions.makeSceneTransitionAnimation(this, Pair.create(view1, "agreedName1"), Pair.create(view2, "agreedName2"));如果不想使用transition可以设置options bundle为null。
当需要结束当前Activity并回退这个动画时调用Activity.finishAfterTransition()方法
效果展示
ActivityTransition源代码下载（Android Studio）
Curved motion（曲线运动）
在Material设计中的动画，依赖于曲线的时间插入值和空间运动模式。在android5.0(api21)及以上，可以自定义动画时间曲线和曲线运动模式。
PathInterpolator类是一个新的基于贝塞尔曲线或路径对象的插入器。这个插入器指定了一个1 x1正方形运动曲线，它使用(0,0)为锚点，(1,1)为控制点，作为构造函数的参数。你也可以定义一个path interpolator的xml资源：
<pathInterpolator xmlns:android="http://schemas.android.com/apk/res/android" android:controlX1="0.4" android:controlY1="0" android:controlX2="1" android:controlY2="1"/>系统提供了三种基本的曲线，XML资源：
@interpolator/fast_out_linear_in.xml@interpolator/fast_out_slow_in.xml@interpolator/linear_out_slow_in.xml您可以用PathInterpolator对象作Animator.setInterpolator()方法的参数。
ObjectAnimator类有新构造函数使您能够激活坐标沿着一个path同时使用两种或两种以上的属性。比如，如下的animator就使用了一个path 对象，来同时操作View的x和y属性：
ObjectAnimator mAnimator;mAnimator = ObjectAnimator.ofFloat(view, View.X, View.Y, path);...mAnimator.start();View state changes （视图状态改变）
StateListAnimator类允许您定义动画运行时视图的状态变化。下面的例子演示如何在xml中定义一个StateListAnimator：
<!-- animate the translationZ property of a view when pressed --><selector xmlns:android="http://schemas.android.com/apk/res/android"> <item android:state_pressed="true"> <set> <objectAnimator android:propertyName="translationZ" android:duration="@android:integer/config_shortAnimTime" android:valueTo="2dp" android:valueType="floatType"/> <!-- you could have other objectAnimator elements here for "x" and "y", or other properties --> </set> </item> <item android:state_enabled="true" android:state_pressed="false" android:state_focused="true"> <set> <objectAnimator android:propertyName="translationZ" android:duration="100" android:valueTo="0" android:valueType="floatType"/> </set> </item></selector>在上例中，为一个View添加视图状态动画，定义了一个使用selector元素的xml资源，并赋给view的android:stateListAnimator属性。如要在代码中为View指定视图状态动画，可使用AnimationInflater.loadStateListAnimator()加载xml资源，并使用View.setStateListAnimator()将其指定给View。
当你的主题继承了Material主题，按钮默认拥有了z动画。为了避免这种行为在你的按钮，设置android:stateListAnimator属性值为null。
AnimatedStateListDrawable类允许您创建图片以显示关联View的状态改变动画。一些系统的Widget，在5.0上默认使用这些动画。下面的例子显示了如何定义一个AnimatedStateListDrawable作为XML资源:
<!-- res/drawable/myanimstatedrawable.xml --><animated-selector xmlns:android="http://schemas.android.com/apk/res/android"> <!-- provide a different drawable for each state--> <item android:id="@+id/pressed" android:drawable="@drawable/drawableP" android:state_pressed="true"/> <item android:id="@+id/focused" android:drawable="@drawable/drawableF" android:state_focused="true"/> <item android:id="@id/default" android:drawable="@drawable/drawableD"/> <!-- specify a transition --> <transition android:fromId="@+id/default" android:toId="@+id/pressed"> <animation-list> <item android:duration="15" android:drawable="@drawable/dt1"/> <item android:duration="15" android:drawable="@drawable/dt2"/> ... </animation-list> </transition> ...</animated-selector>Animate Vector Drawables（可绘矢量动画）
矢量图片是可伸缩而不失真的。AnimatedVectorDrawable类让你能使一个矢量图动起来。
通常在三种xml定义动态的矢量图：
·使用元素的矢量图，在res/drawable/
·一个动态矢量图，使用元素，在res/drawable/
·一个或多个object animator，使用元素，在res/animator/
矢量图可以定义的属性元素有和，定义了一个的集合，或者子，定义绘制的路径。
定义矢量图时，可以给和指定一个名字，示例如下：
<!-- res/drawable/vectordrawable.xml --><vector xmlns: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 l 0,-70 70,70 0,0 -70,70z" /> </group></vector>在矢量动画中，引用矢量图定义的名字：
<!-- res/drawable/animvectordrawable.xml --><animated-vector xmlns:android="http://schemas.android.com/apk/res/android" android:drawable="@drawable/vectordrawable" > <target android:name="rotationGroup" android:animation="@anim/rotation" /> <target android:name="v" android:animation="@anim/path_morph" /></animated-vector>以下例子代表了一个 ObjectAnimator or AnimatorSet 对象：动作为旋转360度
<!-- res/anim/rotation.xml --><objectAnimator android:duration="6000" android:propertyName="rotation" android:valueFrom="0" android:valueTo="360" />下面的例子表示矢量图path从一个图形到另一个。两种渐变路径必须一致:他们必须具有相同数量的命令和相同数量的每个命令的参数：
<!-- res/anim/path_morph.xml --><set xmlns:android="http://schemas.android.com/apk/res/android"> <objectAnimator android:duration="3000" android:propertyName="pathData" android:valueFrom="M300,70 l 0,-70 70,70 0,0 -70,70z" android:valueTo="M300,70 l 0,-70 70,0 0,140 -70,0 z" android:valueType="pathType" /></set>参考
http://www.devstore.cn/new/newInfo/899.html
http://www.open-open.com/lib/view/open1416663769680.html
http://blog.csdn.net/jjwwmlp456/article/details/40617495
http://blog.csdn.net/bbld_/article/details/40633327
http://blog.csdn.net/ljx19900116/article/details/41806917
http://blog.csdn.net/qibin0506/article/details/49069089
http://download.csdn.net/detail/qibin0506/9172775
更多相关文章
- Android中activity背景色的设置
- Android：EditText 多行显示及所有属性
- Activity-RelativeLayout
- Android(安卓)EditText各种属性及作用
- Android商品规格流式布局运用RecyclerView实现显示和点击效果
- Android(安卓)EditText各种属性及作用
- 【Android】设置android:maxLines="1"后，android:imeOptions="act
- Android(安卓)圆角矩形
- Android(安卓)使用 TableLayout 布局拉伸宽度