自定义View(二)-动画- 代码生成View动画

前言

上篇我们介绍了视图动画，说的确切点应该是视图动画中的补间动画(Tween Animation)，关于逐帧动画(Frame Animation)用法更简单，这里先不做介绍后期再自定义View的使用会用到，到时候讲解。这篇我们来一起学习将上篇用XML实现的动画用试着用代码来生成，毕竟有些时候我们是用代码来控制动画的。

代码生成动画

Animation公共类

这里给大家发一个网站里面XML，类属性都能查到，这个是Animation官方文档
里面的方法比较多，但是重要的就如下几个：

android:duration 对应代码： setDuration(long) 动画持续时间，以毫秒为单位
android:fillAfter 对应代码： setFillAfter(boolean) 如果设置为true，控件动画结束时，将保持动画最后时的状态
android:fillBefore 对应代码： setFillBefore(boolean) 如果设置为true,控件动画结束时，还原到开始动画前的状态
android:fillEnabled 对应代码： setFillEnabled(boolean) 与android:fillBefore 效果相同，都是在动画结束时，将控件还原到初始化状态
android:repeatCount 对应代码： setRepeatCount(int) 重复次数
android:repeatMode 对应代码： setRepeatMode(int) 重复类型，有reverse和restart两个值，取值为RESTART或 REVERSE，必须与repeatCount一起使用才能看到效果。因为这里的意义是重复的类型，即回放时的动作。
android:interpolator 对应代码： setInterpolator(Interpolator) 设定插值器，其实就是指定的动作效果，比如弹跳效果等
可以看到，在XML设置的属性基本都可以用代码来控制。从官方文档中我们可以看到。它有5个子类。正好对应之前我们在XML中学到的5中动画的属性，如下：

XML	实体类
scale	ScaleAnimation
alpha	AlphaAnimation
rotate	RotateAnimation
translate	TranslateAnimation
set	AnimationSet

AlphaAnimation
构造函数：

AlphaAnimation(Context context, AttributeSet attrs) 同样，从本地XML加载动画，基本不用：
AlphaAnimation(float fromAlpha, float toAlpha)

这里第二个构造函数的参数为：

android:fromAlpha 动画开始的透明度，从0.0 --1.0 ，0.0表示全透明，1.0表示完全不透明
android:toAlpha 动画结束时的透明度，也是从0.0 --1.0 ，0.0表示全透明，1.0表示完全不透明
那么我们就可以将前一篇中的XML用代码来实现下：

<?xml version="1.0" encoding="utf-8"?>
<alpha xmlns:android="http://schemas.android.com/apk/res/android"
       android:repeatCount="2"
       android:repeatMode="reverse"
       android:duration="3000"
       android:fillAfter="true"
       android:fromAlpha="1.0"
       android:toAlpha="0.5">
</alpha>

代码:

AlphaAnimation alphaAnimation = new AlphaAnimation(1.0f, 0.5f);
alphaAnimation.setDuration(3000);
alphaAnimation.setRepeatCount(2);
alphaAnimation.setRepeatMode(Animation.REVERSE);
alphaAnimation.setFillAfter(true);
mTextView.setAnimation(alphaAnimation);

效果与之前是一样的。由于继承父类Animation所有有父类的共有属性。下面其他几种大同小异。

ScaleAnimation
构造函数：

ScaleAnimation(Context context, AttributeSet attrs) 从XML文件加载动画，基本用不到
ScaleAnimation(float fromX, float toX, float fromY, float toY)
ScaleAnimation(float fromX, float toX, float fromY, float toY, float pivotX, float pivotY)
ScaleAnimation(float fromX, float toX, float fromY, float toY, int pivotXType, float pivotXValue, int pivotYType, float pivotYValue)

参数对应XML含义如下：

android:fromXScale 起始的X方向上相对自身的缩放比例，浮点值，比如1.0代表自身无变化，0.5代表起始时缩小一倍，2.0代表放大一倍；
android:toXScale 结尾的X方向上相对自身的缩放比例，浮点值；
android:fromYScale 起始的Y方向上相对自身的缩放比例，浮点值，
android:toYScale 结尾的Y方向上相对自身的缩放比例，浮点值；
android:pivotX 缩放起点X轴坐标，可以是数值、百分数、百分数p 三种样式，比如 50、50%、50%p
android:pivotY 缩放起点Y轴坐标，取值及意义跟android:pivotX一样。
这里与XML是一一对应的只是名字有一点点不同而已。需要注意的是这里的pivotYType的取值有三个，Animation.ABSOLUTE、Animation.RELATIVE_TO_SELF和Animation.RELATIVE_TO_PARENT分别对应数，百分数，百分数p；下面我们来使用下：

