Android SVG向量資源的使用方法

android 5.0（lollipop, api 21）後，新增了標籤，以vectordrawable的形式支援svg型別向量圖形（svg本質為xml標記描述的圖形）。

※ android不直接支援svg圖形檔案

svg檔案（xml）對應的vectordrawable資源封裝格式為：

※ 通常由svg檔案轉換為vectordrawable，而非手工錄入

是 vectordrawable 對應的根標籤

android:width與android:height對應向量圖的實際參考尺寸（實際可根據容器尺寸無損縮放，但此值將作為容器（imageview）的 wrap_content 參考尺寸），基於載入效能考慮，google推薦限定在 200x200dp 以內，一般與下面的viewportwidth和viewportheight成比例定義

android:viewportwidth與android:viewportheight是指當前drawable對應的canvas的大小，用於為標籤中的路徑資料提供繪製位置的參考座標系及繪製範圍

標籤對應路徑資訊, 這裡的path與我們自定義繪製圖形時用的path原理一樣, 就是記錄一些繪圖操作, 具體對應其中的 pathdata。

android:fillcolor為預設黑色（#ff000000）時，在view容器內將使用tint顏色取代，否則將呈現為android:fillcolor與tint的混合顏色。

路徑的路徑描述指令含義表：

m = moveto 相當於 android path 裡的moveto(),用於移動起始點 
l = lineto 相當於 android path 裡的lineto()，用於畫線 
h = horizontal lineto 用於畫水平線 
v = vertical lineto 用於畫豎直線 
c = curveto 相當於cubicto(),三次貝塞爾曲線 
s = smooth curveto 同樣三次貝塞爾曲線，更平滑 
q = quadratic belzier curve quadto()，二次貝塞爾曲線 
t = smooth quadratic belzier curveto 同樣二次貝塞爾曲線，更平滑 
a = elliptical arc 相當於arcto()，用於畫弧 
z = closepath 相當於closeto(),關閉path
大寫代表絕對位置, 小寫代表相對位置

官方標準定義細則參考：svg paths definition - w3c

【iconfont】阿里媽媽向量圖示平台

inkscape

跨平台開源向量圖形編輯軟體，免費 + 三平台通用，支援直接編輯xml資料

類似的軟體還有illustrator、coreldraw等

對於android 5.0之前的裝置，有兩種方式相容vectordrawable資源：

android studio 內建乙個名為 vector asset studio 的工具，在低版本sdk上編譯apk期間，針對vectordrawable指令碼自動生成一組png點陣圖資源bitmapdrawable，取代向量圖形（在5.0及以後的手機上執行時會正常引用vectordrawable）。

需要配置build.gradle：

defaultconfig

※ 自動生成png時，所支援的vectordrawable元素子集

support library 23.2+ 包中包含vectordrawablecompat和animatedvectordrawablecompat相容類，用於**中橋接為bitmapdrawable及其動畫支援，其中drawable最低sdk為android 2.1，動畫最低sdk為android 3.0

※ 相容包要求使用gradle 2.0或以上版本，並且不支援vectordrawable巢狀引用，不支援直接解析為vectordrawable型別，也不再編譯期生成png點陣圖

build.gradle配置如下：

android 
}dependencies

相容包在向量資源引用、**呼叫時，存在一定限制

**中使用setimageresource()指定資源 id 時，無需更改**

將 vectordrawable 用於 view 背景時，需要通過以下**設定：

resources resources = context.getresources(resources, int, theme);
theme theme = context.gettheme();
drawable drawable = vectordrawablecompat.create(resources, r.drawable.vector_drawable, theme);
view.setbackground(drawable);

**中需要進行drawable的實現型別轉換時，可使用以下**段執行：

if (build.version.sdk_int >= build.version_codes.lollipop)  else

使用向量圖可進行特殊的動畫繪製，如形態變換、動態繪圖等。

定義向量資源及其關聯動畫 xml 指令碼

建立向量圖形資源vectordrawable，並在需要動畫特效的子元素上使用屬性android:name給定任意動畫物件名

建立animator屬性動畫指令碼，可使用objectanimator或animatorset，對vectordrawable的特定元素屬性進行動畫控制

建立animatedvectordrawable，作用是連線vectordrawable與animator，組合為單一動畫型drawable物件

建立好的animatedvectordrawable不能直接用於 imageview，需要通過**設定，並顯式開始執行動畫

官方文件建立好的 vectordrawable 動畫資源，需要通過**方式載入到 view 容器內，並指定執行動畫

使用原生支援的**設定（5.0 lollipop, api 21）

imageview imageview = (imageview) findviewbyid(r.id.imageview);
animatedvectordrawable vectordrawable = (animatedvectordrawable) getresources().getdrawable(animatedvectordrawableres, theme);
imageview.setimagedrawable(vectordrawable);
vectordrawable.start();

使用 support library 時的動畫設定

向量動畫要求最低sdk為android 3.0，並且不支援路徑型別的變換

imageview imageview = (imageview) findviewbyid(r.id.imageview);
animatedvectordrawablecompat drawablecompat = animatedvectordrawablecompat.create(context, animatedvectordrawableres);
imageview.setimagedrawable(drawablecompat);
drawablecompat.start();

元素：

元素：遮罩路徑、反蒙版路徑，該路徑範圍內的元素才會真正進行繪製，作用於當前所在的內定義在其後面的所有元素

pathdata 形變動畫參考

Android SVG向量資源的使用方法

譯在 Android 應用中使用向量資源

譯在 Android 應用中使用向量資源

向量的外積向量積

Android SVG向量資源的使用方法

譯 在 Android 應用中使用向量資源

譯 在 Android 應用中使用向量資源

向量的外積 向量積

相關推薦

譯在 Android 應用中使用向量資源

譯在 Android 應用中使用向量資源

向量的外積向量積