Android中SVG圖片資源使用

GitHubDemo:https://github.com/xwpeng/TestSVG

一. 基礎

SVG:Scalable Vector Graphics,可伸縮矢量圖形.矢量圖:記錄圖像繪制的規(guī)定信息,根據(jù)這些信息繪制圖片,如用數(shù)學函數(shù)記錄.具有可伸縮,不失真,體積小的特性.由于是根據(jù)規(guī)定信息繪制圖片,復雜的圖片描述起來很困難,適用于簡單規(guī)則的圖片.
  Android圖片適配根據(jù)屏幕密度準備多套png圖片,導致圖片占App的體積大.用SVG代替png可以極大節(jié)省資源內(nèi)存,因為只要一套圖片,一張圖只是一些xml的文字描述.
  Android5.0開始支持SVG,只兼容5.0+.從Gradle Plugin 1.5開始,如果是5.0下SVG轉(zhuǎn)成png.從AppCompat23.2開始,Google開始支持在低版本上使用Vector。
  SVG是使用的時候去繪制,較位圖多了一個繪制過程.簡單且不是頻繁使用的圖標才用SVG.至于運行內(nèi)存,SVG的圖不能說一定比位圖省運行內(nèi)存.圖片占用的運行內(nèi)存受長,寬,單位面積像素點多少影響.由于使用的SVG是較小簡單圖,運行內(nèi)存占用較?。?/p>

2. 使用

注意兼容低版本,下面舉了一些例子,實際用時必須在低版本進行測試.

1. build.gradle(Moudle:app)中添加支持

android {
defaultConfig {
     vectorDrawables.useSupportLibrary true
}
}   

二. 將設計師(自己弄的話用AI,沒試過)給你的SVG格式的圖片拖到 http://inloop.github.io/svg2android/ 中轉(zhuǎn)換成記錄繪制此圖片信息的Xml文件,將文件放到Drawable目錄下.

Xml示例

在Drawable下點擊New->Vector Asset選擇Material Icon可以選AndroidStudio提供的SVG圖片.得到xml文件后可以自行修改顏色值.如果要修改繪制信息(不建議,可以適當了解),參考:Android vector標簽 PathData 畫圖超詳解
可以從阿里圖標庫找素材
阿里圖標庫圖

3. 在ImageView中使用

Activity繼承AppCompatActivity,用ImageView,不是的話用android.support.v7.widget.AppCompatImageView.
加上xmlns:app="http://schemas.android.com/apk/res-auto",再將drawable設置到app:srcCompat

              <ImageView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                app:srcCompat="@drawable/vd_dd" />

用代碼設置

 mImageView.setImageResource(R.drawable.vd_bb);

4. 轉(zhuǎn)成Drawable使用

圖片有時是需要轉(zhuǎn)成Drawable來使用,如TextView中的Drawable.為了兼容Android L以下版本,需要按照以下方法進行轉(zhuǎn)換.
方法一:

VectorDrawableCompat drawable = VectorDrawableCompat.create(getResources(), R.drawable.vd_aa, null);
 TextView videoTextView = (TextView) dialogLayout.findViewById(R.id.res_video_btn);
        VectorDrawableCompat drawable = VectorDrawableCompat.create(getResources(), R.drawable.vd_video, null);
        drawable.setBounds(0, 0, drawable.getIntrinsicWidth(), drawable.getIntrinsicHeight());
        videoTextView.setCompoundDrawables(null, drawable, null, null);

建議使用方法一,較靈活.
方法二:
(1)Activity中加靜態(tài)代碼塊

  static {
        AppCompatDelegate.setCompatVectorFromResourcesEnabled(true);
    }

(2)獲得Drawable

  Drawable drawable = getResources().getDrawable(R.drawable.vd_aa);

如果沒加靜態(tài)代碼塊,5.0下會Crash.

AppCompatDelegate.setCompatVectorFromResourcesEnabled(true);的方法注釋說明了如何兼容AndroidL下版本使用SVG與注意事項.

5. 作為菜單Icon

菜單比較例外,可以直接設置.
android:icon="@drawable/vd_abc_add"
如果是設置Drawable,還是得先轉(zhuǎn)換.

6.不支持漸變和本地資源鏈接

generatedDensities 生成指定分辨率的png圖片
defaultConfig {
...
generatedDensities = ['mdpi', 'hdpi']
}
build 階段生成的png為啥我找不到在哪?

明確說明了Android中不支持SVG顏色漸變的特性.
http://www.itdecent.cn/p/2eb9e14ea8c1

Android的drawable
https://luoweiguang.github.io/2016/07/19/Android%E7%9A%84Drawable/

其他方式漸變色彩可以看看這個
http://www.jcodecraeer.com/a/anzhuokaifa/androidkaifa/2014/1128/2076.html

三.SVG動畫

//todo 動畫獨立成一篇文章整理,目前項目中沒有使用過,處在研究階段.暫不更新.

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容