补间动画(Tween Animation)
补间动画与逐帧动画在本质上是不同的,逐帧动画通过连续播放图片来模拟动画的效果,而补间动画则是通过在两个关键帧之间补充渐变的动画效果来实现的。补间动画的优点是可以节省空间。
目前Android应用框架支持的补间动画效果有以下5种。具体实现在android.view.animation类库中。
AlphaAnimation:透明度(alpha)渐变效果,对应<alpha/>标签。
TranslateAnimation:位移渐变,需要指定移动点的开始和结束坐标,对应<translate/>标签。
ScaleAnimation:缩放渐变,可以指定缩放的参考点,对应<scale/>标签。
RotateAnimation:旋转渐变,可以指定旋转的参考点,对应<rotate/>标签。
AnimationSet:组合渐变,支持组合多种渐变效果,对应<set/>标签。
补间动画的效果同样可以使用XML语言来定义,这些动画模板文件通常会被放在Android项目的res/anim/目录下。
alpha_anim.xm;
<?xml version="1.0" encoding="utf-8"?> <alpha xmlns:android="http://schemas.android.com/apk/res/android" android:fromAlpha="0.0" android:toAlpha="0.5" android:duration="8000" android:fillAfter="true" android:repeatCount="infinite" android:repeatMode="reverse" > </alpha> <!-- alpha 通过控制透明度实现动画的效果 透明度的变化情况 0.0-1.0 0.0完全透明 1.0表示完全不透明 android:fromAlpha="浮点" 设置动画的起始的透明度 android:toAlpha="浮点" 设置动画的结束的透明度 以下属性的设置补间动画都可可以设置 android:duration="时间的毫秒值" 设置动画的持续时间 android:fillAfter="true" 指定为true表示动画结束时维持在最终的状态 默认恢复到原始状态 android:repeatCount="infinite" 动画默认执行一次 infinite表示动画一直执行 android:repeatMode="" 设置动画的重复启动模式 restart表示动画一直从from变化到to reverse 表示动画从from-to-from-to -->scale_anim.xml
<?xml version="1.0" encoding="utf-8"?> <scale xmlns:android="http://schemas.android.com/apk/res/android" android:fromXScale="1.0" android:toXScale="0.5" android:fromYScale="1.0" android:toYScale="0.5" android:pivotX="50%" android:pivotY="50%" android:duration="2000" android:fillAfter="true" >translate_anim.xml<!-- scale 缩放 通过尺寸的改变实现动画效果 android:fromXScale="" 表示动画起始x轴的尺寸 android:fromYScale="" 表示动画起始y轴的尺寸 android:toXScale="" 表示动画结束x轴的尺寸 android:toYScale="" 表示动画结束Y轴的尺寸 android:pivotX="" 表示缩放x轴的中心点 android:pivotY="" 表示缩放y轴的中心点 -->
</scale>
<?xml version="1.0" encoding="utf-8"?> <translate xmlns:android="http://schemas.android.com/apk/res/android" android:fromXDelta="0" android:toXDelta="100" android:toYDelta="300" android:fromYDelta="0" android:duration="5000" android:fillAfter="true" > <!-- 平移 位置改变的动画效果 android:fromXDelta="" 表示起始和结束x轴的变化 android:toXDelta="" android:fromYDelta="" 表示起始和结束y轴的变化 android:toYDelta="" --> </translate>rotate_anim.xml
<?xml version="1.0" encoding="utf-8"?> <rotate xmlns:android="http://schemas.android.com/apk/res/android" android:fromDegrees="-90" android:toDegrees="360" android:pivotX="50%" android:pivotY="50%" android:duration="3000" android:fillAfter="true" android:repeatCount="0" > <!-- rotate 旋转 android:fromDegrees="旋转的起始角度" android:toDegrees="旋转的结束角度" toDegrees-fromDegrees 正数 顺时针 负数 逆时针 android:pivotX="" android:pivotY=" 以x轴和y轴确定旋转中心的坐标 取值三种情况 直接指定数值 0%-100%表示旋转中心以view自身的xy作为参考 0%p-100%p 表示以view的父布局或者父容器的xy作为参 --> </rotate>set_anim.xml
<?xml version="1.0" encoding="utf-8"?> <set xmlns:android="http://schemas.android.com/apk/res/android" android:repeatMode="restart" android:repeatCount="5" > <alpha android:fromAlpha="0.0" android:toAlpha="0.8" android:duration="3000" > </alpha> <rotate android:duration="4000" android:fromDegrees="-90" android:toDegrees="90" android:pivotY="50%p" android:pivotX="50%p" > </rotate> </set>MainActivity.class
package com.yztc.tweenanimation; import android.support.v7.app.AppCompatActivity; import android.os.Bundle; import android.view.View; import android.view.animation.Animation; import android.view.animation.AnimationUtils; import android.widget.ImageView; import android.widget.Toast; /** * Tween 补间动画 * 淡入淡出 缩放 平移 旋转 * * 淡入淡出 透明度的改变 * 缩放 宽高尺寸 * 平移 位置 * 旋转 */ public class MainActivity extends AppCompatActivity { private ImageView iv; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); iv= (ImageView) findViewById(R.id.iv); iv.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { Toast.makeText(MainActivity.this,"我被点击了!",Toast.LENGTH_SHORT).show(); } }); } public void click(View view){ Animation animation=null; switch (view.getId()){ case R.id.btn_alpha://透明度 // loadAnimation(上下文,表示当前加载动画xml文件的资源id)加载动画的函数 animation= AnimationUtils.loadAnimation(MainActivity.this,R.anim.alpha_anim); break; case R.id.btn_scale://缩放 animation=AnimationUtils.loadAnimation(MainActivity.this,R.anim.scale_anim); break; case R.id.btn_route:// 旋转 animation=AnimationUtils.loadAnimation(MainActivity.this,R.anim.route_anim); break; case R.id.btn_transltion://平移 animation=AnimationUtils.loadAnimation(MainActivity.this,R.anim.translte_anim); break; case R.id.btn_all://组合 animation=AnimationUtils.loadAnimation(MainActivity.this,R.anim.set_anim); break; } //startAnimation()启动动画 iv.startAnimation(animation); } }