?
? 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作了很好的轉換支持。