android 矢量图v 安卓矢量绘图

先来看看点击前和点击后的图片，这是点击前的截图，注意点击之后是在两秒中变换的，当然你也可以自定义时间的长短

点击后如下，再说一次是缓慢变化的，不是突然的，还不会制作动态的图片，如果你知道麻烦在下面的评论告诉我一下谢谢，或者私信我也可以。

代码如下：

（1）这是一个很简洁的活动代码，可以看到我们点击事件里有一个 animate()方法，此方法是用来启动动画的，接着往下看

package com.example.k.myv;

import android.graphics.drawable.Animatable;
import android.graphics.drawable.Drawable;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.ImageView;
import android.widget.Toast;

public class MainActivity extends AppCompatActivity {
ImageView i;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        i = (ImageView) findViewById(R.id.imageView);
        i.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                animate();
            }
        });
    }
    private void animate(){
        Drawable d = i.getDrawable();
            if(d instanceof Animatable){
            Toast.makeText(this,"ok!",Toast.LENGTH_LONG).show();
            ((Animatable)d).start();
        }
    }
}

（2）这个是我们的objectAnimator动画，首先在res文件夹下建立一个名为animator的文件夹，我这文件名为：objectanimator1.xml，然后再其文件夹下建立一个xml文件即可，xml文件内容如下，这是我们的第一条线

<?xml version="1.0" encoding="utf-8"?>
<objectAnimator xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="2000"
    android:propertyName="pathData"
    android:valueFrom="M 20,20 L 50,20 80,20"
    android:valueTo="M 20,20 L 50,50 80,20"
    android:valueType="pathType"
    android:interpolator="@android:anim/bounce_interpolator"
    >
</objectAnimator>

第二条线：文件名为：objectanimator.xml

<?xml version="1.0" encoding="utf-8"?>
<objectAnimator xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="2000"
    android:propertyName="pathData"
    android:valueFrom="M 20,80 L 50,80 80,80"
    android:valueTo="M 20,80 L 50,50 80,80"
    android:valueType="pathType"
    android:interpolator="@android:anim/bounce_interpolator"
    >
</objectAnimator>

(3)如下是VectorDrawable，也就是矢量图SVG，建立在drawable文件夹下的xml文件，我这文件名为：vectordrawable.xml不要给这些称呼吓到，其实就一个意思就是一种放大或缩小不会失真的图片而已，当然还有其他的优点，不失真只是优点之一，还有一个就是占用内存小，详细的内容大家可以百度，这里只带你入门

<?xml version="1.0" encoding="utf-8"?>
<vector xmlns:android="http://schemas.android.com/apk/res/android"
    android:height="200dp"
    android:width="200dp"
    android:viewportHeight="100"
    android:viewportWidth="100"
    >
    <group>
        <!-- strokeColor：画笔颜色|strokeWidth：画笔宽|strokeLineCap：画笔线间隙 -->
        <path
            android:name="path1"
            android:strokeColor="@android:color/holo_green_dark"
            android:strokeWidth="5"
            android:strokeLineCap="round"
            android:pathData="M 20,80 L 50,80 80,80"
            ></path>
        <path
            android:name="path2"
            android:strokeColor="@android:color/holo_green_dark"
            android:strokeWidth="5"
            android:strokeLineCap="round"
            android:pathData="M 20,20 L 50,20 80,20"
            ></path>
    </group>

</vector>

第一个<path>标签里是第一条直线的一些参数，第二个就是第二条的参数，strokeColor是画笔颜色的意思，以下的相信大家可以看的懂了

（4）最后一个是我们的AnimatedVectorDrawable，在文件夹drawable下我的文件名是：animatedvectordrawable.xml，（重点请注意：在布局引用的时候就是引用这个文件名作为src的值，如android:src="drawable/animatedvectordrawable"）谷歌工程师把它比喻成连接VectorDrawable和objectAnimator的胶水，作用也是如此看下面

<?xml version="1.0" encoding="utf-8"?>
<animated-vector xmlns:android="http://schemas.android.com/apk/res/android"
    android:drawable="@drawable/vectordrawable"
    >
    <target
        android:animation="@animator/objectanimator"
        android:name="path1"
        ></target>
    <target
        android:animation="@animator/objectanimator1"
        android:name="path2"
        ></target>
</animated-vector>

好了，就这么简单，几行代码就实现了一个动画效果，如果对你有帮助，记得在下面赞一个噢！