XML:

<?xml version="1.0" encoding="utf-8"?>
<scale xmlns:android="http://schemas.android.com/apk/res/android"
       android:duration="3000"
       android:fillBefore="true"
       android:fromXScale="0.0"
       android:fromYScale="0.0"
       android:pivotX="50%p"
       android:pivotY="50%p"
       android:repeatCount="1"
       android:repeatMode="restart"
       android:toXScale="1.5"
       android:toYScale="1.5">
</scale>

代码：

ScaleAnimation scaleAnimation = new ScaleAnimation(0f, 1.5f, 0, 1.5f,Animation.RELATIVE_TO_PARENT, 0.5f, Animation.RELATIVE_TO_PARENT, 0.5f);
scaleAnimation.setDuration(3000);
scaleAnimation.setFillBefore(true);
scaleAnimation.setRepeatCount(1);
scaleAnimation.setRepeatMode(Animation.RESTART);
mTextView.setAnimation(scaleAnimation);

RotateAnimation
构造函数：

RotateAnimation(Context context, AttributeSet attrs) 从XML文件加载动画，基本用不到
RotateAnimation(float fromDegrees, float toDegrees)
RotateAnimation(float fromDegrees, float toDegrees, float pivotX, float pivotY)
RotateAnimation(float fromDegrees, float toDegrees, int pivotXType, float pivotXValue, int pivotYType, float pivotYValue)

参数对应XML含义如下：

android:fromDegrees 开始旋转的角度位置，正值代表顺时针方向度数，负值代码逆时针方向度数
android:toDegrees 结束时旋转到的角度位置，正值代表顺时针方向度数，负值代码逆时针方向度数
android:pivotX 缩放起点X轴坐标，可以是数值、百分数、百分数p 三种样式，比如 50、50%、50%p
android:pivotY 缩放起点Y轴坐标，可以是数值、百分数、百分数p 三种样式，比如 50、50%、50%p

XML使用：

<?xml version="1.0" encoding="utf-8"?>  
<rotate xmlns:android="http://schemas.android.com/apk/res/android"  
    android:fromDegrees="0"  
    android:toDegrees="-650"  
    android:pivotX="50%"  
    android:pivotY="50%"  
    android:duration="3000"  
    android:fillAfter="true">  
      
</rotate>

代码：

RotateAnimation rotateAnim = new RotateAnimation(0, -650, Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f);
rotateAnim.setDuration(3000);
rotateAnim.setFillAfter(true);
mTextView.setAnimation(rotateAnim);

TranslateAnimation
构造函数：

RotateAnimation(Context context, AttributeSet attrs) 从XML文件加载动画，基本用不到
TranslateAnimation(float fromXDelta, float toXDelta, float fromYDelta, float toYDelta)
TranslateAnimation(int fromXType, float fromXValue, int toXType, float toXValue, int fromYType, float fromYValue, int toYType, float toYValue)

参数对应XML含义如下：

android:fromXDelta 起始点X轴坐标，可以是数值、百分数、百分数p 三种样式，比如 50、50%、50%p
android:fromYDelta 起始点Y轴从标，可以是数值、百分数、百分数p 三种样式；
android:toXDelta 结束点X轴坐标
android:toYDelta 结束点Y轴坐标

这里没有什么难点就不再细述了。
XML使用：

    <?xml version="1.0" encoding="utf-8"?>  
    <translate xmlns:android="http://schemas.android.com/apk/res/android"  
        android:fromXDelta="0"   
        android:toXDelta="-80"  
        android:fromYDelta="0"  
        android:toYDelta="-80"  
        android:duration="2000"  
        android:fillBefore="true">  
    </translate>

代码：


                TranslateAnimation translateAnim = new TranslateAnimation(Animation.ABSOLUTE, 0, Animation.ABSOLUTE, -80,
                        Animation.ABSOLUTE, 0, Animation.ABSOLUTE, -80);
                translateAnim.setDuration(2000);
                translateAnim.setFillBefore(true);
                mTextView.setAnimation(translateAnim);

AnimationSet
AnimationSet类对应set标签，定义动作类的集合。
构造函数：

AnimationSet(boolean shareInterpolator) shareInterpolator取值true或false，取true时，指在AnimationSet中定义一个插值器（interpolater），它下面的所有动画共同。如果设为false，则表示它下面的动画自己定义各自的插值器。

