Android开发 之 矢量图动画SVG（细节版）

 矢量图动画SVG

矢量图 VectorDrawable集成Drawable是图片信息；矢量图动画AnimatedVectorDrawable也是集成drawable，只不多它里面封装了drawable的执行动画。

VectorDrawable对应的xml文件就是Vector

例如：

<?xml version="1.0" encoding="utf-8"?>
<vector xmlns:android="http://schemas.android.com/apk/res/android"
    android:width="100dp"
    android:height="100dp"
    android:viewportWidth="500"
    android:viewportHeight="500">
    <path android:pathData="M0,0 L500,0 500,500,0,500"
        android:fillColor="#000">
    </path>
    <group
        android:name="sun"
        android:pivotX="250"
        android:pivotY="250">
        <path android:fillColor="#F00"
            android:pathData=" M 250,150
            a 100,100 0 1,0 1,0">
        </path>
        <group
            android:name="earth"
            android:pivotX="400"
            android:pivotY="240"
            >
            <path
                android:fillColor="#00f"
                android:pathData=" M400,220 a20,20 0 1,0 1,0"
                >
            </path>
            <path
                android:fillColor="#0ff"
                android:pathData=" M430,230 a5,5 0 1,0 1,0"
                >
            </path>
        </group>
    </group>
</vector>

上面的属性都有何用意,下面解释：

path
android:name 定义该 path 的名字，这样在其他地方可以通过名字来引用这个路径
android:pathData   path绘制图案。
android:fillColor 定义填充路径的颜色，如果没有定义则不填充路径
android:strokeColor 定义如何绘制路径边框，如果没有定义则不显示边框
android:strokeWidth 定义路径边框的粗细尺寸
android:strokeAlpha 定义路径边框的透明度
android:fillAlpha 定义填充路径颜色的透明度
android:trimPathStart 从路径起始位置截断路径的比率，取值范围从 0 到1
android:trimPathEnd 从路径结束位置截断路径的比率，取值范围从 0 到1
android:trimPathOffset 设置路径截取的范围，取值范围从 0 到1
android:strokeLineCap 设置路径线帽的形状，取值为 butt, round, square.
android:strokeLineJoin 设置路径交界处的连接方式，取值为 miter,round,bevel.
android:strokeMiterLimit 设置斜角的上限

group ：就是一个分组，里面存放多个path
android:name 定义 group 的名字，可以对这个组进行动画效果
android:rotation 定义该 group 的路径旋转多少度
android:pivotX 定义缩放和旋转该 group 时候的 X 参考点。该值相对于 vector 的 viewport 值来指定的。
android:pivotY 定义缩放和旋转该 group 时候的 Y 参考点。该值相对于 vector 的 viewport 值来指定的。
android:scaleX 定义 X 轴的缩放倍数
android:scaleY 定义 Y 轴的缩放倍数
android:translateX 定义移动 X 轴的位移。相对于 vector 的 viewport 值来指定的。
android:translateY 定义移动 Y 轴的位移。相对于 vector 的 viewport 值来指定的。

vector：定义这个矢量图
android:name 定义该drawable的名字
android:width 定义该 drawable 的内部(intrinsic)宽度,通常使用 dp，就是这个矢量图绘制出来的尺寸，不能太小，不然一拉伸图像很虚。
android:height 定义该 drawable 的内部(intrinsic)高度,通常使用 dp
android:viewportWidth 定义矢量图视图的宽度，视图就是矢量图 path 路径数据所绘制的虚拟画布
android:viewportHeight 定义矢量图视图的高度，视图就是矢量图 path 路径数据所绘制的虚拟画布
android:tint 定义该 drawable 的 tint 颜色。默认是没有 tint 颜色的
android:tintMode 定义 tint 颜色的 Porter-Duff blending 模式，默认值为 src_in
android:autoMirrored 设置当系统为 RTL (right-to-left) 布局的时候，是否自动镜像该图片。比如 阿拉伯语。
android:alpha 该图片的透明度属性

以上属性都是参考android官网翻译过来的，有些不太清楚就用俗语解释了。

在使用trimPathStart和trimPathEnd的时：

from 1 to 0   trimPathStart   动画逆向   显示

from 1 to  0 trimPathEnd  动画逆向   消失

from 0 to 1  trimPathStart 动画顺向 消失

from 0 to 1  trimPathEnd  动画顺向 显示

使用Path画圆弧：

例如：M10,10    a5,5   0   1   0   1   0

先平移到10,10点，画半径为5的圆弧

第一：0，以圆心为原点，旋转多少度；

第二个：1，可以设置0,1，分别代表的大弧和小弧

第三个：0，可以设置0,1，分别代表的是绘制方向，逆时针和顺时针

第四，五个：分表表示在x，y轴上偏移多少个单位，绘制弧。