Android 动画资源 详解

**

Android 动画资源

**

一、分类:
(一)、概要:

    3.0以前,android支持两种动画模式,补间动画(tween animation),帧动画(frame animation),在android3.0中又引入了一个新的动画系统:属性动画(property animation)。

    这三种动画模式在SDK中被称为view animation,drawable animation,property animation。

(二)、动画资源分类:

  1. 属性动画:Property Animation
  2. 帧动画:Frame Animation (Drawable Animation)
  3. 补间动画:Tween Animation (View Animation)

1 透明度补间动画
2 缩放补间动画
3 旋转补间动画
4 移动补间动画
• Alpha:渐变透明度动画效果
• Scale:渐变尺寸伸缩动画效果
• Translate:画面转换位置移动动画效果
• Rotate:画面转换位置移动动画效果

二、补间动画:

    Tween Animation就是一系列View形状的变换,如大小的缩放、透明度的改变、水平位置的改变、旋转位置改变,动画的定义既可以用java代码定义也可以用XML定义。建议用XML定义。
    用XML定义的动画放在/res/anim/文件夹内,XML文件的根元素为<set> , 二级节点可为<alpha>,<scale>,<translate>,<rotate>。

(一)、Tween Animation共同的属性:
1、duration[long] 属性为动画持续时间 时间以毫秒为单位
2、fillAfter [boolean] 当设置为true ,该动画转化在动画结束后被应用
3、fillBefore[boolean] 当设置为true ,该动画转化在动画开始前被应用
4、interpolator 指定一个动画的插入器 有一些常见的插入器
• accelerate_decelerate_interpolator 加速-减速 动画插入器
• accelerate_interpolator 加速-动画插入器
• decelerate_interpolator 减速- 动画插入器
其他的属于特定的动画效果
5、repeatCount[int] 动画的重复次数
6、repeatMode[String] 定义重复的行为
• “restart” 、”reverse”
• eg: android:repeatMode=”reverse”

(二)、用xml资源实现补间动画:

<alpha  android:fromAlpha=”0.0″ android:toAlpha=”1.0″ android:duration=”3000″ />

【说明:】
1.fromAlpha:属性为动画起始时透明度
• 0.0表示完全透明
• 1.0表示完全不透明
• 以上值取0.0-1.0之间的float数据类型的数字
2.toAlpha:属性为动画结束时透明度

<scale  android:interpolator= "@android:anim/accelerate_decelerate_interpolator" android:fromXScale=”0.0″ android:toXScale=”1.4″ android:fromYScale=”0.0″ android:toYScale=”1.4″ android:pivotX=”50%” android:pivotY=”50%” android:fillAfter=”false” android:startOffset=“700” android:duration=”700″ android:repeatCount=”10″ />

【说明:】
1.fromXScale[float]
2.fromYScale[float] 为动画起始时,X、Y坐标上的伸缩尺寸
• 0.0表示收缩到没有

• 1.0表示正常无伸缩

• 值小于1.0表示收缩

• 值大于1.0表示放大

3.toXScale [float]
为动画结束时,X坐标上的伸缩尺寸
4.toYScale[float] 为动画结束时,Y坐标上的伸缩尺寸
5.pivotX[float]

6.pivotY[float] 为动画相对于物件的X、Y坐标的开始位置
属性值说明:从0%-100%中取值,50%为物件的X或Y方向坐标上的中点位置

<translate  android:fromXDelta=”30″ android:toXDelta=”-80″ android:fromYDelta=”30″ android:toYDelta=”300″ android:duration=”2000″ />

【说明:】
1.fromXDelta
2.toXDelta 为动画结束起始时 X坐标上的位置
3.fromYDelta
4.toYDelta 为动画结束起始时 Y坐标上的位置

<rotate  android:interpolator="@android:anim/accelerate_decelerate_interpolator" android:fromDegrees=”0″ android:toDegrees=”+250″ android:pivotX=”50%” android:pivotY=”50%” android:duration=”2000″ />