增加动画的函数为：(更多函数，请参看SDK文档)

public void addAnimation (Animation a)

这里我们就将前面动画的属性加在一起：

 setAnim = new AnimationSet(true);
setAnim.addAnimation(alphaAnimation);
setAnim.addAnimation(scaleAnimation);
setAnim.addAnimation(rotateAnim);

setAnim.setDuration(3000);
setAnim.setFillAfter(true);
mTextView.setAnimation(setAnim);

使用插值器：

ScaleAnimation interpolateScaleAnim=new ScaleAnimation(0.0f,1.4f,0.0f,1.4f,Animation.RELATIVE_TO_SELF,0.5f,Animation.RELATIVE_TO_SELF,0.5f);  
interpolateScaleAnim.setInterpolator(new BounceInterpolator());  
interpolateScaleAnim.setDuration(3000);

这里的插值器的种类与上篇一致，使用方法都是一样的都是通过创建对象就可以了

其他插值器大家自己试验下。效果图就不发了。

实战

View动画讲到这基本上也就差不多了，那么我们用个小例子在实际中运用一下。
下面这个例子就是百篮应用中Activi ty进入与退出动画。我们就可以用我们学到的View动画来去实现。首先看下效果：

anim.gif

我们先来分析下这个动画：
进入时->当前Activity向左退出由完全可见变成完全不可见即将进入的Activity反之那么此时就是两个动画->从右进入，从左退出
退出时->当前Activity向右退出由完全可见变成完全不可见即将进入的Activity反之那么此时就是两个动画->从右退出，从左进入
那么就清楚了这里应该有四个动画，每个动画为组合动画：平移与渐变
那么我们来看下XML代码：
从左进入：

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <translate android:fromXDelta="-100%p" android:toXDelta="0%"
               android:duration="@android:integer/config_mediumAnimTime"/>
    <alpha android:fromAlpha="0.0" android:toAlpha="1.0"
           android:duration="@android:integer/config_mediumAnimTime" />
</set>

从右进入：

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <translate android:fromXDelta="100%p" android:toXDelta="0%"
               android:duration="@android:integer/config_mediumAnimTime"/>
    <alpha android:fromAlpha="0.0" android:toAlpha="1.0"
           android:duration="@android:integer/config_mediumAnimTime" />
</set>

从左退出：

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <translate android:fromXDelta="0%" android:toXDelta="-100%"
               android:duration="@android:integer/config_mediumAnimTime"/>
    <alpha android:fromAlpha="1.0" android:toAlpha="0"
           android:duration="@android:integer/config_mediumAnimTime" />
</set>

从右退出：

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <translate android:fromXDelta="0%p" android:toXDelta="100%"
               android:duration="@android:integer/config_mediumAnimTime"/>
    <alpha android:fromAlpha="1.0" android:toAlpha="0"
           android:duration="@android:integer/config_mediumAnimTime" />
</set>

这里大家再看下就很清楚了。大家可能对于平移的参数有些模糊，这里我用一张图：

图片.png

