VectorDrawable 动画

2023年7月24日 159次阅读 来源: 小吉快跑呀

资源索引
svg转xml的工具

安卓的Lollipop -> VectorDrawable

SVG pathData 的简单理解

  • M = moveto(M X,Y) ：将画笔移动到指定的坐标位置
  • L = lineto(L X,Y) ：画直线到指定的坐标位置
  • H = horizontal lineto(H X)：画水平线到指定的X坐标位置
  • V = vertical lineto(V Y)：画垂直线到指定的Y坐标位置
  • C = curveto(C X1,Y1,X2,Y2,ENDX,ENDY)：三次贝赛曲线
  • S = smooth curveto(S X2,Y2,ENDX,ENDY)
  • Q = quadratic Belzier curve(Q X,Y,ENDX,ENDY)：二次贝赛曲线
  • T = smooth quadratic Belzier curveto(T ENDX,ENDY)：映射
  • A = elliptical Arc(A RX,RY,XROTATION,FLAG1,FLAG2,X,Y)：弧线
  • Z = closepath()：关闭路径

矢量图的XML定义

<vector //定义矢量图
    android:name="test" //定义该drawable的名字
    android:width="300dp" //矢量图宽度
    android:height="96dp"  //矢量图高度
    android:viewportWidth="150" //将具体的宽度划分成相对的单位单元。300dp被分割成了150个单元单位。
    android:viewportHeight="48" //将具体的高度划分成相对的单元单位。96dp被分割成48个单元单位。/> 
    
<path //绘制路径
    android:name 定义该 path 的名字，这样在其他地方可以通过名字来引用这个路径
    android:pathData 和 SVG 中 d 元素一样的路径信息。
    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
    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 值来指定的。/>
    
<clip-path=>//定义当前绘制的剪切路径。注意，clip-path 只对当前的 group 和子 group 有效
    android:name 定义 clip path 的名字
    android:pathData 和 android:pathData 的取值一样。/>

Animator动画的定义



<objectAnimator xmlns:android="http://schemas.android.com/apk/res/android"
    android:propertyName="trimPathEnd" //对某个属性进行变化 可以对pathData , 颜色等属性进行变化
    android:valueType="pathType"
    android:valueFrom="0"
    android:valueTo="1"
    android:duration="5000"
    android:interpolator="@android:interpolator/linear">
</objectAnimator>

AnimatedVectorDrawable的XML定义

<?xml version="1.0" encoding="utf-8"?>
<animated-vector 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    android:drawable="@drawable/your_vector_drawable">
    <target
        android:animation="@animator/your_anim1"
        android:name="group_in_your_drawable1">
    </target>
    
      <target
        android:animation="@animator/your_anim2"
        android:name="group_in_your_drawable2">
    </target>
    
</animated-vector>

将AnimatedVectorDrawable传给Imageview等控件.
再获取里面的Drawable转成AnimationDrawable.调用start函数即可播放上面为每一个target设置的动画

    原文作者：小吉快跑呀
    原文地址: https://www.jianshu.com/p/d227f8d8732d
    本文转自网络文章，转载此文章仅为分享知识，如有侵权，请联系博主进行删除。
点赞