引言
学习完上一篇Android 开发】帧动画(Frame animation)详解,我们接着来学习三大动画之补间动画。
内容简概
一、概念及常用方法
二、案例——透明度、缩放、平移、旋转、组合动画
三、运行效果
具体内容
一、概念及常用方法
Tween Animation 补间动画(又叫view动画),是通过对场景里的对象不断做图像变换(透明度、缩放、平移、旋转)
从而产生动画效果,是一种渐进式动画,并且支持自定义。还可以将四种变换任意组合构成组合动画。
补间动画只是改变了View的显示效果而已,并不会真正的改变View的属性。而属性动画可以改变View的显示效果和属性
。什么意思呢?例如屏幕左上角有一个Button按钮,使用补间动画将其移动到右下角,此刻你去点击右下角的Button,不会响应点击事件,点击左上角,也就是Button初始位置才会响应点击事件。补间动画感觉就只是虚晃一招,让人看起来它真的移动或者改变了某控件,但其实它并没有真的改变控件。感觉它好像一个骗子ヾ(⌐ ■_■)。
下面介绍一些常用方法:
名称 | 标签 | 子类 | 作用 |
---|---|---|---|
平移动画 | TranslateAnimation | 平移 | |
缩放动画 | ScaleAnimation | 放大或缩小 | |
旋转动画 | RotateAnimation | 旋转 | |
透明度动画 | AlphaAnimation | 改变View透明度 |
方法 | 作用 |
---|---|
fromXDelta | 动画起始时的X坐标 |
toXDelta | 动画结束时的X坐标 |
上边两种属性还可以加上%和p | toXDelta="100%",表示自身的100% toXDelta="80%p"表示父层View的80% |
fromAlpha | 动画起始时的透明度 |
toXDelta | 动画结束时的透明度 |
duration | 动画持续时间,毫秒为单位 |
fillAfter="true" | 动画结束后,保持结束时的状态 |
fillBefore="true" | 动画结束后,恢复为初始状态 |
repeatCount="5" | 重复次数,取值为-1时无限重复,默认动画执行一次 |
repeatMode ="reverse" | 重复模式,有reverse和restart两个值,前者为倒序回放,后者为重新开始 |
bounce_interpolator | 回弹效果 |
linear_interpolator | 匀速 |
accelerate_interpolator | 加速 |
decelerate_interpolator | 减速 |
shareInterpolator | 是否给所有子元素共享动画变化速度 |
二、案例——透明度、缩放、平移、旋转、组合动画
(一)anim
- 准备一张图片,放到res/drawable下
-
在res下创建一个anim文件夹,分别创建五个类型的xml文件
- 在每个xml文件中设置属性
- alpha
设置透明度为不透明到全透明,时间为1秒。
- rotate
设置从0°旋转至90°,旋转起点 X 轴坐标为原点坐标加上自己宽度的 50%(即控件水平中心)。还设置了回弹的效果(bounce_interpolator)
- scale
从0放大到图片1.5倍大。缩放起始点X坐标为自身的50%(横向中心点),缩放起始点Y坐标为0(图片的顶部)。
- translate
从图片底部位置开始,沿y轴方向移动到图片顶部位置(相对于图片的初始位置),并设置动画重复次数为5次,执行完一次倒放(reverse)
- set
构建了一个组合动画,图片向右平移,透明度从0.1到1,从0放大到1.5倍,旋转360°,四种动画同时执行(shareInterpolator),动画结束后保持结束位置(fillAfter)
(二)activity_main
配置布局属性如下:创建五个按钮,设置操作的图片。
在上一篇文章中,我用了onClick方法实现按钮点击,但这次的按钮太多了,如果还用onClick方法,代码量感觉有点多,所以我换了个方法,直接在xml中调用onClick属性
,然后在主函数里实现。
(三)MainActivity
最后编写主函数。
public class MainActivity extends AppCompatActivity{
private ImageView img;
private Animation animation;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
img = findViewById(R.id.tween_img);
}
// 加载动画
public void OnAlpha(View view) {
animation = AnimationUtils.loadAnimation(MainActivity.this, R.anim.alpha);
img.startAnimation(animation);
}
public void OnScale(View view) {
animation = AnimationUtils.loadAnimation(MainActivity.this, R.anim.scale);
img.startAnimation(animation);
}
public void OnTranslate(View view) {
animation = AnimationUtils.loadAnimation(MainActivity.this, R.anim.translate);
img.startAnimation(animation);
}
public void OnRotate(View view) {
animation = AnimationUtils.loadAnimation(MainActivity.this, R.anim.rotate);
animation.getFillAfter();
img.startAnimation(animation);
}
public void OnSet(View view) {
animation = AnimationUtils.loadAnimation(MainActivity.this, R.anim.set);
img.startAnimation(animation);
}
}
三、运行效果
-
alpha(透明度)
-
scale(缩放)
-
translate(平移)
-
rotate(旋转)
-
set(组合)
后记
逐帧动画和补间动画的区别于各自的优缺点
参考文章——Android补间动画