Android矢量动画-VectorDrawable

1 概述

1.1 编写目的

学习Android矢量动画VectorDrawable相关的知识点，记录下来，方便后续学习及查询。

2 VectorDrawable

2.1 图片XML(Vector)

Vector在《Android矢量图形-Vector》中已经详细说明，直接创建vector_pingpong.Xml，内容如下：

效果图如下：

 

2.2 动作XML(Set->ObjectAnimator)

创建move_pingpong.Xml，内容如下：

创建move_racket.Xml，内容如下：

2.2.1 Set 

一个set中可以有多个objectAnimator，通过ordering属性控制执行顺序。

Ordering：取值["sequentially"|"together"], sequentially（默认），顺序执行objectAnimator；together，同时执行objectAnimator。

2.2.2 ObjectAnimator 

ObjectAnimator中有propertyName、valueType、valueFrom、valueTo、repeatCount、repeatMode、duration、interpolator、startOffset等属性。

2.2.2.1 PropertyName属性（属性名）

PropertyName:指定动作属性["translateX"|"translateY"| "trimPathStart"|"trimPathEnd"|"scaleX"|"scaleY"|"rotation"|"fillAlpha"] 等，Vector里面的属性基本上都可以（需要注意target里面绑定的是group就只能使用当前group的属性，下级group或path等不能使用，绑定的path就只能使用当前path的属性，clip-path一样）。

2.2.2.2 ValueType属性（属性值类型）

ValueType：PropertyName指定属性值的类型，共有四种类型，分别是：["intType"|"floatType"|"colorType"|pathType]。

2.2.2.3 ValueFrom、ValueTo属性（动画初始和结束值）

ValueFrom：PropertyName指定属性的初始值,值的类型为ValueType（如位置、颜色、透明、PathData等）。

ValueTo：PropertyName指定属性的结束值,值的类型为ValueType。

2.2.2.4 RepeatCount、RepeatMode属性（动画重复次数和样式）

RepeatCount：定义动画重复次数，["infinite"]为无限次。

RepeatMode：定义重复的行为 ["restart"|"reverse"], restart：直接跳到起始位置重新开始；reverse：倒退到起始位置重新开始。

2.2.2.5 Duration属性（动画时间）

Duration：动画执行一次的时间，单位ms。

2.2.2.6 Interpolator属性（动画过程控制）

Interpolator：控制动画的运行过程。Interpolator 定义了动画的变化速度，可以实现匀速、正加速、负加速、无规则变加速等。可以自己定义，也可以使用默认的，列如：

Accelerate:加速，共有下面四种模式

["@android:interpolator/accelerate_decelerate"|"@android:interpolator/accelerate_cubic"|

"@android:interpolator/accelerate_quad"|"@android:interpolator/accelerate_ quint "]

accelerate_decelerate：在动画开始与结束的地方速率改变比较慢，在中间的时候加速；
accelerate_cubic：拟合立方缓和函数的曲线加速。
accelerate_quad：曲线匹配的quadtratic缓解功能加速。
accelerate_ quint：曲线匹配功能昆特缓解加速。
Decelerate：减速，共有四种模式，同Accelerate。

["@android:interpolator/accelerate_decelerate"|"@android:interpolator/decelerate_cubic"|

"@android:interpolator/decelerate_quad"|"@android:interpolator/decelerate_ quint "]。

Anticipate：开始的时候向后然后向前甩["@android:interpolator/accelerate_decelerate"] 。             
AnticipateOvershoot：开始的时候向后然后向前甩一定值后返回最后的值["@android:interpolator/anticipate_overshoot"] 。
Bounce：动画结束的时候弹起["@android:interpolator/bounce"] 。         
Cycle：动画循环播放特定的次数，速率改变沿着正弦曲线["@android:interpolator/cycle"] 。
Linear：以常量速率改变["@android:interpolator/linear"] 。                         
Overshoot：向前甩一定值后再回到原来位置["@android:interpolator/overshoot"]。

2.2.2.7 StartOffset属性（延时）

延迟播放的时间，单位ms，只延时第一次播放，重复播放时不延时。

2.3 关联动画XML(animated-vector) 

创建animator_pingpong.xml，内容如下：

2.3.1 Animated-vector(指定图片)

只有一个属性drawable，指向执行动画的vector图片。

2.3.2 Target（关联）

有animation和name两个属性，animation指向动作xml；name指向的名字和Animated-vector指定图片中的group或path或clip-path的名字一致。可以同时有多个target分别指向不同的动作和名字。

2.4 布局引用XML

创建vector_pingpong.xml,如下图所示：

布局中使用src指定动画。静态效果如下：

 

2.5 运行

2.5.1 代码片段

运行主要代码如下所示：

public classVectorActivityextendsActivity{
    private ImageViewmImageView;
    @Override
    protected void onCreate(@NullableBundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.vector_pingpong);
        initView();
    }

    private void initView() {
        mImageView =(ImageView) findViewById(R.id.vector_imageview);
        Drawable drawable = mImageView.getDrawable();
        if (drawable instanceofAnimatable)
            ((Animatable)drawable).start();
    }
}

2.5.2 运行结果

 

2.5.3 大小改变的动画（多个ObjectAnimator）

其它的不变，将move_pingpong.Xml修改为：

效果如下：

 

2.5.4 颜色改变的动画（colorType）

move_pingpong.Xml恢复到初始状态，新增move_pingpong_path.Xml文件如下：

添加target，修改animator_pingpong.xml如下：

效果如下：

 

2.5.5 pathData改变的动画（pathType、restart）

修改后的vector_pingpong.xml如下：

效果图如下：

 

修改animator_pingpong.xml如下：

修改move_pingpong.Xml如下：

修改move_pingpong_path.xml如下：

其它文件不变，效果如下：