首页 > 代码库 > Android Tween动画

Android Tween动画

2024-07-17 00:40:04   228人阅读

View Animation， 即显示在view上的Tween Animation

Tween动画，本质上不改变View对象本身，只改变它的绘制方式

两种实现方式，一种在xml中定义，一种直接在代码里定义

xml定义方式：

位移动画translate

<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="1000"
    android:fromXDelta="10"
    android:fromYDelta="0"
    android:toXDelta="50%" 
    android:toYDelta="50%p"
    android:repeatCount="50"
    android:repeatMode="reverse"
    android:fillAfter="true">
<!-- 

repeatCount		动画再次重复的次数
repeatMode   	这一次反转上一次的效果 
fillAfter		动画结束后，view停留在动画结束时的位置  view的实际位置并没有改变
50%p 相对于父布局
50%  相对于自身
 -->
</translate>

旋转动画rotate

<?xml version="1.0" encoding="utf-8"?>
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="1000"
    android:fromDegrees="0" 
    android:toDegrees="-90"
    android:pivotX="50%"
    android:pivotY="50%"
    android:repeatCount="50"
    android:repeatMode="reverse"
    android:fillAfter="true">
<!-- 
fromDegrees="0" 	开始角度
toDegrees="-90"		结束角度
pivotX="50%"		中心点x
pivotY="50%"		中心点y
 -->
</rotate>

透明度渐变动画alpha

<?xml version="1.0" encoding="utf-8"?>
<alpha xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="1000"
    android:fromAlpha="0"
    android:toAlpha="1"
    android:fillAfter="true"
    android:repeatCount="50"
    android:repeatMode="reverse" >
<!-- 
fromAlpha	开始的透明度  0完全透明
toAlpha		结束的透明度  1完全不透明
 -->
</alpha>

缩放动画scale

<?xml version="1.0" encoding="utf-8"?>
<scale xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="1000"
    android:fromXScale="0.5"
    android:fromYScale="1"
    android:toXScale="3"
    android:toYScale="2"
    android:pivotX="50%"
    android:pivotY="50%"
    android:fillAfter="true"
    android:repeatCount="50"
    android:repeatMode="reverse"  >
<!-- 
	scale 缩放比率
 -->
</scale>

动画集

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="2000"
    android:fillAfter="true"
    android:repeatCount="50"
    android:repeatMode="reverse" >

    <scale
        android:fromXScale="0.5"
        android:fromYScale="1"
        android:pivotX="50%"
        android:pivotY="50%"
        android:repeatCount="50"
        android:repeatMode="reverse"
        android:toXScale="3"
        android:toYScale="2" />

    <alpha
        android:fromAlpha="0"
        android:repeatCount="50"
        android:repeatMode="reverse"
        android:toAlpha="1" />

    <translate
        android:fromXDelta="10"
        android:fromYDelta="0"
        android:repeatCount="50"
        android:repeatMode="reverse"
        android:toXDelta="50%"
        android:toYDelta="50%p" />

    <rotate
        android:fromDegrees="0"
        android:pivotX="50%"
        android:pivotY="50%"
        android:repeatCount="50"
        android:repeatMode="reverse"
        android:toDegrees="-100" />

</set>

代码加载这些xml定义的动画

	Animation translate = AnimationUtils.loadAnimation(this, R.anim.translate);
			imageview_translate.setBackground(getResources().getDrawable(R.drawable.a11));
			imageview_translate.startAnimation(translate);
			
			Animation rotate = AnimationUtils.loadAnimation(this, R.anim.rotate);
			imageview_rotate.setBackground(getResources().getDrawable(R.drawable.a11));
			imageview_rotate.startAnimation(rotate);
			
			Animation alpha = AnimationUtils.loadAnimation(this, R.anim.alpha);
			imageview_alpha.setBackground(getResources().getDrawable(R.drawable.a11));
			imageview_alpha.startAnimation(alpha);
			
			Animation scale = AnimationUtils.loadAnimation(this, R.anim.scale);
			imageview_scale.setBackground(getResources().getDrawable(R.drawable.a11));
			imageview_scale.startAnimation(scale);
			
			Animation set = AnimationUtils.loadAnimation(this, R.anim.set);
			imageview_set.setBackground(getResources().getDrawable(R.drawable.a11));
			imageview_set.startAnimation(set);

纯代码创建Tween Animation

AnimationSet animationSet = new AnimationSet(true);
			animationSet.addAnimation(scale);
			animationSet.addAnimation(translate);
			animationSet.addAnimation(alpha);
			animationSet.addAnimation(rotate);
			animationSet.setDuration(2000);
			animationSet.setRepeatCount(50);
			animationSet.setRepeatMode(Animation.RESTART);
//			animationSet.setRepeatMode(Animation.REVERSE);
			imageview_set.setBackground(getResources().getDrawable(R.drawable.a11));
			imageview_set.startAnimation(animationSet);
			
			TranslateAnimation translateAnimation;
			RotateAnimation rotateAnimation;
			AlphaAnimation alphaAnimation;
			ScaleAnimation scaleAnimation;
//			Animation.RELATIVE_TO_SELF	相对于自身
//			Animation.RELATIVE_TO_PARENT 相对于父View

设置动画监听器

	scale.setAnimationListener(new AnimationListener() {
				
				@Override //动画开始
				public void onAnimationStart(Animation animation) {
					
				}
				
				@Override //动画重复
				public void onAnimationRepeat(Animation animation) {
					
				}
				
				@Override //动画结束
				public void onAnimationEnd(Animation animation) {
					
				}
			});

动画插入器Interpolator

在animation的xml和代码中 可以设置动画的插入器，它用来指示动画在持续时间内的动作的速率变化

android:interpolator="@android:anim/overshoot_interpolator"OvershootInterpolator

 <!-- 
 默认情况下：动画随着时间的推移 均匀的被应用，要改变这种效果可以使用插入器
 interpolator 设置插入器
 	accelerate_interpolator  				类似加速度先小后大， 开始慢 后渐快  变速运动 
 	accelerate_decelerate_interpolator		类似加速度先大后小， 先加速 后减速	 变速运动
 	
 	anticipate_interpolator					the change starts backward then flings forward 先减(减到比开始值还小一点)，后加(加到结束值)
 	anticipate_overshoot_interpolator		先减(减到比开始值还小一点)，后加(加到比结束值还大一点，再回退到结束值)
 	overshoot_interpolator					直接加速到结束值，并比结束值还大一点，再回退到结束值
 	
 	bounce_interpolator						反弹结束时的变化 到达结束值时一会小一会大 来回两次
 	cycle_interpolator						先快速从开始到结束值，再遵循正弦模式继续运动 (左右对切，上下对切)
 	linear_interpolator						类似加速度为0，速率不变， 匀速运动 	不定义插入器时使用的默认值
 	
  -->


联系
我们