Vector Asset Studio的使用

作者: 小彤花园 | 来源:发表于2016-03-09 19:25 被阅读2910次

    因为VectorDrawable中有path标签,里边的path data内容比较复杂,那么我们可以用<b>Vector Asset Studio</b>来帮助我们生成一下xml文件。

    1.打开Vector Asset Studio

    打开一个项目,在Android视图中,右击res文件夹,选择New->Vector Asset


    因为这个要求Gradle的插件必须在1.5.0以上,如果提示要更新插件,那么就把你的插件更新到1.5.0以上。

    2.导入一个Vector的图形

    有两种方式,一种是添加一个material icon,另一种是导入一个SVG的文件。

    2.1 添加material icon

    在Vector Asset Studio的界面中,选择<b>Material Icon</b>,然后点击<b>Choose</b>,选择你要添加的图标。


    之后你可以对文件名、尺寸、透明度、启动RTL布局自动镜像等作出修改,修改完成之后点击next,

    那么什么时候要开启RTL布局镜像这个东西呢?

    一般是在你需要把图片左右对换的情况下,举个例子:有一些语言是从右向左读的,如果你有一个箭头的icon,可能从左指向右,在从右向左读的这种情况中,可能要反过来,这种时候你就可以用到RTL了。

    <h2>Note:</h2>如果你用的之前的旧项目,你可能需要在AndroidManifest里边加上<code>android:supportsRtl="true"</code>。在5.0以上是支持自动镜像的,就不用手动添加了。


    选择你的<b>Target Module</b>和<b>Res Directory</b>,Target Module就不用多说了。 其中,Res Directory大概有几种选择:

    • src/main/res
    • src/debug/res
    • src/release/res
    • user-defined source

    最后,点击<b>Finish</b>,就大功告成。

    这时候,你会发现在你的<code>app/src/main/res/drawable</code>(如果选择的是第一个目录的话)文件夹里多了一个vector drawable的xml文件。

    生成完之后,我们就要build我们的项目了,如果你的最小的API是<b>Android 4.4(API 20)或者更小</b>,Vector Asset Studio会自动生成PNG文件。你可以从<code>app/build/generated/res/pngs/debug/</code>文件夹中看到这些png文件。

    2.2 导入SVG文件

    1.在Vector Asset Studio界面中选择<b>Local SVG file</b>,导入<b>本地</b>的SVG文件。



    2.之后的操作同上。
    生成完Vector Drawable之后,我们就要把它添加到layout中来了,其实跟普通的drawable一样用。
    有一点不同的是,如果你需要drawable资源的确切的类的时候,你可能要根据版本区分一下:

    if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) { 
       VectorDrawable vectorDrawable = (VectorDrawable) drawable;
     } else { 
       BitmapDrawable bitmapDrawable = (BitmapDrawable) drawable;
    }
    

    如果想对Vector Asset Studio生成的xml文件作出修改的时候,需要注意版本的问题。
    针对<b>Android5.0(API 20)及以上的版本</b>,Vector Asset Studio支持<b>所有</b>的Drawable和VectorDrawable的属性。
    针对<b>Android4.4(API 20)及以下的版本</b>,Vector Asset Studio只支持以下的属性:

    <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
    

    而且,只有5.0及以上的版本才支持<b>动态属性</b>,举个例子:

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

    打包

    因为版本问题,你可以有两种打包方式:
    1.包里边既有vector image文件,也有png文件,这种是<b>最简单</b>的方法
    2.根据API版本打不同的包,5.0以上的里边去掉生成的png文件,这样包会小很多。

    相关文章

      网友评论

      本文标题:Vector Asset Studio的使用

      本文链接:https://www.haomeiwen.com/subject/zjqtlttx.html