Svg在Android中的支持

添加多屏幕密度支持的vector矢量图
Android Studio有一个工具选项叫Vector Asset Studio,它可以添加material icons 或者是导入SVG文件到你的工程中,而无论是material icons或者是svg文件导入到工程之后都会被转换成VectorDrawable矢量图。使用vector drawable代替bitmaps的好处是:首先可以减少apk的大小;其次在不损失图片质量的前提下vector drawable可以适配几乎所有屏幕密度的设备。
关于 Vector Asset Studio工具
前面说了Vector Asset Studio工具可以导入material icons 或者是 本地svg文件,并且导入后就会生成一个xml格式的vector矢量图。类似这样:

<vector   xmlns:android="http://schemas.android.com/apk/res/android"
    android:height="200dp"
    android:viewportHeight="100.0"
    android:viewportWidth="100.0"
    android:width="200dp">
    <path
        android:name="path1"
        android:strokeColor="@color/colorAccent"
        android:strokeWidth="5"
        android:strokeLineCap="round"
        android:pathData="M 20,80
                          L 50,80 80,80 " />
    <path
        android:name="path2"
        android:strokeColor="@color/colorAccent"
        android:strokeWidth="5"
        android:strokeLineCap="round"
        android:pathData="M 20,20
                          L 50,20 80,20" />
</vector>

其实表示的是下面图中右边的图:
这里写图片描述
但是有一个问题vector矢量图是在Android5.0及其以上才会支持的,那么Android 4.4 及其以下是如何应用这张图片呢?其实你在创建vector xml的同时Vector Asset Studio工具同时在不同的dpi文件中会生成相应的png图片。如图:
这里写图片描述
这样就发挥不出vector drawable的优势了。(因为这样引用的其实就是png图片而已)这时候就要使用支持库了。下面讲解支持库的使用。
使用vector drawable的两种方式
1、如果你的工程minimum API level大于等于21
正常使用没有任何关系
2、如果你的工程minimum API level小于21,你仍然要使用vector drawable的话就必须使用支持库Support Library 23.2 or higher。
这里有几点需要注意:
(1)首先你的activity必须继承AppCompatActivity
(2)其次在你的 module的build.gradle中根据Android Plugin Gradle版本的不同需要加上这几句:
对于Android Plugin for Gradle 2.0 or higher需要加上:

android {
  defaultConfig {
    vectorDrawables.useSupportLibrary = true
  }
}

dependencies {
  compile 'com.android.support:appcompat-v7:23.2.0'
}

对于Android Plugin for Gradle 2.0以下需要这样:

android {
  defaultConfig {
    // Stops the Gradle plugin’s automatic rasterization of vectors
    generatedDensities = []
  }
  // Flag to tell aapt to keep the attribute ids around
  aaptOptions {
    additionalParameters "--no-version-vectors"
  }
}

(3)在应用vector drawable的时候需要这样写,加入有一个ImageView要应用一个叫做test的vector drawable:

   <ImageView
        android:id="@+id/img_animated_vector"
        android:layout_width="match_parent"
        android:layout_height="400dp"
        app:srcCompat="@drawable/test"/>

注意
(1)在Android 4.4 及其以下版本只支持部分有关vector drawable的属性:

<vector>

android:width
android:height
android:viewportWidth
android:viewportHeight
android:alpha
<group>

android:rotation
android:pivotX
android:pivotY
android:scaleX
android:scaleY
android:translateX
android:translateY
<path>

android:pathData
android:fillColor
android:strokeColor
android:strokeWidth
android:strokeAlpha
android:fillAlpha
android:strokeLineCap
android:strokeLineJoin
android:strokeMiterLimit

只有Android 5.0及其以上才支持动态属性:

android:fillColor="?android:attr/colorControlNormal"

AnimatedVectorDrawable的无限可能
AnimatedVectorDrawable动画基于 group path有无限的可能下面展示几个动画,在AnimatedVectorDrawable中很容易实现:
这里写图片描述
这里写图片描述
这里写图片描述
代码地址:
githu代码地址
参考:

 * (1) 不是说VectorDrawable无论是在缩小还是在放大都不会损失图片质量吗?
 *     但是在我的手机(4.4)上放大VectorDrawable还是会损失质量?
 *     答:其实使用VectorDrawable分两种情况
 *     1、Android 5.0及其以上可以直接使用 Vector的有关API 没有任何问题
 *     2、Android 4.4及其以下就必须使用支持库来实现对Vector相关API的支持,但是这样也只是只是Vector的一部分API并不能全部支持,
 *     而原理是:svg会自动生成不同dpi的png图片。这样做的优点只是只需要提供一套svg格式的图片就行,等到程序编译的时候会自动在各个dpi中
 *     生成相应png图片
 *     自然对于固定的手机(Android 4.4 及其以下)放大的是PNG图片而不是矢量图,所以还是会损失质量。
 *     参考文档地址如下:
 *     Add Multi-Density Vector Graphics 文档地址 https://developer.android.com/studio/write/vector-asset-studio.html
 *
 *     补充:
 *     其实并不是上面上的那样子,在Android 4.4及其以下的版本的时候,首先一定要自己的Activity一定要继承AppCompatActivity 其次禁止生成png
 *
 * (2) 有关RTL LTR的问题 http://book.51cto.com/art/201311/418549.htm
 * (3) Android VectorDrawable api文档地址 https://developer.android.com/reference/android/graphics/drawable/VectorDrawable.html
 * (4) Andrid Working With Drawables 文档地址 https://developer.android.com/training/material/drawables.html
 * (5) Add Multi-Density Vector Graphics 文档地址 https://developer.android.com/studio/write/vector-asset-studio.html
 *
 * (6)总结比较全面的文档地址 https://laobie.github.io/android/2016/05/31/vectors-for-all-finally.html
 * (7)将svg格式的图片转换为VectorDrawable 地址 http://inloop.github.io/svg2android/
 * (8)material icons 地址 https://design.google.com/icons/
Considerations for SVG files
A vector drawable is appropriate for simple icons. The material icons provide good examples of the types of images that work well as vector drawables in an app. In contrast, many app launch icons do have many details, so they work better as raster images.

The initial loading of a vector graphic can cost more CPU cycles than the corresponding raster image. Afterward, memory use and performance are similar between the two. We recommend that you limit a vector image to a maximum of 200 x 200 dp; otherwise, it can take too long to draw.

Although vector drawables do support one or more colors, in many cases it makes sense to color icons black (android:fillColor="#FF000000"). Using this approach, you can add a tint to the vector drawable that you placed in a layout, and the icon color changes to the tint color. If the icon color isn't black, the icon color might instead blend with the tint color.

Vector drawable backward-compatibility solutions
  • 3
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值