Android矢量图VectorDrawable

** VectorDrawable** android5.0开始支持矢量图,它非常适合图标,是独立于屏幕密度的,一个文件适合所有屏幕。当缩放的时候还可以保存所有的图片质量,通常文件所占用的空间也非常小使用VectorDrawable 可以大幅度的减少apk大小。最新的AppCompat23.2库通过使用VectorDrawableCompat可以支持在android api7+版本上使用矢量图

矢量图svg转vectorDrawable

android并不支持web上的svg这种矢量图片格式,而是以VectorDrawable的方式来实现矢量图的效果,因此我们需要自行转换

转换工具

  • android studio自带转换工具(图片上文字会丢失)

  • http://inloop.github.io/svg2android/

  • http://astudent.github.io/SvgToVectorDrawableConverter.Web/

项目中使用

  1. AppCompatImageView或者AppCompatImageButton或其子类,必须在app:srcCompat标签中使用
    • appcompat 23.2.0开始,提供了以上两种支持库一个用于兼容矢量图,但是这个支持库要使用的话,还得在app的gradle里面加个这样的配置
//在gradle2.0及以上:
android {
  defaultConfig {
  vectorDrawables.useSupportLibrary = true
}}
* 代码使用

  1. TextView button上使用
  • 项目中大量icon是用textview drawableLeft等属性使用..
 
 

高版本可以直接用drawable方式使用,低版本需要包裹层StateListDrawable等实现,且对应activity加上句代码,下个模块会说明

兼容性解决

在Android 5.0之前(API level 21),Support Library 23.2或者更高的版本提供了矢量图片和矢量图片动画完整的支持。

  1. AnimatedVectorDrawableCompat通过两个新的Support Libraries:support-vector-drawable和animated-vector-drawable分别进行支持;
    在你app模块的build.gradle文件中添加vectorDrawables元素,使你的app使用矢量图support library;
android {  
    ... ...  
    defaultConfig {  
        ... ...  
        vectorDrawables.useSupportLibrary = true  
    }  
    ... ...   
}

普通控件上使用Vector,就必须依附于StateListDrawable,InsetDrawable,LayerDrawable,LevelListDrawable,RotateDrawable



    

同时activity中加以下代码

   static {       
   AppCompatDelegate.setCompatVectorFromResourcesEnabled(true);
          }

有个坑就是该页面activity需继承自AppCompatActivity以支持compat兼容包属性

  1. 我们也可以采用低版本构建生成PNG图片的兼容方式;
    flight/build.gradle文件
apply plugin: 'com.android.library'  
android {  
    ... ...  
    aaptOptions {  
        additionalParameters "--no-version-vectors"  
    }  
    ... ...  
}  

性能

  1. 运行时间
        long aaa = System.currentTimeMillis();
        for (int i = 0; i < 100000; i++) {
            Resources res = getResources();
            Drawable drawable = res.getDrawable(R.drawable.aa_b_test);
            imageView.setImageDrawable(drawable);
        }
        Log.e("+++++++++++++++++", System.currentTimeMillis() - aaa + "++++++++++++");

结论是矢量图4191 普通位图3193

  1. size大小
    矢量图:661字节,
    位图:一套图(200*200)5kb,按项目要求4套大概10几kb

总结

  1. 优点
  • 图片扩展性:不损伤图片质量,一套图适配所有
  • 图片大小:比使用位图小十几倍,有利与减小apk size
  1. 缺点
  • 性能优损失,系统渲染VectorDrawable需要花费更多时间,因为矢量图的初始化加载会比相应的光栅图片消耗更多的CPU周期,但是两者之间的内存消耗和性能接近。
  • 矢量图主要用在色调单一的icon

可以只考虑在显示小图片的时候使用矢量图(建议你限制矢量图在200200dp)*

问题

Not supported SVG features

These SVG elements are not supported by VectorDrawable: patterns, masks, gradients, images, etc.
VectorDrawable fill-rule is always non-zero and cannot be changed prior to Android 7.0 (Nougat). If you end up with areas filled that should not be filled, that is because the SVG image was created using even-odd rule instead. There are three ways to deal with this problem: try specifying the --fix-fill-type option, manually edit SVGs in vector graphics software or convert for Android 7.0+.

所以svg转换VectorDrawables时并不是100%还原,像我们遇到过luachicon会出现圆角丢失。建议:单色调的icon使用矢量图

你可能感兴趣的:(Android矢量图VectorDrawable)