一、前言
Tween 动画是 Android 最早的动画框架,从 Android1.0 就开始提供。Tween 动画使用简单,功能也不强,支持代码和 xml 两种方式编写动画。
二、原理通过确定开始的视图样式、结束的视图样式、中间动画变化过程由系统补全来确定一个动画。根据不同的效果,分为四种动画:
- 平移动画(Translate)
- 缩放动画(scale)
- 旋转动画(rotate)
- 透明度动画(alpha)
1. 动画效果 xml 文件,/res/anim/translate_anim.xml
2. 代码
public class MainActivity extends AppCompatActivity {
private TextView mAnim;
private Button mPlay;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_test);
initView();
initEvent();
// 方式二:通过 TranslateAnimation 实现
Animation animation = new TranslateAnimation(0,500,0,500);
animation.setDuration(3000);
mAnim.startAnimation(animation);
}
private void initView() {
mAnim = findViewById(R.id.tv_anim);
mPlay = findViewById(R.id.btn_play);
}
private void initEvent() {
mPlay.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
// 方式一:通过加载 xml 文件实现
Animation animation = AnimationUtils.loadAnimation(MainActivity.this, R.anim.translate_anim);
mAnim.startAnimation(animation);
}
});
}
}
2. 缩放动画(Scale)
1. 动画效果 xml 文件,/res/anim/scale_anim.xml
2. 代码
public class MainActivity extends AppCompatActivity {
private TextView mAnim;
private Button mPlay;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_test);
initView();
initEvent();
// 方式二:通过 ScaleAnimation 实现
Animation animation = new ScaleAnimation(0,2,0,2,Animation.RELATIVE_TO_SELF,
0.5f,Animation.RELATIVE_TO_SELF,0.5f);
animation.setDuration(3000);
mAnim.startAnimation(animation);
}
private void initView() {
mAnim = findViewById(R.id.tv_anim);
mPlay = findViewById(R.id.btn_play);
}
private void initEvent() {
mPlay.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
// 方式一:通过加载 xml 文件实现
Animation animation = AnimationUtils.loadAnimation(MainActivity.this, R.anim.scale_anim);
mAnim.startAnimation(animation);
}
});
}
}
3.旋转动画(Rotate)
1. 动画效果 xml 文件,/res/anim/rotate_anim.xml
2. 代码
public class MainActivity extends AppCompatActivity {
private TextView mAnim;
private Button mPlay;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_test);
initView();
initEvent();
// 方式二:通过 RotateAnimation 实现
Animation animation = new RotateAnimation(0,270,Animation.RELATIVE_TO_SELF,
0.5f,Animation.RELATIVE_TO_SELF,0.5f);
animation.setDuration(3000);
mAnim.startAnimation(animation);
}
private void initView() {
mAnim = findViewById(R.id.tv_anim);
mPlay = findViewById(R.id.btn_play);
}
private void initEvent() {
mPlay.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
// 方式一:通过加载 xml 文件实现
Animation animation = AnimationUtils.loadAnimation(MainActivity.this, R.anim.rotate_anim);
mAnim.startAnimation(animation);
}
});
}
}
4.透明度动画(Alpha)
1. 动画效果 xml 文件,/res/anim/alpha_anim.xml
2. 代码
public class MainActivity extends AppCompatActivity {
private TextView mAnim;
private Button mPlay;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_test);
initView();
initEvent();
// 方式二:通过 AlphaAnimation 实现
Animation animation = new AlphaAnimation(1,0);
animation.setDuration(3000);
mAnim.startAnimation(animation);
}
private void initView() {
mAnim = findViewById(R.id.tv_anim);
mPlay = findViewById(R.id.btn_play);
}
private void initEvent() {
mPlay.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
// 方式一:通过加载 xml 文件实现
Animation animation = AnimationUtils.loadAnimation(MainActivity.this, R.anim.alpha_anim);
mAnim.startAnimation(animation);
}
});
}
}
5. 组合动画
上面讲的都是单个动画效果,但实际中很多需求都需要同时使用平移、缩放、旋转 & 透明度4种动画,即组合动画。 1. 动画效果 xml 文件,/res/anim/combination_anim.xml
2. 代码
public class MainActivity extends AppCompatActivity {
private TextView mAnim;
private Button mPlay;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_test);
initView();
initEvent();
// 方式二:通过 AnimationSet 实现
AnimationSet animation = new AnimationSet(true);
animation.setRepeatMode(Animation.RESTART);
animation.setRepeatCount(1);
//子动画1: 旋转动画
Animation rotate = new RotateAnimation(0,360,Animation.RELATIVE_TO_SELF,
0.5f,Animation.RELATIVE_TO_SELF,0.5f);
rotate.setDuration(1000);
rotate.setRepeatMode(Animation.RESTART);
rotate.setRepeatCount(Animation.INFINITE);
// 子动画2:平移动画
Animation translate = new TranslateAnimation(TranslateAnimation.RELATIVE_TO_PARENT, -0.5f,TranslateAnimation.RELATIVE_TO_PARENT,
0.5f,TranslateAnimation.RELATIVE_TO_SELF,0,TranslateAnimation.RELATIVE_TO_SELF,0);
translate.setDuration(10000);
// 子动画3:透明度动画
Animation alpha = new AlphaAnimation(1,0);
alpha.setDuration(3000);
alpha.setStartOffset(7000);
// 子动画4:缩放动画
Animation scale = new ScaleAnimation(1,0.5f,1,0.5f,Animation.RELATIVE_TO_SELF,
0.5f,Animation.RELATIVE_TO_SELF,0.5f);
scale.setDuration(1000);
scale.setStartOffset(4000);
animation.addAnimation(rotate);
animation.addAnimation(translate);
animation.addAnimation(alpha);
animation.addAnimation(scale);
mAnim.startAnimation(animation);
}
private void initView() {
mAnim = findViewById(R.id.tv_anim);
mPlay = findViewById(R.id.btn_play);
}
private void initEvent() {
mPlay.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
// 方式一:通过加载 xml 文件实现
Animation animation = AnimationUtils.loadAnimation(MainActivity.this, R.anim.combination_anim);
mAnim.startAnimation(animation);
}
});
}
}