【Android】SVG和VectorDrawable——相关格式转换
SVG是矢量图,刚接触尚不能仔细介绍,但只需记得一点:放大不失真,存储也方便。
因为多数户型图使用SVG格式,Android要用的话必须通过相关转换工具,将原SVG格式文件,转换为XML后缀的VectorDrawable文件。
通过万能的百度查询,发现早已有人做好了相关转换工具。
地址1——SVG2Android:这是Git上的开源项目,clone下来后在浏览器中打开index即可使用。
PS:火狐浏览器貌似不支持Bake transforms into path (experimental),需要谷歌浏览器(可以勾选)或者其他浏览器(没试过)。
地址2——SVG-Android:也是Git上的开源项目,是将SVG直接转换为PNG这样的图片。
PS:仅clone下来项目,查看了相关代码,并没有具体测试,因为目前暂时不需要将SVG转为图片来使用。
原生的正常的SVG文件可以通过上面工具转为Android使用的VectorDrawable文件,但是我需要对SVG剪切一部分呢?在剪切、添加、修改之后,我需要对SVG进行放大或缩小呢?
那么你就需要Inkscape这个强大的矢量图编辑器了。
做完你想要的任何效果之后,在保存的时候,你是不是一下子点击确定,却忘了格式是否正确呢?
我就是这样,直接点击确定,然后到AndroidStudio中去转换(事实上AS自带SVG转VectorDrawable功能),发现并不能正常读取,AS提示说这是一个空文件(或者找不到对应标签)。
File >>> New >>> Vector Asset >>> Local SVG file >>> Image file ...
不要苦恼,首先读取出错肯定是文件格式不支持,原生的SVG文件在AS中肯定得到很好的转换效果,但你通过第三方矢量图修改工具,进行编辑之后再保存,通常都携带有第三方工具的一些信息。
那么你就要在保存的时候,看清楚并选好相应的后缀。
我在使用的时候发现,默认的Inkscape SVG 和普通 SVG保存之后,前者会多出来很多第三方定义的信息,有什么图层之类的。
而普通SVG相对而言,也仅仅是少了一些第三方信息,修改之后的结构依然是以line这样的标签为主,对于转换来说,不是很友好。
然后我是用优化的SVG去保存,它会弹出来一些选项,通过对这些选项的舍取,保存完之后打开的SVG源代码跟原生SVG文件几乎没有差别。
唯一多出来的是transform="matrix(a,b,c,d,e,f)"这样的属性,通过百度得知这是大学高数里面的矩阵变换,转换起来有点小复杂。
所以AS即使能够对【优化的SVG】文件进行转换,预览的效果也有所偏差,具体就是这个属性导致的元素偏移。
那么回过头来看看上面的SVG2Android工具,为什么要提Bake transforms into path (experimental)属性呢?
就是因为它对transform的支持,不会使转换之后的图像产生一定程度上的偏移。
那么结论来了:
1、正常的原生SVG文件,使用AS自带转换器即可(特方便)。
2、如果AS自带转换器无法使用(有可能是第三方编辑器导致坐标转换出错),那么就使用SVG2Android去转换格式。
3、如果还是无法转换坐标,那么就使用SAX方式,解析SVG文件标签,一一对应VectorDrawable中的标签即可。
第三部分的结论目前还在编写代码中,事实上这仅仅是对特殊SVG文件的一种应对,相信前面两种工具已经对普遍意义的SVG作了很好的转换支持。