Android——基本动画的使用

---

帧动画

1.在drawable文件中定义帧动画的xml文件

<?xml version="1.0" encoding="utf-8"?>
<!-- oneshot为true：只播放一次 -->
<animation-list xmlns:android="http://schemas.android.com/apk/res/android"
    android:oneshot="false">
    <item android:drawable="@drawable/cat1"
        android:duration="80"/>
    <item android:drawable="@drawable/cat2"
        android:duration="80"/>
    <item android:drawable="@drawable/cat3"
        android:duration="80"/>
</animation-list>
1
2
3
4
5
6
7
8
9
10
11

2.在Activity布局中添加播放动画的View
3.添加背景drawable为动画xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".AnimActivity">

    <ImageView
        android:layout_gravity="center_horizontal"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@drawable/frame_anim"
        android:id="@+id/iv_anim"/>

   <LinearLayout
       android:layout_width="match_parent"
       android:layout_height="40dp"
       android:orientation="horizontal">
       <Button
           android:layout_width="0dp"
           android:layout_weight="1"
           android:layout_height="match_parent"
           android:text="播放"
           android:id="@+id/btn_start"/>
       <Button
           android:layout_width="0dp"
           android:layout_weight="1"
           android:layout_height="40dp"
           android:text="暂停"
           android:id="@+id/btn_stop"/>
   </LinearLayout>

</LinearLayout>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34

4.开始/暂停动画

AnimationDrawable mAnimationDrawable;
mAnimationDrawable = (AnimationDrawable) mIvAnim.getBackground();
mAnimationDrawable.start();
mAnimationDrawable.stop();

1
2
3
4
5

---

补间动画

android提供的补间动画大致有四种：透明渐变、位移、旋转和缩放；还有就是将这四种组合而来的组合渐变动画。还有一种用于控制动画变化速度的插值器：Interpolator，其种类如下所示：

• LinearInterpolator：动画以均匀的速度改变
• AccelerateInterpolator：在动画开始的地方改变速度较慢，然后开始加速
• AccelerateDecelerateInterpolator：在动画开始、结束的地方改变速度较慢，中间时加速
• CycleInterpolator：动画循环播放特定次数，变化速度按正弦曲线改变： Math.sin(2 * mCycles * Math.PI * input)
• DecelerateInterpolator：在动画开始的地方改变速度较快，然后开始减速
• AnticipateInterpolator：反向，先向相反方向改变一段再加速播放
• AnticipateOvershootInterpolator：开始的时候向后然后向前甩一定值后返回最后的值
• BounceInterpolator： 跳跃，快到目的值时值会跳跃，如目的值100，后面的值可能依次为85，77，70，80，90，100
• OvershottInterpolator：回弹，最后超出目的值然后缓慢改变到目的值

透明渐变

<?xml version="1.0" encoding="utf-8"?>
<alpha xmlns:android="http://schemas.android.com/apk/res/android"
    android:interpolator="@android:anim/accelerate_decelerate_interpolator"
    android:duration="2000"
    android:fromAlpha="1.0"
    android:toAlpha="0.1">
</alpha>

//Activity中的使用

Animation mAnimation;

case R.id.btn_alpha:{
    mAnimation = AnimationUtils.loadAnimation(this,R.anim.alpha_anim);
    mIvAnim2.startAnimation(mAnimation);
    break;
}
case R.id.btn_scale:{
    mAnimation = AnimationUtils.loadAnimation(this,R.anim.scale_anim);
    mIvAnim2.startAnimation(mAnimation);
    break;
}
case R.id.btn_tran:{
    mAnimation = AnimationUtils.loadAnimation(this,R.anim.trans_anim);
    mIvAnim2.startAnimation(mAnimation);
    break;
}
case R.id.btn_rotate:{
    mAnimation = AnimationUtils.loadAnimation(this,R.anim.rotate_anim);
    mIvAnim2.startAnimation(mAnimation);
    break;
}
case R.id.btn_com:{
    mAnimation = AnimationUtils.loadAnimation(this,R.anim.com_anim);
    mIvAnim2.startAnimation(mAnimation);
    break;
}

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38

平移

<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
    android:interpolator="@android:anim/accelerate_decelerate_interpolator"
    android:fromXDelta="0"
    android:fromYDelta="0"
    android:toXDelta="0"
    android:toYDelta="100"
    android:duration="2000">
</translate>
1
2
3
4
5
6
7
8
9

旋转

<?xml version="1.0" encoding="utf-8"?>
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
    android:interpolator="@android:anim/accelerate_decelerate_interpolator"
    android:fromDegrees="0"
    android:toDegrees="360"
    android:duration="2000"
    android:repeatCount="1">
