svg線上踩坑實錄

因爲svg有着能夠動態縮放而不影響圖片質量的特性，因此項目中只須要導入一張圖片就能夠代替以前的多張png圖片了，能夠減小apk體積。今天給你們分享一下我本身項目中的svg使用經驗，但願能對你們有所幫助。

1.如何導入svg

選中drawable文件夾，右鍵->New->Vector Asset

接下來給圖片取一個名字，在path中選擇好圖片在本地的路徑，點擊Next便可。這裏勾選Override表明自定義圖片大小，使用16 * 16的大小，固然也能夠取消勾選，取消後就是原圖默認大小，且修改框會被置灰不可點擊。

接下來點擊Finish就能夠了

2.如何使用svg

和使用png相似，能夠在xml佈局中使用app:srcCompat="@drawable/圖片名"的方式，而不是android:src的方式，這裏和使用png略有不一樣。

也能夠在代碼中經過setImageResource(R.drawable.圖片名)的方式使用

3.坑點一覽

坑點一  不能經過TextView的drawableLeft這種方式來設置svg圖片

咱們常用TextView中drawableLeft的方式來實現一些最簡單的圖文混排效果，可是若是該圖片是svg的，在5.0以上是沒問題的，可是在4.x會直接crash。

報錯日誌以下：

坑點二  自定義view時圖片id做爲自定義參數時，會致使crash

咱們自定義view時，若是設置了圖片類型的自定義參數，而後嘗試獲取，代碼以下：

若是圖片是svg時，在4.x手機上則會直接crash，報找不到svg圖片。這個問題是上線前一天才發現的，真是嚇出了一身冷汗，如今想來都有點懼怕。。。

解決方案是先try...catch嘗試獲取，若是獲取不到再嘗試使用反射進行獲取

4.x手機通常使用反射都能獲取到，可是我爲了更加地安全，在使用這個id時還進行了判空，若是依然沒有獲取到，就使用默認的圖片

坑點三  AS不支持有遮罩、帶陰影的svg圖片

用AS導入svg圖片時，若是這個圖片有陰影效果，則導入時AS會提示錯誤。可是若是你堅持使用仍是能夠導入成功的，只不過使用之後那些陰影效果就沒有了。

坑點四  非矢量svg在部分手機上有顯示的兼容性問題

有部分svg使用起來挺好的，可是在實際測試時，部分手機上沒報錯，可是顯示的圖片不正常。以下圖，原本這個消息圖片裏是一個笑臉的，可是最終只顯示了一隻眼睛

通過和UI小姐姐360度全方面溝通，原來是這一塊並未使用矢量圖，後面UI小姐姐從新畫了個圖就解決了

總結

svg還有一些其餘的技巧，好比能夠在使用時經過tint屬性來動態修改圖片顏色，因此若是形狀同樣可是背景顏色不同的圖片也只須要導入一張便可。可是svg是一把雙刃劍，有利也有弊，減小apk大小的同時也會帶來不少的兼容性問題，特別是在沒有svg經驗初步使用的時候，必定要作好4.x手機的兼容性工做。建議使用時按部就班，不要一次性把項目裏的icon圖都換成svg，先在不重要的頁面試試點，萬一出問題能夠下降影響。另外svg圖片不能太大，通常只考慮200 * 200之內的。也不能支持很豐富的顏色，因此只能是做爲一些icon小圖片來使用。