【说明:】
1.fromDegrees 为动画起始时物件的角度
说明
:当角度为负数——表示逆时针旋转
当角度为正数——表示顺时针旋转
(负数from——to正数:顺时针旋转)
(负数from——to负数:逆时针旋转)
(正数from——to正数:顺时针旋转)
(正数from——to负数:逆时针旋转)
2.toDegrees 属性为动画结束时物件旋转的角度 可以大于360度
3.pivotX
4.pivotY 为动画相对于物件的X、Y坐标的开始位
说明:以上两个属性值 从0%-100%中取值
,50%为物件的X或Y方向坐标上的中点位置

(三)、用java代码实现补间动画:

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));
    }

    public void translateClick1(View view) {
        //1.X轴移动的起始位置
        //2.X轴移动的结束位置
        //3.Y轴移动的起始位置
        //4.Y轴移动的结束位置
        TranslateAnimation ta = new TranslateAnimation(0, 200, 0, 200);
        //动画执行的时间,5000毫秒
        ta.setDuration(5000);
        //设置动画结束后ImageView保持动画结束时的状态
        ta.setFillAfter(true);
        //让ImageView产生动画效果
        iv.startAnimation(ta);
    }

    public void alphaClick1(View view) {
        //1.表示动画的起始状态,1表示完全不透明,0表示完全透明
        //2.表示动画的结束状态
        AlphaAnimation aa = new AlphaAnimation(1, 0);
        aa.setDuration(3000);
        iv.startAnimation(aa);
    }

    public void scaleClick1(View view) {
        //1.X轴起始状态
        //2.X轴结束状态
        //5。6表示缩放的中心点
// ScaleAnimation sa = new ScaleAnimation(0, 2, 0, 1, iv.getWidth() / 2, iv.getHeight() / 2);
        //缩放中心点参考ImageView的中心点,0.5f表示宽度/高度的50%
        ScaleAnimation sa = new ScaleAnimation(0, 1, 0, 1, ScaleAnimation.RELATIVE_TO_SELF, 0.5f, ScaleAnimation.RELATIVE_TO_SELF, 0.5f);
        sa.setDuration(3000);
        iv.startAnimation(sa);
    }

    public void rotateClick1(View view) {
        //1.旋转的起始位置
        //2.旋转的结束位置
        //3.4表示旋转的中心点
// RotateAnimation ra = new RotateAnimation(0, 360, iv.getWidth() / 2, iv.getHeight() / 2);
        RotateAnimation ra = new RotateAnimation(0, 359, RotateAnimation.RELATIVE_TO_SELF, 0.5f, RotateAnimation.RELATIVE_TO_SELF, 0.5f);
        //设置旋转次数
        ra.setRepeatCount(RotateAnimation.INFINITE);
        //设置重复旋转的模式
        ra.setRepeatMode(RotateAnimation.REVERSE);
        ra.setDuration(3000);
        iv.startAnimation(ra);
    }

    public void setClick1(View view) {
        //true表示动画的插值器统一使用AnimationSet默认的插值器
        AnimationSet set = new AnimationSet(true);
        TranslateAnimation ta = new TranslateAnimation(0, iv.getWidth(), 0, iv.getHeight());
        ta.setDuration(3000);
        //将所有动画添加到set中
        set.addAnimation(ta);
        AlphaAnimation aa = new AlphaAnimation(0.2f, 0.8f);
        aa.setDuration(3000);
        set.addAnimation(aa);
        ScaleAnimation sa = new ScaleAnimation(1, 2, 1, 2, ScaleAnimation.RELATIVE_TO_SELF, 0.5f, ScaleAnimation.RELATIVE_TO_SELF, 0.5f);
        sa.setDuration(3000);
        set.addAnimation(sa);
        RotateAnimation ra = new RotateAnimation(0, -359, RotateAnimation.RELATIVE_TO_SELF, 0.5f, RotateAnimation.RELATIVE_TO_SELF, 0.5f);
        ra.setDuration(3000);
        set.addAnimation(ra);
        iv.startAnimation(set);
    }

    public void translateClick2(View view) {
        Animation animation = AnimationUtils.loadAnimation(this, R.anim.translate_anim);
        animation.setFillAfter(true);
        iv.startAnimation(animation);
    }

    public void alphaClick2(View view) {
        Animation animation = AnimationUtils.loadAnimation(this, R.anim.alpha_anim);
        iv.startAnimation(animation);
    }

    public void scaleClick2(View view) {
        Animation animation = AnimationUtils.loadAnimation(this, R.anim.scale_anim);
        iv.startAnimation(animation);
    }

    public void rotateClick2(View view) {
        Animation animation = AnimationUtils.loadAnimation(this, R.anim.rotate_anim);
        iv.startAnimation(animation);
    }

    public void setClick9(View view) {
        Animation animation = AnimationUtils.loadAnimation(this, R.anim.set_anim);
        iv.startAnimation(animation);
    }
}