<!--    fromDegrees、toDegrees：开始/结束角度-->
<!--    repeatCount：重复次数（第一次结束后再次播放的次数）-->

</rotate>
1
2
3
4
5
6
7
8
9
10
11

缩放

<?xml version="1.0" encoding="utf-8"?>
<scale xmlns:android="http://schemas.android.com/apk/res/android"
    android:interpolator="@android:anim/accelerate_interpolator"
    android:fromXScale="0.5"
    android:fromYScale="0.5"
    android:pivotX="50%"
    android:pivotY="50%"
    android:toXScale="1.5"
    android:toYScale="1.5"
    android:duration="2000">

<!--    fromXScale、fromYScale：缩放起始比例-->
<!--    pivotX、pivotY：旋转中心-->
<!--    toXScale、toYScale：缩放目标比例-->

</scale>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16

组合

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <scale android:fromXScale="1"
        android:fromYScale="1"
        android:pivotX="50%"
        android:pivotY="50%"
        android:toYScale="1.5"
        android:toXScale="1.5"
        android:duration="2000"/>

    <alpha android:fromAlpha="1"
        android:toAlpha="0.1"
        android:duration="2000"/>
</set>
1
2
3
4
5
6
7
8
9
10
11
12
13
14

---

属性动画

• 代码实现

//旋转动画：对象属性动画
ObjectAnimator objectAnimator2 = ObjectAnimator.ofFloat(tvShow, "rotation", 0f, 360f);
objectAnimator2.setInterpolator(new LinearInterpolator());
objectAnimator2.setEvaluator(new FloatEvaluator());

//背景颜色动画：纯值属性动画
ValueAnimator valueAnimator = ValueAnimator.ofInt(0xFF000000, 0x00FFFFFF);
//添加值变化监听来改变属性值
valueAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
    @Override
    public void onAnimationUpdate(ValueAnimator animation) {
        int animatedValue = (int) animation.getAnimatedValue();
        tvShow.setBackgroundColor(animatedValue);
    }
});
valueAnimator.setInterpolator(new LinearInterpolator());//线性插值器
valueAnimator.setEvaluator(new IntEvaluator());//int估值器

//定义属性动画集合
AnimatorSet animatorSet = new AnimatorSet();
animatorSet.addListener(new AnimatorListenerAdapter() {
    @Override
    public void onAnimationEnd(Animator animation) {//动画结束
        super.onAnimationEnd(animation);
        Toast.makeText(MainActivity.this, "animation end!", Toast.LENGTH_SHORT).show();
    }

    @Override
    public void onAnimationStart(Animator animation) {//动画开始
        super.onAnimationStart(animation);
        Toast.makeText(MainActivity.this, "animation start!", Toast.LENGTH_SHORT).show();
    }

    @Override
    public void onAnimationPause(Animator animation) {//动画暂停
        super.onAnimationPause(animation);
        Toast.makeText(MainActivity.this, "animation pause!", Toast.LENGTH_SHORT).show();
    }
});
animatorSet.setTarget(tvShow);
animatorSet.play(objectAnimator2).with(valueAnimator);//with:同时执行；before、after之前、之后
animatorSet.setDuration(4000);
animatorSet.start();
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43

• xml文件实现

<objectAnimator xmlns:android="http://schemas.android.com/apk/res/android"
    android:propertyName="rotation"
    android:valueType="floatType"
    android:valueFrom="0"
    android:valueTo="360" />
    


<animator xmlns:android="http://schemas.android.com/apk/res/android"
    android:valueType="intType"
    android:valueFrom="@color/black"
    android:valueTo="@color/white"
    android:interpolator="@android:anim/linear_interpolator" />


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

<!-- java中使用 -->
ValueAnimator valueAnimator1 = (ValueAnimator) AnimatorInflater.loadAnimator(this, R.animator.value_anim);
valueAnimator1.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
    @Override
    public void onAnimationUpdate(ValueAnimator animation) {
        int animatedValue = (int) animation.getAnimatedValue();
        tvShow.setBackgroundColor(animatedValue);
    }
});
ObjectAnimator objectAnimator = (ObjectAnimator) AnimatorInflater.loadAnimator(this, R.animator.object_anim);
objectAnimator.setTarget(tvShow);
AnimatorSet animatorSet1 = new AnimatorSet();
animatorSet1.setTarget(tvShow);
animatorSet1.setDuration(3000);
animatorSet1.play(objectAnimator).with(valueAnimator1);
animatorSet1.start();
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16

noob1
noob2

---

过渡动画

zhihu

---