Android之 SVG绘制

一 SVG介绍

1.1 SVG(Scalable Vector Graphics)是可缩放矢量图形的缩写,它是一种图形格式,其中形状在XML中指定, 而XML又由SVG查看器呈现。

1.2 SVG可以区别于位图,放大可以做到不模糊,可以做一些图标,按钮等绘制,但太复杂的话会导致渲染速度慢,占用内存大。适合简单的图形绘制。

1.3 SVG坐标系也是笛卡尔坐标系,和android绘制坐标系一眼,x=0,y=0点在左上角,与正常的图坐标系相比,y轴被反转。随着SVG中y的增加,点、形状等向下移动,而不是向上。坐标系单位默认是像素px,还可以选择其它单位:

em    The default font size - usually the height of a character.

ex     The height of the character x

px     Pixels

pt     Points (1 / 72 of an inch)

pc     Picas (1 / 6 of an inch)

cm   Centimeters

mm  Millimeters

in     Inches

1.4 SVG元素也非常多,如rect,circle,line,path,text等。但android只支持path,由坐标数据描述点和线的位置



  
    
  
  
    
  

二 android种svg的使用

2.1 上面说了android支持path元素的绘制,而path里面包含以下元素:

m|M = moveto 移动到某点。
l|L = lineto 画一条直线到某点。
h|H = horizontal lineto 画一条水平线到某点。
v|V = vertical lineto 画一条垂直线到某点。
q|Q = quadratic Bézier curveto 二次贝塞尔曲线
t|T = smooth quadratic Bézier curveto 平滑二次贝塞尔曲线
c|C = curveto 三次贝塞尔曲线
s|S = smooth curveto 平滑三次贝塞尔曲线
a|A = elliptical Arc 弧形
z|Z = closepath 从结束点到开始点画一条直线,形成一个闭合的区域。

注意:大写表示绝对位置(窗口x=0,y=0的位置),小写表示相对位置(自身的位置)

2.2  Android种SVG的使用,绘制矩形示例


    

Android之 SVG绘制_第1张图片

2.3 绘制尖头矩形


    

Android之 SVG绘制_第2张图片

2.3 绘制圆角矩形


    

2.4 绘制圆形。注意:开始坐标和结束坐标一样会绘制不上,所以结束坐标要错开点坐标


    

Android之 SVG绘制_第3张图片

2.5 绘制一次贝塞尔曲线


    

    
    

红色是辅助线 

Android之 SVG绘制_第4张图片

2.5 绘制二次贝塞尔曲线 


    

    
    

    
    

Android之 SVG绘制_第5张图片

你可能感兴趣的:(android)