(四)插值器

【注释】:
AccelerateDecelerateInterpolator 在动画开始与结束的地方速率改变比较慢,在中间的时候加速
AccelerateInterpolator 在动画开始的地方速率改变比较慢,然后开始加速
BounceInterpolator 动画结束的时候弹起
CycleInterpolator 动画循环播放特定的次数,速率改变沿着正弦曲线
DecelerateInterpolator 在动画开始的地方快然后慢
LinearInterpolator 以常量速率改变

三、帧动画:
Frame Animation(AnimationDrawable对象):帧动画,就像GIF图片,通过一系列Drawable依次显示来模拟动画的效果。
必须以为根元素,以表示要轮换显示的图片,duration属性表示各项显示的时间。XML文件要放在/res/anim/或者/res/animator目录下。

(一)、实例代码:

<?xml version="1.0" encoding="utf-8"?>
<!--android:oneshot="true"动画是否播放一次-->
<animation-list xmlns:android="http://schemas.android.com/apk/res/android" android:oneshot="true">
    <item  android:drawable="@drawable/p0" android:duration="200"></item>
    <item  android:drawable="@drawable/p1" android:duration="200"></item>
    <item  android:drawable="@drawable/p2" android:duration="200"></item>
    <item  android:drawable="@drawable/p3" android:duration="200"></item>
    <item  android:drawable="@drawable/p4" android:duration="200"></item>
</animation-list>

【备注:】
drawable 当前帧引用的drawable资源
duration 当前帧显示的时间(毫秒为单位)
oneshot 如果为true,表示动画只播放一次停止在最后一帧上,如果设置为false表示动画循环播放。

MainActivity.java代码:

ad = (AnimationDrawable) iv1.getDrawable();
iv1.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View v) {
        //如果动画正在执行,先停止,再执行
        if(ad.isRunning()){
            ad.stop();
        }
        ad.start();
    }
});

【备注:】
SDK中提到,不要在onCreate()中调用start(),因为AnimationDrawable还没有完全跟Window相关联,如果想要界面显示时就开始动画的话,可以在onWindowFoucsChanged()中调用start()。

四、属性动画:
(一)、概念:
属性动画,这个是在Android 3.0中才引进的。Property Animation故名思议就是通过动画的方式改变对象的属性.属性动画更改的是对象的实际属性,在View Animation(Tween Animation)中,其改变的是View的绘制效果,真正的View的属性保持不变。可以将属性动画理解为增强版的补间动画。
比如无论如何缩放Button的大小,Button的有效点击区域还是没有应用动画时的区域,其位置与大小都不变。而在Property Animation中,改变的是对象的实际属性,如Button的缩放,Button的位置与大小属性值都改变了。
Property Animation不止可以应用于View,还可以应用于任何对象。Property Animation只是表示一个值在一段时间内的改变,当值改变时要做什么事情完全是你自己决定的。

