浅析Android动画(一)——Tween Anim

2017-01-14 10:45:20来源:http://www.jianshu.com/p/ed45ce7c07ce作者:JC_Hou人点击


变换动画有四种 :alpha(透明度)、translate(平移)、rotate(旋转)、scale(伸缩),动画可以在xml实现,需要在res文件夹下新建一个anim文件夹,把xml文件放在这里;当然也可以在代码中实现。



所有变换动画共有的属性
duration:动画持续时间(单位:毫秒)
fillAfter:布尔类型,表示动画结束后是否维持动画结束时的状态
fillBefore:布尔类型,表示动画结束后是否维持动画开始时的状态
interpolator:动画插值器(加速、减速等)
repeatCount:重复次数
repeatMode:重复模式,restart/reverse(顺序/倒序)
startOffset:动画延迟运行时间(单位:毫秒)



基础动画
alpha

xml形式



alpha.png

fromAlpha:表示起始透明度,0~1,0为完全透明,1为完全不透明
toAlpha:表示终止透明度,0~1,0为完全透明,1为完全不透明

xml文件的使用方法都是以下这样:
使用方法:


//通过AnimationUtils的loadAnimation调取xml动画文件
Animation animation= AnimationUtils.loadAnimation(this,R.anim.alpha);
//启动动画
mImageView.startAnimation(animation);

代码形式


AlphaAnimation aa=new AlphaAnimation (0.1f,1f);//第一个参数为起始透明度,第二个参数为终止透明度
aa.setDuration(1000);//设置动画时间
imageView.startAnimation(aa);//启动动画

tanslate

xml形式



translate.png

fromXDelta:表示相对于自己左上角X方向上的起始位置,具体到数值,也可以用%p表示宽的百分比,如100%p表示相当于自己左上角X方向上100%宽度的距离
toXDelta:表示相对于自己左上角X方向上的终点
fromYDelta:表示相对于自己左上角Y方向上的起点
toYDelta:表示相对于自己左上角Y方向上的终点

代码形式:


TranslateAnimation ta=new TranslateAnimation (0f,100f,0f,100f);//第一个参数为X起始点,第二个参数为X终点,第三个参数为Y起始点,第四个参数为Y终点
ta.setDuration(1000);//设置动画时间
imageView.startAnimation(ta);//启动动画

rotate

xml形式



rotate.png

fromDegrees:表示起始角度
toDegrees:表示终止角度
pivotY:旋转中心相对于自身左上角Y轴上的百分比距离坐标
pivotX:旋转中心相对于自身左上角X轴上的百分比距离坐标

toDegrees大于fromDegrees为顺时针,相反为逆时针



代码形式:


//前两个参数为起始角度和终止角度;第三个和第五个参数表示旋转中心相对于自身来说,类似的还有Animation.RELATIVE_TO_PARENT相对于父布局,第四和第六个参数表示,旋转中心相对于自身左上角的X和Y方向上的百分比距离,即pivotX和pivotY属性`
`RotateAnimation ra=new RotateAnimation(0f,360f, Animation.RELATIVE_TO_SELF,0.5f,Animation.RELATIVE_TO_SELF,0.5f);
ra.setDuration(1000);//设置动画时间
imageView.startAnimation(ra);//启动动画

scale

xml形式



scale.png

fromXScale:起始时X方向上相对于原始尺寸的大小
fromYScale:起始时Y方向上相对于原始尺寸的大小
toXScale:结束时X方向上相对于原始尺寸的大小
toYScale:结束时Y方向上相对于原始尺寸的大小
pivotY:收缩中心相对于自身左上角Y轴上的百分比距离坐标
pivotX:收缩中心相对于自身左上角X轴上的百分比距离坐标
新增几个属性看下
repeatCount :重复次数,重复1次
repeatCount :重复模式,reverse在这里表示 这个动画先放大一次,在反过来缩小一次结束
interpolator :插值器
AccelerateDecelerateInterpolator============动画开始与结束的地方速率改变比较慢,在中间的时候加速。
AccelerateInterpolator===================动画开始的地方速率改变比较慢,然后开始加速。
AnticipateInterpolator ==================开始的时候向后然后向前甩。
AnticipateOvershootInterpolator=============开始的时候向后然后向前甩一定值后返回最后的值。
BounceInterpolator=====================动画结束的时候弹起。
CycleInterpolator======================动画循环播放特定的次数,速率改变沿着正弦曲线。
DecelerateInterpolator===================在动画开始的地方快然后慢。
LinearInterpolator======================以常量速率改变。
OvershootInterpolator====================向前超出一定值后再回到原来位置。


代码形式


ScaleAnimation sa=new ScaleAnimation(0f,1f,0f,1f,Animation.RELATIVE_TO_SELF,0.5f,Animation.RELATIVE_TO_SELF,0.5f);
sa.setDuration(1000);//设置动画时间
sa.setInterpolator(new AccelerateInterpolator());//设置插值器,这里表示加速动画
imageView.startAnimation(sa);//启动动画

组合动画

xml形式



set1.png

在xml中的<set>标签是AnimationSet的意思,它代表动画集合的意思,也就是在这个标签下可以有多个动画一起生效


代码形式


//先声明动画集合
AnimationSet set=new AnimationSet(true);//参数为布尔型,参数名称shareInterpolator,表示是否共享一个插值器,这里选择ture
//将上面的动画添加进去
set.addAnimation(aa);
set.addAnimation(ta);
set.addAnimation(ra);
set.addAnimation(sa);
imageView.startAnimation(set);

startOffset属性的使用

在组合动画中,如果想要达到这样一种效果,先旋转,旋转结束再进行移动,需要用到这个属性
xml形式



set2.png

startOffset属性只能在<set>标签里面声明,因此需要在一个<set>内部嵌套一个<set>
在这个布局文件中,内部的set动画就会在动画开始1秒之后才开始运作


代码形式


//先声明动画集合
AnimationSet set=new AnimationSet(true);//参数为布尔型,参数名称shareInterpolator,表示是否共享一个插值器,这里选择ture
//将上面的动画添加进去
aa.setDuration(1000);
set.addAnimation(aa);
//ta延迟1秒运行
ta.setDuration(1000);
ta.setStartOffset(1000);
set.addAnimation(ta);
//ra延迟2秒运行
ra.setDuration(1000);
ra.setStartOffset(2000);
set.addAnimation(ra);
imageView.startAnimation(set);



最新文章

123

最新摄影

微信扫一扫

第七城市微信公众平台