美文网首页
android属性动画详解

android属性动画详解

作者: summer_lz | 来源:发表于2017-05-18 09:49 被阅读122次

    一、概述

    Android动画中,总共有两种类型的动画View Animation(视图动画)和Property Animator(属性动画);其中
    View Animation包括Tween Animation(补间动画)和Frame Animation(逐帧动画);
    Property Animator包括ValueAnimator和ObjectAnimation;
    首先,直观上,他们有如下三点不同:
    1、引入时间不同:View Animation是API Level 1就引入的。Property Animation是API Level 11引入的,即Android 3.0才开始有Property Animation相关的API。
    2、所在包名不同:View Animation在包android.view.animation中。而Property Animation API在包 android.animation中。
    3、动画类的命名不同:View Animation中动画类取名都叫XXXXAnimation,而在Property Animator中动画类的取名则叫XXXXAnimator大家都知道逐帧动画主要是用来实现动画的,而补间动画才能实现控件的渐入渐出、移动、旋转和缩放的;而Property Animator是在Android 3.0版本才引入的,之前是没有的。
    为什么还要引入Property Animator呢?
    1、为什么引入Property Animator(属性动画)
    我提出一个假设:请问大家,如何利用补间动画来将一个控件的背景色在一分钟内从绿色变为红色?这个效果想必没办法仅仅通过改变控件的渐入渐出、移动、旋转和缩放来实现吧,而这个效果是可以通过Property Animator完美实现的
    **这就是第一个原因:Property Animator能实现补间动画无法实现的功能 **大家都知道,补间动画和逐帧动画统称为View Animation,也就是说这两个动画只能对派生自View的控件实例起作用;而Property Animator则不同,从名字中可以看出属性动画,应该是作用于控件属性的!正因为属性动画能够只针对控件的某一个属性来做动画,所以也就造就了他能单独改变控件的某一个属性的值!比如颜色!这就是Property Animator能实现补间动画无法实现的功能的最重要原因。
    **我们得到了第二点不同:View Animation仅能对指定的控件做动画,而Property Animator是通过改变控件某一属性值来做动画的。
    **假设我们将一个按钮从左上角利用补间动画将其移动到右下角,在移动过程中和移动后,这个按钮都是不会响应点击事件的。这是为什么呢?因为补间动画仅仅转变的是控件的显示位置而已,并没有改变控件本身的值。View Animation的动画实现是通过其Parent View实现的,在View被drawn时Parents View改变它的绘制参数,这样虽然View的大小或旋转角度等改变了,但View的实际属性没变,所以有效区域还是应用动画之前的区域;我们看到的效果仅仅是系统作用在按钮上的显示效果,利用动画把按钮从原来的位置移到了右下角,但按钮内部的任何值是没有变化的,所以按钮所捕捉的点击区域仍是原来的点击区域。(下面会举例来说明这个问题)
    这就得到了第三点不同:补间动画虽能对控件做动画,但并没有改变控件内部的属性值。而Property Animator则是恰恰相反,Property Animator是通过改变控件内部的属性值来达到动画效果的

    二、ValueAnimator简单使用

    我们前面讲了Property Animator包括ValueAnimator和ObjectAnimator;这篇文章就主要来看看ValueAnimator的使用方法吧。
    我觉得谷歌那帮老头是最会起名字的人,单从命名上,就能看出来这个东东的含义。ValueAnimator从名字可以看出,这个Animation是针对值的!ValueAnimator不会对控件做任何操作,我们可以给它设定从哪个值运动到哪个值,通过监听这些值的渐变过程来自己操作控件。它会自己计算动画的过程,然后我们需要监听它的动画过程来自己操作控件。

      1. 第一步:创建ValueAnimator实例
    ValueAnimator animator = ValueAnimator.ofInt(0,400);  
    animator.setDuration(1000);  
    animator.start();  
    
    1. 在这里我们利用ValueAnimator.ofInt创建了一个值从0到400的动画,动画时长是1s,然后让动画开始。从这段代码中可以看出,ValueAnimator没有跟任何的控件相关联,那也正好说明ValueAnimator只是对值做动画运算,而不是针对控件的,我们需要监听ValueAnimator的动画过程来自己对控件做操作。 第二步:添加监听
      上面的三行代码,我们已经实现了动画,下面我们就添加监听:
    ValueAnimator animator = ValueAnimator.ofInt(0,400);  
    animator.setDuration(1000);  
    animator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {  
        @Override  
        public void onAnimationUpdate(ValueAnimator animation) {  
            int curValue = (int)animation.getAnimatedValue();  
            Log.d("qijian","curValue:"+curValue);  
        }  
    });  
    animator.start();
    

    这就是ValueAnimator的功能:ValueAnimator对指定值区间做动画运算,我们通过对运算过程做监听来自己操作控件。
    总而言之就是两点:
    1. ValueAnimator只负责对指定的数字区间进行动画运算
    2. 我们需要对运算过程进行监听,然后自己对控件做动画操作

    三、插值器Interpolator

    插值器的意义其实就相当于物理公式中的加速度参数,所以这也就是它也叫加速器的原因。 如何自定义插值器:

    public class LinearInterpolator implements Interpolator {  
      
        public LinearInterpolator() {  
        }  
      
        public LinearInterpolator(Context context, AttributeSet attrs) {  
        }  
      
        public float getInterpolation(float input) {  
            return input;  
        }  
    }  
    public interface Interpolator extends TimeInterpolator {  
    } 
    
    1. getInterpolation(float input):
      参数input:input参数是一个float类型,它取值范围是0到1,表示当前动画的进度,取0时表示动画刚开始,取1时表示动画结束,取0.5时表示动画中间的位置,其它类推。
      返回值:表示当前实际想要显示的进度。取值可以超过1也可以小于0,超过1表示已经超过目标值,小于0表示小于开始位置。
      对于input参数,它表示的是当前动画的进度,匀速增加的。动画的进度就是动画在时间上的进度,与我们的任何设置无关,随着时间的增长,动画的进度自然的增加,从0到1;input参数相当于时间的概念,通过setDuration()指定了动画的时长,在这个时间范围内,动画进度肯定是一点点增加的;就相当于播放一首歌,这首歌的进度是从0到1是一样的。 而返回值则表示动画的数值进度,它的对应的数值范围是我们通过ofInt(),ofFloat()来指定的,这个返回值就表示当前时间所对应的数值的进度。
    /** 
     * A time interpolator defines the rate of change of an animation. This allows animations 
     * to have non-linear motion, such as acceleration and deceleration. 
     */  
    public interface TimeInterpolator {  
      
        /** 
         * Maps a value representing the elapsed fraction of an animation to a value that represents 
         * the interpolated fraction. This interpolated value is then multiplied by the change in 
         * value of an animation to derive the animated value at the current elapsed animation time. 
         * 
         * @param input A value between 0 and 1.0 indicating our current point 
         *        in the animation where 0 represents the start and 1.0 represents 
         *        the end 
         * @return The interpolation value. This value can be more than 1.0 for 
         *         interpolators which overshoot their targets, or less than 0 for 
         *         interpolators that undershoot their targets. 
         */  
        float getInterpolation(float input);  
    }  
    

    **input参数与任何我们设定的值没关系,只与时间有关,随着时间的增长,动画的进度也自然的增加,input参数就代表了当前动画的进度。而返回值则表示动画的当前数值进度 **

    public class LinearInterpolator implements Interpolator {  
      
        …………  
      
        public float getInterpolation(float input) {  
           return 1-input; 
        }  
    } 
    

    在getInterpolation函数中,我们将进度反转过来,当传0的时候,我们让它数值进度在完成的位置,当完成的时候,我们让它在开始的位置

    四、ObjectAnimator

    ObjectAnimator是派生自ValueAnimator的,所以ValueAnimator中所能使用的方法,在ObjectAnimator中都可以正常使用。ObjectAnimator重写了几个方法,比如ofInt(),ofFloat()等。利用ObjectAnimator重写的ofFloat方法如何实现一个动画:(改变透明度)

    ObjectAnimator animator = ObjectAnimator.ofFloat(tv,"alpha",1,0,1);  
    animator.setDuration(2000);  
    animator.start(); 
    
    public static ObjectAnimator ofFloat(Object target, String propertyName, float... values)
    
    1. 第一个参数用于指定这个动画要操作的是哪个控件
    2. 第二个参数用于指定这个动画要操作这个控件的哪个属性
    3. 第三个参数是可变长参数,这个就跟ValueAnimator中的可变长参数的意义一样了,就是指这个属性值是从哪变到哪。像我们上面的代码中指定的就是将textview的alpha属性从0变到1再变到0;
      TextView控件有rotation这个属性吗?没有,不光TextView没有,连它的父类View中也没有这个属性。那它是怎么来改变这个值的呢?其实,ObjectAnimator做动画,并不是根据控件xml中的属性来改变的,而是通过指定属性所对应的set方法来改变的。比如,我们上面指定的改变rotation的属性值,ObjectAnimator在做动画时就会到指定控件(TextView)中去找对应的setRotation()方法来改变控件中对应的值。同样的道理,当我们在最开始的示例代码中,指定改变”alpha”属性值的时候,ObjectAnimator也会到TextView中去找对应的setAlpha()方法。那TextView中都有这些方法吗,有的,这些方法都是从View中继承过来的,在View中有关动画,总共有下面几组set方法:
    public void setAlpha(float alpha)  
    //2、旋转度数:rotation、rotationX、rotationY  
    public void setRotation(float rotation)  
    public void setRotationX(float rotationX)  
    public void setRotationY(float rotationY)  
      //3、平移:translationX、translationY  
    public void setTranslationX(float translationX)   
    public void setTranslationY(float translationY)  
      //缩放:scaleX、scaleY  
    public void setScaleX(float scaleX)  
    public void setScaleY(float scaleY) 
    
    依据这点,自定义动画属性:
    public class MyPointView extends View {  
        private Point mPoint = new Point(100);  
        public MyPointView(Context context, AttributeSet attrs) {  
            super(context, attrs);  
        }  
        @Override  
        protected void onDraw(Canvas canvas) {  
            if (mPoint != null){  
                Paint paint = new Paint();  
                paint.setAntiAlias(true);  
                paint.setColor(Color.RED);  
                paint.setStyle(Paint.Style.FILL);  
                canvas.drawCircle(300,300,mPoint.getRadius(),paint);  
            }  
            super.onDraw(canvas);  
        }  
        //第一点,这个set函数所对应的属性应该是pointRadius或者PointRadius。前面我们已经讲了第一个字母大小写无所谓,后面的字母必须保持与set函数完全一致。 
        //第二点,在setPointRadius中,先将当前动画传过来的值保存到mPoint中,做为当前圆形的半径。然后强制界面刷新 
        void setPointRadius(int radius){  
            mPoint.setRadius(radius);  
            invalidate();  
        }    
    } 
    
    private void doPointViewAnimation(){  
         ObjectAnimator animator = ObjectAnimator.ofInt(mPointView, "pointRadius", 0, 300, 100);  
          animator.setDuration(2000);  
          animator.start();  
    }  
    

    前面我们都是定义多个值,即至少两个值之间的变化,那如果我们只定义一个值呢,如下面的方式:(同样以MyPointView为例)

    ObjectAnimator animator = ObjectAnimator.ofInt(mPointView, "pointRadius",100);  
    animator.setDuration(2000);  
    animator.start();  
    

    仅且仅当我们只给动画设置一个值时,程序才会调用属性对应的get函数来得到动画初始值。如果动画没有初始值,那么就会使用系统默认值。比如ofInt()中使用的参数类型是int类型的,而系统的Int值的默认值是0,所以动画就会从0运动到100;也就是系统虽然在找到不到属性对应的get函数时,会给出警告,但同时会用系统默认值做为动画初始值。
    如果通过给自定义控件MyPointView设置了get函数,那么将会以get函数的返回值做为初始值。

    ArgbEvaluator

    public class ArgbEvaluator implements TypeEvaluator {  
        public Object evaluate(float fraction, Object startValue, Object endValue) {  
            int startInt = (Integer) startValue;  
            int startA = (startInt >> 24);  
            int startR = (startInt >> 16) & 0xff;  
            int startG = (startInt >> 8) & 0xff;  
            int startB = startInt & 0xff;  
      
            int endInt = (Integer) endValue;  
            int endA = (endInt >> 24);  
            int endR = (endInt >> 16) & 0xff;  
            int endG = (endInt >> 8) & 0xff;  
            int endB = endInt & 0xff;  
      
            return (int)((startA + (int)(fraction * (endA - startA))) << 24) |  
                    (int)((startR + (int)(fraction * (endR - startR))) << 16) |  
                    (int)((startG + (int)(fraction * (endG - startG))) << 8) |  
                    (int)((startB + (int)(fraction * (endB - startB))));  
        }  
    }
    

    根据View setBackGroundColor()方法可以自定义条用属性动画。

    ObjectAnimator animator = ObjectAnimator.ofInt(tv, "BackgroundColor", 0xffff00ff, 0xffffff00, 0xffff00ff);  
    animator.setDuration(8000);  
    animator.setEvaluator(new ArgbEvaluator());  
    animator.start();
    

    相关文章

      网友评论

          本文标题:android属性动画详解

          本文链接:https://www.haomeiwen.com/subject/pjbdxxtx.html