从上图可以看出，以手机屏幕下面边未X轴，屏幕左边为Y轴，当Activity在X轴值为-100%p时，刚好在屏幕的左边（位置1），当X轴值为0%p时，刚好再屏幕内(位置2），当X=100%p时刚好在屏幕右边（位置3）。
在清楚了这点后我们看下代码：

 /**
     * 设置进入 动画
     */
    @Override
    public void startActivity(Intent intent) {
        super.startActivity(intent);
        overridePendingTransition(R.anim.anim_slide_in_right,R.anim.anim_slide_out_left);

    }  
    
     /**
     * 设置退出 动画
     */
    @Override
    public void finish() {
        super.finish();
        overridePendingTransition(R.anim.anim_slide_in_left,R.anim.anim_slide_out_right);
    }

我们使用了这个方法：
public void overridePendingTransition(int enterAnim, int exitAnim)

enterAnim 定义Activity进入屏幕时的动画
exitAnim 定义Activity退出屏幕时的动画
overridePendingTransition 方法必须在startActivity()或者 finish()方法的后面
最后效果：

animAc.gif

是不是很简单很酷炫。嘿嘿！！！如果想全局使用就要封装在基类Activity中。

结语

下一篇我们一起来学习一下属性动画。我们下篇见

感谢

站在巨人的肩膀上可以让我们看的更远。
Android自定义控件三部曲文章

最后编辑于：2018.01.02 19:34:52

人面猴
序言：七十年代末，一起剥皮案震惊了整个滨河市，随后出现的几起案子，更是在滨河造成了极大的恐慌，老刑警刘岩，带你破解...
沈念sama阅读 203,456评论 5赞 477
死咒
序言：滨河连续发生了三起死亡事件，死亡现场离奇诡异，居然都是意外死亡，警方通过查阅死者的电脑和手机，发现死者居然都...
沈念sama阅读 85,370评论 2赞 381
救了他两次的神仙让他今天三更去死
文/潘晓璐我一进店门，熙熙楼的掌柜王于贵愁眉苦脸地迎上来，“玉大人，你说我怎么就摊上这事。” “怎么了？”我有些...
开封第一讲书人阅读 150,337评论 0赞 337
道士缉凶录：失踪的卖姜人
文/不坏的土叔我叫张陵，是天一观的道长。经常有香客问我，道长，这世上最难降的妖魔是什么？我笑而不...
开封第一讲书人阅读 54,583评论 1赞 273
港岛之恋（遗憾婚礼）
正文为了忘掉前任，我火速办了婚礼，结果婚礼上，老公的妹妹穿的比我还像新娘。我一直安慰自己，他们只是感情好，可当我...
茶点故事阅读 63,596评论 5赞 365
恶毒庶女顶嫁案：这布局不是一般人想出来的
文/花漫我一把揭开白布。她就那样静静地躺着，像睡着了一般。火红的嫁衣衬着肌肤如雪。梳的纹丝不乱的头发上，一...
开封第一讲书人阅读 48,572评论 1赞 281
城市分裂传说
那天，我揣着相机与录音，去河边找鬼。笑死，一个胖子当着我的面吹牛，可吹牛的内容都是我干的。我是一名探鬼主播，决...
沈念sama阅读 37,936评论 3赞 395
双鸳鸯连环套：你想象不到人心有多黑
文/苍兰香墨我猛地睁开眼，长吁一口气：“原来是场噩梦啊……” “哼！你这毒妇竟也来了？” 一声冷哼从身侧响起，我...
开封第一讲书人阅读 36,595评论 0赞 258
万荣杀人案实录
序言：老挝万荣一对情侣失踪，失踪者是张志新（化名）和其女友刘颖，没想到半个月后，有当地人在树林里发现了一具尸体，经...
沈念sama阅读 40,850评论 1赞 297
护林员之死
正文独居荒郊野岭守林人离奇死亡，尸身上长有42处带血的脓包…… 初始之章·张勋以下内容为张勋视角年9月15日...
茶点故事阅读 35,601评论 2赞 321
白月光启示录
正文我和宋清朗相恋三年，在试婚纱的时候发现自己被绿了。大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
茶点故事阅读 37,685评论 1赞 329
活死人
序言：一个原本活蹦乱跳的男人离奇死亡，死状恐怖，灵堂内的尸体忽然破棺而出，到底是诈尸还是另有隐情，我是刑警宁泽，带...
沈念sama阅读 33,371评论 4赞 318
日本核电站爆炸内幕
正文年R本政府宣布，位于F岛的核电站，受9级特大地震影响，放射性物质发生泄漏。R本人自食恶果不足惜，却给世界环境...
茶点故事阅读 38,951评论 3赞 307
男人毒药：我在死后第九天来索命
文/蒙蒙一、第九天我趴在偏房一处隐蔽的房顶上张望。院中可真热闹，春花似锦、人声如沸。这庄子的主人今日做“春日...
开封第一讲书人阅读 29,934评论 0赞 19
一桩弑父案，背后竟有这般阴谋
文/苍兰香墨我抬头看了看天上的太阳。三九已至，却和暖如春，着一层夹袄步出监牢的瞬间，已是汗流浃背。一阵脚步声响...
开封第一讲书人阅读 31,167评论 1赞 259
情欲美人皮
我被黑心中介骗来泰国打工，没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留，地道东北人。一个月前我还...
沈念sama阅读 43,636评论 2赞 349
代替公主和亲
正文我出身青楼，却偏偏与公主长得像，于是被迫代替她去往敌国和亲。传闻我的和亲对象是个残疾皇子，可洞房花烛夜当晚...
茶点故事阅读 42,411评论 2赞 342

自定义View(二)-动画- 代码生成View动画

前言

代码生成动画

实战

结语

感谢

推荐阅读更多精彩内容