自定义控件三部曲之动画篇(三)—— 代码生成alpha、scale、translate、rotate、set及插值器动画

一、概述

前两篇,我为大家讲述了利用XML来定义动画及插值器,但在代码中,我们常常是动态生成动画的,所以,这篇将为大家讲述如何用代码生成动态生成动画及插值器。

先简单写出各个标签对应的类,方便大家理解:

  • scale —— ScaleAnimation
  • alpha —— AlphaAnimation
  • rotate —— RotateAnimation
  • translate —— TranslateAnimation
  • set —— AnimationSet

 

二、Animation公共类

官方SDK讲解页面为:《Animation》

第一篇中我们提到过,Animation类是所有动画(scale、alpha、translate、rotate)的基类,它所具有的标签及对应函数为:

  • 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) 设定插值器,其实就是指定的动作效果,比如弹跳效果等

在第一篇《 Animation 动画详解(一)——alpha、scale、translate、rotate、set的xml属性及用法》 我们已经讲解了每个标签具体所具有的功能,这里就不再细讲,对于使用方法会在下面的各标签中使用。

 

三、ScaleAnimation

这是scale标签对应的类,官方SDK页面为:《ScaleAnimation》

在Scale标签中,我们提到过它的自有属性有下面几条,先列一下:

  • 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,当为数值时,表示在当前View的左上角,即原点处加上50px,做为起始缩放点;如果是50%,表示在当前控件的左上角加上自己宽度的50%做为起始点;如果是50%p,那么就是表示在当前的左上角加上父控件宽度的50%做为起始点x轴坐标。(具体意义,后面会举例演示)
  • android:pivotY           缩放起点Y轴坐标,取值及意义跟android:pivotX一样。
     

放到代码中,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:pivotX中有三种取值,数,百分数,百分数p;体现在构造函数中,就是最后一个构造函数的pivotXType,它的取值有三个,Animation.ABSOLUTE、Animation.RELATIVE_TO_SELF和Animation.RELATIVE_TO_PARENT;

这三个构造函数难度不大,就不再细讲,举个例子说明:

在第一篇中Scale的例子的XML代码为:

<?xml version="1.0" encoding="utf-8"?>
<scale xmlns:android="http://schemas.android.com/apk/res/android"
    android:fromXScale="0.0"
    android:toXScale="1.4"
    android:fromYScale="0.0"
    android:toYScale="1.4"
    android:pivotX="50"
    android:pivotY="50"
    android:duration="700" />

对应的代码构造代码为:

scaleAnim = new ScaleAnimation(0.0f,1.4f,0.0f,1.4f,Animation.RELATIVE_TO_SELF,0.5f,Animation.RELATIVE_TO_SELF,0.5f);
scaleAnim.setDuration(700);

在控件使用的时候,同样是使用:

tv.startAnimation(scaleAnim);

四、AlphaAnimation

这是alpha标签对就的类,官方SDK文档地址是:《AlphaAnimation》
同样alpha标签自有的属性有:

  • android:fromAlpha   动画开始的透明度,从0.0 --1.0 ,0.0表示全透明,1.0表示完全不透明
  • android:toAlpha       动画结束时的透明度,也是从0.0 --1.0 ,0.0表示全透明,1.0表示完全不透明

所对应的构造函数为:

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

这里只剩最后一个构造函数,难度不大,下面举个例子说明下用法。

 

在第一篇文章中,我们构造的XML代码为:

<?xml version="1.0" encoding="utf-8"?>
<alpha xmlns:android="http://schemas.android.com/apk/res/android"
    android:fromAlpha="1.0"
    android:toAlpha="0.1"
    android:duration="3000"
    android:fillBefore="true">
</alpha>

如果用代码构造同样的效果,它所对应的代码为:

alphaAnim = new AlphaAnimation(1.0f,0.1f);
alphaAnim.setDuration(3000);
alphaAnim.setFillBefore(true);

