view动画
动画的类型
Tween动画,通过对 View 的内容进行一系列的图形变换 (包括平移、缩放、旋转、改变透明度)来实现动画效果。动画效果的定义可以采用XML来做也可以采用编码来做。Tween动画有4种类型:
1. 渐变透明度动画效果
1. Xml定义动画使用的配置节点:<alpha/
2. 编码定义动画使用的类:AlphaAnimation
在代码中创建时,代码编写如下:
/** * TODO 1、渐变透明度动画效果 * @param view */ public void alpha(View v) { // 1、创建alpha动画 AlphaAnimation animation = new AlphaAnimation(0.5f, 1.0f);// 透明度,1.0f不透明,负数也没有关系 // 设置 //动画持续时长 animation.setDuration(2000); // 重复次数,"TranslateAnimation.INFINITE"代表的是:-1,无限循环 animation.setRepeatCount(TranslateAnimation.INFINITE); // 指定重复播放的模式 // REVERSE:反转,RESTART:默认,重新开始 animation.setRepeatMode(TranslateAnimation.REVERSE); alpha.setFillAfter(true);// true,表示停在后面的状态不变化 // 让图片播放这个动画 iv.startAnimation(animation); }
在xml文件创建动画,整体代码编写如下
//在xml文件中的编写部分 <?xml version="1.0" encoding="utf-8"?> <alpha xmlns:android="http://schemas.android.com/apk/res/android" android:fromAlpha="0" android:toAlpha="1.0" android:duration="3000" android:repeatCount="2" android:repeatMode="reverse"> </alpha> //再用代码吧xml文件的内容读取出来 public void alpha(View v) { //用动画工具类读取xml文件,转换成Animation对象 Animation alpha = AnimationUtils.loadAnimation(this, R.anim.alpha_demo); //开启动画 iv_image.startAnimation(alpha); }
2. 渐变尺寸缩放动画效果
1. Xml定义动画使用的配置节点:<scale/>
2. 编码定义动画使用的类:ScaleAnimation
在代码中创建时,代码编写如下
/** * TODO 1、渐变尺寸缩放动画效果 * @param view */ public void scale(View v) { ScaleAnimation animation = new ScaleAnimation(3, 1, // x方向,从什么倍数到什么倍数 3, 1,// y方向,从什么倍数到什么倍数 Animation.RELATIVE_TO_SELF, 0.5f, // 放大的中心点 x方向 Animation.RELATIVE_TO_SELF, 0.5f); // 放大的中心店 y方向 // 定义动画时长 .setDuration(2000); // 无限循环播放 animation.setRepeatCount(TranslateAnimation.INFINITE); // 指定重复播放的模式 animation.setRepeatMode(TranslateAnimation.REVERSE); // 让图片播放这个动画 iv_image.startAnimation(animation); }
在xml文件中创建动画,整体代码编写如下:
<?xml version="1.0" encoding="utf-8"?> <scale xmlns:android="http://schemas.android.com/apk/res/android" android:fromXScale="0.0" android:fromYScale="0.0" android:pivotX="5" android:pivotY="5" android:toXScale="50%" android:toYScale="50%" android:duration="5000" android:repeatCount="3" > </scale> //再在代码中读取xml文件中的内容,把xml文件中的内容转化成Animation对象 public void scale(View v) { //用动画工具类来转换xml文件中的内容 Animation scale = AnimationUtils.loadAnimation(this,R.anim.scale_demo); iv_image.startAnimation(scale); }
- 一些参数的解释
- 动画的进度使用interpolator控制,android提供了几个Interpolator 子类,实现了不同的速度曲线,如LinearInterpolator实现了匀速效果、Accelerateinterpolator实现了加速效果、DecelerateInterpolator实现了减速效果等。还可以定义自己的Interpolator子类,实现抛物线、自由落体等物理效果。
- fromXScale(浮点型) 属性为动画起始时X坐标上的缩放尺寸
- fromYScale(浮点型) 属性为动画起始时Y坐标上的缩放尺寸
- toXScale(浮点型) 属性为动画结束时X坐标上的缩放尺寸
- toYScale(浮点型) 属性为动画结束时Y坐标上的缩放尺寸
- 说明: 以上四种属性值
- 0.0表示收缩到没有
- 1.0表示正常无缩放
- 值小于1.0表示收缩
- 值大于1.0表示放大
- pivotX(浮点型) 属性为动画相对于物件的X坐标的开始位置
- pivotY(浮点型) 属性为动画相对于物件的Y坐标的开始位置
- 说明:
- 以上两个属性值 从0%-100%中取值
- 50%为物件的X或Y方向坐标上的中点位置
- duration(长整型)属性为动画持续时间 。说明: 时间以毫秒为单位
- fillAfter(布尔型)属性当设置为true,该动画转化在动画结束后被应用
3. 画面位置移动动画效果
1. Xml定义动画使用的配置节点:<translate/>
2. 编码定义动画使用的类:TranslateAnimation
在代码中创建时代码编写如下:
/** * TODO 3、画面位置移动动画效果 * @param view */ public void translate(View v) { /* * RELATIVE_TO_PARENT :相对屏幕的宽高来说 倍数 * RELATIVE_TO_SELF :相对自己控件的宽高来说 倍数 * Animation.ABSOLUTE :绝对值 指的是像素 */ TranslateAnimation animation = new TranslateAnimation( Animation.RELATIVE_TO_PARENT, 0, Animation.RELATIVE_TO_PARENT, 0.5f, Animation.RELATIVE_TO_PARENT, 0, Animation.RELATIVE_TO_PARENT, 0); // 定义动画时长 animation.setDuration(2000); // 无限循环播放 animation.setRepeatCount(TranslateAnimation.INFINITE); // 指定重复播放的模式 animation.setRepeatMode(TranslateAnimation.RESTART); // 让图片播放这个动画 iv.startAnimation(animation); }
在xml文件中创建动画,整体代码编写如下:
<?xml version="1.0" encoding="utf-8"?> <translate xmlns:android="http://schemas.android.com/apk/res/android" android:fromXDelta="0" android:toXDelta="50%" android:fromYDelta="0" android:toYDelta="50%" android:duration="2000" android:repeatCount="3" android:repeatMode="reverse"> </translate> //在代码中把xml文件转化成Animation对象 public void translate(View v) { //加载动画XML文件,生成动画指令 Animation animation = AnimationUtils.loadAnimation(this, R.anim.translate_demo); //开始执行动画 iv_image.startAnimation(animation); }
- 一些参数的解析
- 1.
4. 画面旋转动画效果
1. Xml定义动画使用的配置节点:<rotate/>
2. 编码定义动画使用的类:RotateAnimation
在代码中创建时代码编写如下:
/** * TODO 4、画面旋转动画效果 * @param view */ public void rotate(View v) { RotateAnimation animation = new RotateAnimation(0, 360,// 从什么角度旋转到什么角度 Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f);//以自身中点为圆心,旋转360 // 定义动画时长 animation.setDuration(2000); // 无限循环播放 animation.setRepeatCount(TranslateAnimation.INFINITE); // 指定重复播放的模式 animation.setRepeatMode(TranslateAnimation.REVERSE); // 让图片播放这个动画 iv.startAnimation(animation); }
在xml文件中创建动画,编码如下
<?xml version="1.0" encoding="utf-8"?> <rotate xmlns:android="http://schemas.android.com/apk/res/android" android:fromDegrees="0" android:toDegrees="90" android:pivotX="50%" android:pivotY="50%" android:duration="2000" android:repeatCount="3" android:repeatMode="reverse"> </rotate> //再在代码中把xml文件中的内容转化成Animation对象 public void rotate(View v) { Animation rotate = AnimationUtils.loadAnimation(this, R.anim.rotate_demo); iv_image.startAnimation(rotate); }
- 一些参数
- repeatCount 重复次数
- fromDegrees为动画起始时物件的角度:
- 当角度为负数——表示逆时针旋转
- 当角度为正数——表示顺时针旋转
- (负数fromDegrees——toDegrees正数:顺时针旋转)
- (负数fromDegrees——toDegrees负数:逆时针旋转)
- (正数fromDegrees——toDegrees正数:顺时针旋转)
- (正数fromDegrees——toDegrees负数:逆时针旋转)
- toDegrees属性为动画结束时物件旋转的角度 可以大于360度
- pivotX,pivotY 为动画相对于物件的X、Y坐标的开始位.说明:以上两个属性值 从0%-100%中取值,50%为物件的X或Y方向坐标上的中点位置
集合动画
在代码中编写集合动画
public void set(View v){ //包含 平移动画 、 旋转动画 // Interpolator : 插入器 false : 每个动画使用自己的插入器, true: 大家都使用集合里面的插入器,使用同一 AnimationSet set = new AnimationSet(false); //定义平移动画 TranslateAnimation animation = new TranslateAnimation( Animation.ABSOLUTE, 0, Animation.ABSOLUTE, 200, Animation.ABSOLUTE, 0, Animation.ABSOLUTE, 0); // 定义动画时长 animation.setDuration(2000); // 无限循环播放 animation.setRepeatCount(TranslateAnimation.INFINITE); // 指定重复播放的模式 animation.setRepeatMode(TranslateAnimation.REVERSE); /**///定义旋转动画 RotateAnimation ranimation = new RotateAnimation(0, 360,// 从什么角度旋转到什么角度 Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF,0.5f); // 定义动画时长 ranimation.setDuration(2000); // 无限循环播放 ranimation.setRepeatCount(TranslateAnimation.INFINITE); // 指定重复播放的模式 ranimation.setRepeatMode(TranslateAnimation.REVERSE); ScaleAnimation sanimation = new ScaleAnimation(1, 2, // x方向,从什么倍数到什么倍数 1, 2,// y方向,从什么倍数到什么倍数 Animation.RELATIVE_TO_SELF, 0.5f, // 放大的中心点 x方向 Animation.RELATIVE_TO_SELF, 0.5f); // 放大的中心店 y方向 // 定义动画时长 sanimation.setDuration(2000); // 无限循环播放 sanimation.setRepeatCount(TranslateAnimation.INFINITE); // 指定重复播放的模式 sanimation.setRepeatMode(TranslateAnimation.REVERSE); AlphaAnimation aanimation = new AlphaAnimation(0, 1); // 定义动画时长 aanimation.setDuration(2000); // 无限循环播放 aanimation.setRepeatCount(TranslateAnimation.INFINITE); // 指定重复播放的模式 aanimation.setRepeatMode(TranslateAnimation.REVERSE); //把不同的动画设置到集合中去 set.addAnimation(animation); set.addAnimation(ranimation); set.addAnimation(aanimation); //播放集合动画 iv.startAnimation(set);
}
在xml文件中编写集合动画
<?xml version="1.0" encoding="utf-8"?> <set xmlns:android="http://schemas.android.com/apk/res/android" > <alpha android:duration="3000" android:fromAlpha="0" android:repeatCount="3" android:repeatMode="reverse" android:toAlpha="1.0" > </alpha> <translate android:duration="3000" android:fromXDelta="0" android:fromYDelta="0" android:repeatCount="3" android:repeatMode="reverse" android:toXDelta="30%p" android:toYDelta="30%p" > </translate> <scale android:duration="3000" android:fromXScale="1.0" android:fromYScale="1.0" android:pivotX="3" android:pivotY="3" android:repeatCount="3" android:toXScale="50%" android:toYScale="50%" /> </set> //再在代码中把xml文件转化成Animation对象 // 动画集合 public void set(View v) { Animation set = AnimationUtils.loadAnimation(this, R.anim.set_demo); iv_image.startAnimation(set); }