(二)、常用属性:
1. Duration动画的持续时间,默认300ms。android:duration属性
2. Time interpolation:时间插值。LinearInterpolator、AccelerateDecelerateInterpolator,定义动画的变化率。android:interpolator属性
3. Repeat count and behavior:重复次数、以及重复模式;可以定义重复多少次;重复时从头开始,还是反向。android:repeatCount属性
4. Animator sets: 动画集合,你可以定义一组动画,一起执行或者顺序执行。,该元素的android:ordering属性指定该组动画是按次序播放还是同时播放。
5. Frame refresh delay:帧刷新延迟(帧刷新频率,每个多久播放一帧);默认为10ms,但最终依赖系统的当前状态。
(三)、属性动画API:相关的类
1. ObjectAnimator 动画的执行类(是ValueAnimator的子类,使用简单常用。少数场景下,由于其存在一些限制,再考虑使用ValueAnimator)
2. ValueAnimator 动画的执行类
3. AnimatorSet 用于控制一组动画的执行:线性,一起,每个动画的先后执行等。总的来说,属性动画就是,动画的执行类来设置动画操作的对象的属性、持续时间,开始和结束的属性值,时间差值等,然后系统会根据设置的参数动态的变化对象的属性。

(一)、实例代码:

public class MainActivity extends AppCompatActivity {

    private ImageView iv1;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        iv1 = ((ImageView) findViewById(R.id.iv1));
        iv1.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                Toast.makeText(MainActivity.this, "123", Toast.LENGTH_SHORT).show();
            }
        });
        //布局上的控件出场动画
        LinearLayout linearLayout = (LinearLayout) findViewById(R.id.ll);
        ScaleAnimation sa = new ScaleAnimation(0, 1, 0, 1);
        sa.setDuration(500);
        //0表示所有动画同时执行,1表示延迟1s
        LayoutAnimationController lac = new LayoutAnimationController(sa, 0.5f);
        lac.setOrder(LayoutAnimationController.ORDER_RANDOM);
        linearLayout.setLayoutAnimation(lac);
    }

    public void translateClick(View view) {
        //1.执行该动画的控件
        //2.变化的属性名称
        //。。。属性变化的值
        ObjectAnimator objectAnimator = ObjectAnimator.ofFloat(iv1, "translationX", 0, 200, 0);
        objectAnimator.setDuration(5000);
        objectAnimator.start();
    }

    public void alphaClick(View view) {
        ObjectAnimator oa = ObjectAnimator.ofFloat(iv1, "alpha", 0f, 0.5f, 0f, 1f);
        oa.setDuration(5000);
        oa.start();
    }

    public void scaleClick(View view) {
        ObjectAnimator oa = ObjectAnimator.ofFloat(iv1, "scaleX", 0, 1, 0.5f, 1);
        oa.setDuration(5000);
        oa.start();
    }

    public void rotateClick(View view) {
        //rotateY表示绕Y轴旋转
        //rotateX表示绕X轴旋转
        //rotate表示绕中心点旋转
        ObjectAnimator oa = ObjectAnimator.ofFloat(iv1, "rotation", 0, 359);
        oa.setRepeatCount(ObjectAnimator.INFINITE);
        oa.setRepeatMode(ObjectAnimator.RESTART);
        //线型插值器,动画匀速执行
        oa.setInterpolator(new LinearInterpolator());
        oa.setDuration(5000);
        oa.start();
    }

    public void animClick1(View view) {
        //定义组合动画,第一个参数表示修改的属性名称,后面的参数表示属性值的变化
        PropertyValuesHolder pv1 = PropertyValuesHolder.ofFloat("rotation", 0, 359);
        PropertyValuesHolder pv2 = PropertyValuesHolder.ofFloat("scaleX", 1, 2);
        PropertyValuesHolder pv3 = PropertyValuesHolder.ofFloat("translationX", 0, 200);
        PropertyValuesHolder pv4 = PropertyValuesHolder.ofFloat("alpha", 0.5f, 1f);
        //将所有的组合动画添加到ObjectAnimator中
        ObjectAnimator oa = ObjectAnimator.ofPropertyValuesHolder(iv1, pv1, pv2, pv3, pv4);
        oa.setDuration(5000);
        oa.start();
    }

    public void animClick2(View view) {
        MyImageView miv = new MyImageView(iv1);
// ObjectAnimator oa = ObjectAnimator.ofInt(miv, "width", 0, 200);
        ObjectAnimator oa = ObjectAnimator.ofInt(miv, "height", 0, 200);
        oa.setDuration(5000);
        oa.start();
    }
}

你可能感兴趣的:(Android-动画)