TranslateAnimation:位移动画
同样,创建TranslateAnimation也有两种方式
- XML文件+Java代码
- Java代码方式
第一种方式:XML文件+Java代码
示例效果图:
语法:
<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="3000"
android:fillAfter="true"
android:fillBefore="false"
android:fromXDelta="0"
android:fromYDelta="0"
android:interpolator="@android:anim/linear_interpolator"
android:repeatCount="-1"
android:repeatMode="reverse"
android:startOffset="2000"
android:toXDelta="200%"
android:toYDelta="0%"/>
Java加载XML代码
TranslateAnimation translateAnimation = (TranslateAnimation) AnimationUtils.loadAnimation(XmlViewAnimationActivity.this, R.anim.translate);
mIvImg.startAnimation(scaleAnimation);
- android:duration:动画持续时长
- android:fillAfter:动画结束之后是否保持动画的最终状态;true,表示保持动画的最终状态
- android:fillBefore:动画结束之后是否保持动画开始前的状态;true,表示恢复到动画开始前的状态
- android:fromXDelta:动画开始时,在X轴方向上的位置;取值类型有三种:数字;百分比;百分比+”p”;
- 数字:例如50.0,这里的单位是px像素
- 百分比:例如50%,这里是相对于自己控件宽度的百分比,实际的值是mIvImg.getWidth()*50%;
- 百分比+”p”:例如50%p,这里是表示相对于自己控件的父控件的百分比,
- android:fromYDelta:动画开始时,在Y轴方向上的位置;取值类型同上
- android:interpolator:动画插值器。是实现动画不规则运动的一种方式,后面讲到
- android:repeatCount:动画重复的次数。指定动画重复播放的次数,如果你需要无限循环播放,请填写一个小于0的数值,我一般写-1
- android:repeatMode:动画重复的Mode,有reverse和restart两种,效果看后面
- android:startOffset:动画播放延迟时长,就是调用start之后延迟多少时间播放动画
- android:toXDelta:动画移动在X轴的目标位置;取值类型和fromXDelta一样
- android:toYDelta:动画移动在Y轴的目标位置;取值类型同上
位移的方向坐标,参考这张图
其他的参数都在前面讲过了, 这里不同的之后四个:
开始时的位置: android:fromXDelta/android:fromYDelta 和 目标位置: android:toXDelta/android:toYDelta
- 取值类型有三种:数字;百分比;百分比+”p”;
- 数字:例如50.0,这里的单位是px像素
- 百分比:例如50%,这里是相对于自己控件宽度的百分比,实际的值是mIvImg.getWidth()*50%;
- 百分比+”p”:例如50%p,这里是表示相对于自己控件的父控件的百分比,
这里拿:android:toXDelta/android:toYDelta来举例子
第一种:数字类型。表示的是px像素
当android:toXDelta=”100”,android:toYDelta=”0”
translate.xml
<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="3000"
android:fillAfter="true"
android:fillBefore="false"
android:fromXDelta="0"
android:fromYDelta="0"
android:interpolator="@android:anim/linear_interpolator"
android:repeatCount="-1"
android:repeatMode="reverse"
android:startOffset="2000"
android:toXDelta="200"
android:toYDelta="200"/>
一个从初始控件的位置开始,一个在X轴移动200px像素的位移动画
第二种:百分数类型。表示相对于自己控件宽高的百分比
当android:toXDelta=”200%”, android:toYDelta=”0%”时;
translate.xml
<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="3000"
android:fillAfter="true"
android:fillBefore="false"
android:fromXDelta="0"
android:fromYDelta="0"
android:interpolator="@android:anim/linear_interpolator"
android:repeatCount="-1"
android:repeatMode="reverse"
android:startOffset="2000"
android:toXDelta="200%"
android:toYDelta="0%"/>
一个以自己控件的位置为七点,向X轴方向移动自己控件宽度200%距离的位移动画
第三种:百分数+”p”。表示自己控件父控件的百分比
当android:toXDelta=”90%p”,andorid:toYDelta=”0%p”时,(这里写90%p是为了方便观看效果100%p就飘出屏幕了)
translate.xml
<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="3000"
android:fillAfter="true"
android:fillBefore="false"
android:fromXDelta="0"
android:fromYDelta="0"
android:interpolator="@android:anim/linear_interpolator"
android:repeatCount="-1"
android:repeatMode="reverse"
android:startOffset="2000"
android:toXDelta="90%p"
android:toYDelta="0%p"/>
一个以自己控件的初始位置开始,向X轴方向移动它父控件宽度90%的位移动画,(因为现在这个图片的的父容器是整个屏幕)
同样android:toYDelta、android:fromXDelta、android:fromYDelta都可以这样设置参数,这里只是单独改变一个android:toXDelta来方便观看效果
Java代码方式创建动画
用XML文件的形式创建会提供设置TranslateAnimation相应的属性,同样Java代码也提供了相应的方法去设置
public void startTranslateAnimation(View view) {
/**
* TranslateAnimation第一种构造
*
* @param fromXDelta X方向开始的位置,取值类型是float,单位是px像素
* @param toXDelta X方向结束的位置,取值类型是float,单位是px像素
* @param fromYDelta Y方向开始的位置,同上
* @param toYDelta Y方向结束的位置,同上
*/
TranslateAnimation translateAnimation = new TranslateAnimation(0, mIvImg.getWidth() * 2, 0, mIvImg.getHeight());
/**
* TranslateAnimation第二种构造 在第一种构造的基础上增加了,移动距离的取值方式,通过Type来约束
*
* @param fromXType 用来约束pivotXValue的取值。取值有三种:Animation.ABSOLUTE,Animation.RELATIVE_TO_SELF,Animation.RELATIVE_TO_PARENT
* Type:Animation.ABSOLUTE:绝对,如果设置这种类型,后面pivotXValue取值就必须是像素点;比如:在X方向上移动自己宽度的距离,fromXValue的取值是mIvTranslate.getWidth()
* Animation.RELATIVE_TO_SELF:相对于控件自己,设置这种类型,后面pivotXValue取值就会去拿这个取值是乘上控件本身的宽度;比如:在X方向上移动自己宽度的距离,fromXValue的取值是1.0f
* Animation.RELATIVE_TO_PARENT:相对于它父容器(这个父容器是指包括这个这个做动画控件的外一层控件), 原理同上,
* @param fromXValue 配合fromXType使用,原理在上面
* @param toXType 原理同上
* @param toXValue 原理同上
* @param fromYType 原理同上
* @param fromYValue 原理同上
* @param toYType 原理同上
* @param toYValue 原理同上
*/
TranslateAnimation translateAnimation1 = new TranslateAnimation(TranslateAnimation.ABSOLUTE, mIvImg.getWidth(), TranslateAnimation.ABSOLUTE, mIvImg
.getWidth() * 2f, TranslateAnimation.RELATIVE_TO_SELF, 0f, TranslateAnimation.RELATIVE_TO_SELF, 0);
//设置动画持续时长
translateAnimation1.setDuration(3000);
//设置动画结束之后的状态是否是动画的最终状态,true,表示是保持动画结束时的最终状态
translateAnimation1.setFillAfter(true);
//设置动画结束之后的状态是否是动画开始时的状态,true,表示是保持动画开始时的状态
translateAnimation1.setFillBefore(true);
//设置动画的重复模式:反转REVERSE和重新开始RESTART
translateAnimation1.setRepeatMode(ScaleAnimation.REVERSE);
//设置动画播放次数
translateAnimation1.setRepeatCount(ScaleAnimation.INFINITE);
//开始动画
mIvImg.startAnimation(translateAnimation1);
//清除动画
mIvImg.clearAnimation();
//同样cancel()也能取消掉动画
translateAnimation1.cancel();
}