Android 中使用svg图片

1. svg认识

  SVG:android5.0+出现,w3c推出
    使用xml 描述二维图形语言,矢量图,放大缩小无影响
 为什么用svg,现在手机的短板是内存,不是cpu,svg通过cpu计算,png占用内存
    Android上对svg进行阉割,使用Vector Drawable对svg支持,svg小

2. svg语法: 

 Vector 语法简介,如何看懂一张svg
            (1)Path指令解析如下所示:
                M = moveto(M X,Y) :将画笔移动到指定的坐标位置,相当于 android Path 里的moveTo()
                L = lineto(L X,Y) :画直线到指定的坐标位置,相当于 android Path 里的lineTo()
                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):弧线 ,相当于arcTo()
                Z = closepath():关闭路径(会自动绘制链接起点和终点)

                注意,’M’处理时,只是移动了画笔, 没有画任何东西。

用notepad++打开一张svg图片:

              <path style="fill:#F2484B;" d="M115.528,421.736c25.394-30.139,39.715-68.501,39.715-109.236
        c0-53.923-25.081-103.697-67.743-135.727v271.453c9.942-7.464,18.916-15.903,26.853-25.123
        C114.693,422.592,115.091,422.138,115.528,421.736z"/>

根据上面语法的去识别:
    fill:填充
 M: 移动到 坐标115.528,421.736
 c:三次贝塞尔曲线 

 svg在线编辑网站:
  https://editor.method.ac/ 
  svg转化为 Vector Drawable网站, 放到Drawable下
  http://svg.zhangningning.com.cn/
  Android中如何使用SVG:

   <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@drawable/method_draw_image"/>

直接当做普通图片使用即可,对于svg图片
  使用AndroidStudio创建svg:
  drawable->Vector Assert

3.svg动画:

发布了100 篇原创文章 · 获赞 102 · 访问量 13万+

猜你喜欢

转载自blog.csdn.net/dreams_deng/article/details/105045912