美文网首页
SVG指令 知道这些就够了

SVG指令 知道这些就够了

作者: MQLX | 来源:发表于2017-08-19 22:32 被阅读0次

    SVG指令常用来编辑图标等图片资源,当然,Android,也支持SVG指令设计图片,这篇博客收录了几个常用指令用法,可供用时查阅~

    首先,使用下列指令时需要注意:

    1、坐标轴以(0,0)为中心,x轴水平向右,y轴水平向下

    2、所有的指令大小写均可,大写代表绝对定位,参照坐标轴,小写代表相对定位,参照当前画笔所在位置。

    下面看看都有哪些常用指令吧~

    1、将画笔移动到某一点

    M X,Y

    效果:将画笔移动到(x,y)位置,此时并没有绘图

    2、绘制直线

    L X,Y

    效果:以当前画笔位置为起点,以(x,y)为终点,绘制一条直线

    3、绘制弧线

    A RX,RY,XROTATION,FLAG1,FLAG2,X,Y

    其实弧线可以看作是一个椭圆的一部分,另外,弧线的起点就是当前画笔所在的位置

    RX、RY:椭圆的半轴大小

    XROTATION:椭圆X轴与水平方向顺时针方向的夹角大小

    FLAG1:只有两个值,1代表取大角度弧线,0代表取小角度弧线

    FLAG2:只有两个值,确定绘制的方向,1代表顺时针,0代表逆时针

    X、Y:终点坐标值

    4、绘制三次贝塞尔曲线

    C X1,Y1,X2,Y2,ENDX,ENDY

    关于贝塞尔曲线可以学习这个博客

    起点就是当前画笔所在的位置

    X1、Y1:参照点1的坐标

    X2、Y2:参照点2的坐标

    ENDX、ENDY:终点坐标

    S X,Y,ENDX,ENDY

    起点就是当前画笔所在的位置

    X、Y:参照点坐标

    5、绘制二次贝塞尔曲线

    Q X,Y,ENDX,ENDY

    起点就是当前画笔所在的位置

    X、Y:参照点坐标

    ENDX、ENDY:终点坐标

    6、闭合路径

    Z


    MQL于2017年8月19日完成本文。

    相关文章

      网友评论

          本文标题:SVG指令 知道这些就够了

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