五、RotateAnimation

RotateAnimation类对应Rotate标签,SDK文档地址:《RotateAnimation》

Rotate标签所具有的XML属性有:

  • android:fromDegrees     开始旋转的角度位置,正值代表顺时针方向度数,负值代码逆时针方向度数
  • android:toDegrees         结束时旋转到的角度位置,正值代表顺时针方向度数,负值代码逆时针方向度数
  • android:pivotX               缩放起点X轴坐标,可以是数值、百分数、百分数p 三种样式,比如 50、50%、50%p,具体意义已在scale标签中讲述,这里就不再重讲
  • android:pivotY               缩放起点Y轴坐标,可以是数值、百分数、百分数p 三种样式,比如 50、50%、50%p

对应的构造函数有:

  • 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)
     

RotateAnimation跟ScaleAnimation差不多,关键问题同样是pivotXType和pivotYType的选择,同样有三个取值:Animation.ABSOLUTE、Animation.RELATIVE_TO_SELF和Animation.RELATIVE_TO_PARENT;

根据每一篇中的XML写出对应的JAVA构造代码:

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>

对应JAVA构造代码为:

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

六、TranslateAnimation

很显示TranslateAnimation类对应translate标签,它的SDK官方文档地址为:《TranslateAnimation》

translate标签所具有的属性为:

  • android:fromXDelta     起始点X轴坐标,可以是数值、百分数、百分数p 三种样式,比如 50、50%、50%p,具体意义已在scale标签中讲述,这里就不再重讲
  • android:fromYDelta    起始点Y轴从标,可以是数值、百分数、百分数p 三种样式;
  • android:toXDelta         结束点X轴坐标
  • android:toYDelta        结束点Y轴坐标
     

这些属性所对应的构造函数为:

  • TranslateAnimation(Context context, AttributeSet attrs)  同样,基本不用
  • 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)
     

由于fromXDelta、fromYDelta、toXDelta、toYDelta这三个属性都具有三种状态,所以在构造函数中,最理想的状态就是第三个构造函数,能够指定每个值的类型,第二个构造函数:TranslateAnimation (float fromXDelta, float toXDelta, float fromYDelta, float toYDelta)使用是绝对数值。只有最后一个构造函数可以指定百分数和相对父控件的百分数。

下面以第一篇中的XML代码为例,用JAVA代码构造同样的效果:

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>

对应的JAVA代码为:

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

七:AnimationSet

AnimationSet类对应set标签,定义动作类的集合,对应的SDK文档地址为:《AnimationSet》
它自己是没有XML属性的,所以我们直接说它的构造函数:

  • AnimationSet(Context context, AttributeSet attrs)  同样,基本不用
  • AnimationSet(boolean shareInterpolator)  shareInterpolator取值true或false,取true时,指在AnimationSet中定义一个插值器(interpolater),它下面的所有动画共同。如果设为false,则表示它下面的动画自己定义各自的插值器。
     

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

  • public void addAnimation (Animation a)

下面在第一篇中的XML代码为例写出能构造同样效果的JAVA代码:

XML代码为:

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="3000"
    android:fillAfter="true">
    
  <alpha 
    android:fromAlpha="0.0"
    android:toAlpha="1.0"/>
  
  <scale
    android:fromXScale="0.0"
    android:toXScale="1.4"
    android:fromYScale="0.0"
    android:toYScale="1.4"
    android:pivotX="50%"
    android:pivotY="50%"/>
  
  <rotate
    android:fromDegrees="0"
    android:toDegrees="720"
    android:pivotX="50%"
    android:pivotY="50%"/>
       
</set>

对应的JAVA代码为:

alphaAnim = new AlphaAnimation(1.0f,0.1f);
scaleAnim = new ScaleAnimation(0.0f,1.4f,0.0f,1.4f,Animation.RELATIVE_TO_SELF,0.5f,Animation.RELATIVE_TO_SELF,0.5f);
rotateAnim = new RotateAnimation(0, 720, Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f);
 
setAnim=new AnimationSet(true);
setAnim.addAnimation(alphaAnim);
setAnim.addAnimation(scaleAnim);
setAnim.addAnimation(rotateAnim);
 
setAnim.setDuration(3000);
setAnim.setFillAfter(true);

八、Interpolater插值器

关于插值器的效果及应用,我们专门开了一篇来讲,看这里:《Animation动画详解(二)——Interpolator插值器》

关于插值器的SDK讲解见《Animation Resources》中的Interpolators部分;

插值器XML属性及对应的类如下表所示:

使用方法:(为sacleAnimation增加bounce插值器)

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);

九、示例

下面我把上面所有的代码集合到一个例子中,供大家下载;

效果图如下:

   

 

热门文章

暂无图片
编程学习 ·

3.1.1 Jsoup环境搭建

Jsoup是一款基于Java语言开发的开源项目,主要用于请求URL获取网页内容、解析HTML和XML文档。使用Jsoup可以非常轻松地构建一些轻量级的网络爬虫。 在Idea或者Eclipse中创建Maven工程,并在Maven工程的pom.xml文件中添加Jsoup对应的dependency,本专栏采用的版本是1.11.3。 <…
暂无图片
编程学习 ·

ClassName(类名)命名

ClassName命名 ClassName的命名应该尽量精短、明确,必须以字母开头命名,且全部字母为小写,单词之间统一使用下划线 “_” 连接。 eg:.nav_top 注意事项 ad、banner、gg、guanggao 等有机会和广告挂勾的字眠不建议直接用来做ClassName,因为有些浏览器插件(Chrome的广告拦截…
暂无图片
编程学习 ·

IT系统稳定性创新者:分布式软件,“笨马”先跑

(PerfMa CEO 李嘉鹏)早在2006年前后,IT系统稳定性就成为了当时集中式架构的挑战。随着互联网的快速兴起,当时的“Unix+小型机”架构遭遇了数据爆增的冲击。特别是在线交易、商业分析和数据库等关键业务系统,在2010年前后进入了TB甚至PB级,导致传统IT架构不堪重负,对IT系统…
暂无图片
编程学习 ·

异步FIFO学习

这里写自定义目录标题一、概述二、异步FIFO的设计基础2.1 FIFO指针2.2 格雷码的使用2.2.1 二进制码存在的问题2.2.2 格雷码计数器2.3 空满条件的判断三、异步FIFO设计实现3.1 fifo13.2 fifomem3.3 sync_r2w3.4 sync_w2r3.5 rptr_empty3.6 wptr_full 一、概述 在大规模ASIC或FPG…
暂无图片
编程学习 ·

【阿里云】学生成长计划领取资格考试答案分享

云计算及云服务器入门 刚刚尝试了阿里云的高校学生计划,完成身份和学生认证后出现了需要测试才能领取,没想到凭感觉还拿到了90分,科一科四都能过了哈哈,下面是分享,希望后半年能把这种好资源利用起来,真正学点吃饭的东西,正确答案加粗显示。 选择题单选 1.SQL语言的功能…
暂无图片
编程学习 ·

使用john软件进行账户弱口令检测实验

使用john软件进行账户弱口令检测实验 前言 在生产环境中,服务器账号的密码能够不被黑客入侵破解是尤为重要的,关系着业务正常运行的安全,所以在创建完账户的密码后,我们需要进行弱口令的检测,排查出是否有容易被破解的密码存在。 本次实验使用的破解密码软件是john-1.8.0版…
暂无图片
编程学习 ·

COMP9101学习笔记 贪心算法的应用

1. 霍夫曼编码 (The Huffman Code) 1.1 怎么定义好的编码? 由于计算机处理二进制位序列,人们需要一种编码模式将文本处理成二进制位的长串,以英文为例,26个字母,空格和5种标点符号共32个符号需要编码,以二进制表示则需要5位编码(25=322^5 = 3225=32),比如00000代表字…
暂无图片
编程学习 ·

Java四种访问权限从大大小排列

public:可以被所有其他类所访问 protected:自身、子类及同一个包中类可以访问 default:同一包中的类可以访问,声明时没有加修饰符,认为是friendly private:只能被自己访问和修改。 public: 具有最大的访问权限,可以访问任何一个在classpath下的类、接口、异常等。它往往…
暂无图片
编程学习 ·

一起Talk Android吧(第二百五十五回:Android中的Toolbar标题一)

各位看官们大家好,上一回中咱们说的是Android中Toolbar的例子,这一回咱们继续说该例子。闲话休提,言归正转。让我们一起Talk Android吧! 看官们,我们在前面章回中介绍完了Toolbar的导航,本章回中将介绍Toolbar的标题。标题位于导航右侧,用来提示程序的内容或者当前页面的…
暂无图片
编程学习 ·

手把手撸一个轮播图

轮播图HTML和CSSJS HTML和CSS <!DOCTYPE html> <html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>轮播图</titl…
暂无图片
编程学习 ·

Z字型变换(Go,LeetCode)

目录题目描述解决方案代码代码走读传送门题目描述将一个给定字符串根据给定的行数,以从上往下、从左到右进行Z字形排列。比如输入字符串为 LEETCODEISHIRING ,行数为3时,排列如下:L C I R E T O E S I I G E D H N之后,你的输出需要从左往右逐行读取,产生出一…
暂无图片
编程学习 ·

不使用乘法、除法和mod,实现两数相除

被除数除数=商+余数 需要注意的问题:int 的范围是[-2^31,2^31-1],也就是【-2147483648,2147483647】,如果-2147483648/-1结果会超出int 范围。 除法,乘法和mod都不能使用,那可以使用加减,移位。 只需保留商即可 保证数据在int范围。电脑做二进制除法的时候,是让被除数连…
暂无图片
编程学习 ·

从永远到永远-SpringCloud项目实战(七)-前端框架NUXT

1、什么是服务端渲染 服务端渲染又称SSR (Server Side Render)是在服务端完成页面的内容,而不是在客户端通过AJAX获取数据。 服务器端渲染(SSR)的优势主要在于:更好的 SEO,由于搜索引擎爬虫抓取工具可以直接查看完全渲染的页面。 如果你的应用程序初始展示 loading 菊花图,…
暂无图片
编程学习 ·

DFuseNet论文阅读笔记

原文连接:https://arxiv.org/abs/1902.00761DFuseNet:利用RGB和稀疏深度信息的深度融合,完成图像引导的稠密深度补全 Shreyas S. Shivakumar, Ty Nguyen, Ian D. Miller, Steven W. Chen, Vijay Kumar and Camillo J. Taylor摘要:我们在文章中提出了一个卷积神经网络,该网…
暂无图片
编程学习 ·

数据结构与算法(Python版)五十四:AVL树的定义和性能

平衡二叉查找树: AVL树的定义 我们来看看能够在key插入时一直保持平衡的二叉查找树: AVL树 AVL是发明者的名字缩写: G.M. AdelsonVelskii and E.M. Landis 利用AVL树实现ADT Map, 基本上与BST的实现相同 不同之处仅在于二叉树的生成与维护过程 AVL树的实现中, 需要对每个节…
暂无图片
编程学习 ·

Codeforces 1093D Beautiful Graph(二分图染色+组合数学)

传送门发这篇只是为了记录一个容易TLE的坑点:对于这种多组数据,所有数据n之和不超过3e5的题,初始化的时候要for 1 to n,而不能memset,否则比如30000组数据每组n为10,那么如果memset进行30000次的复杂度就会炸......#include<cstdio> #include<cstring> #incl…