美文网首页
学习笔记--矢量图和矢量动画

学习笔记--矢量图和矢量动画

作者: sugaryaruan | 来源:发表于2017-11-18 14:46 被阅读25次

Android 5.0(API 级别 21)及以上版本支持矢量图,

如果要在Android2.1(API 7)到Android 4.4(API 20)版本使用矢量图,需要:

  1. Gradle 的 Android 插件 2.0 或更高版本
  2. 使用support 23.2或更高版本支持
  3. Gradle配置
defaultConfig {
    vectorDrawables.useSupportLibrary = true
  }
  appcompat-v7
  1. 使用AppCompatImageView, 使用app:srcCompat
  • 如果你的Activity直接或间接继承自AppCompatActivity,当前视图中的ImageView在编译过程中会被自动转为AppCompatImageView(support包中所有含有AppCompat前缀的控件均受相同处理),因而在Activity中通过findViewById()的实例用ImageView或AppCompatActivity接收是没有区别的。

涉及到的类:

VectorDrawable
VectorDrawableCompat
AnimatedVectorDrawableCompat

Vector Asset Studio 支持必要的标准,但并非支持所有 SVG 和 PSD 功能,如果您收到错误,应验证矢量图是否像预期一样显示

矢量图适用于简单的图标,与对应的png图像相比,矢量图首次加载时可能消耗更多的 CPU 资源,所以推荐将矢量图像限制为最大 200 x 200 dp

在很多情况下,最好将图标设置为黑色 (android:fillColor="#FF000000")。通过此方法,您可以为布局中放置的矢量图添加 tint 属性,图标颜色将随之变为 tint 颜色。如果图标颜色不是黑色,图标颜色可能反而与 tint 颜色较为搭配。

如果最低 API 级别为 Android 4.4(API 级别 20)及更低版本,且您未启用支持库技术,则 Vector Asset Studio 将生成 PNG 文件

适合icon图标的应用场景,不适用于频繁切换回收的应用场景,会造成卡顿,因为矢量图是不被硬件加速支持的

注意点

对PathData做缩放,旋转,位移时,name名称对应矢量图标签 < group > 来实现的

<vector> 的 android:viewportWidth 和 android:viewportHeight 就是设置画布的大小

PathData内容说明:

如果同一个命令连续用多次,那么后面命令的字母是可以省略的,例如 M 25,25 L 50,25 L 50,50,第二个 L 是可以省略的,可以写成 M 25,25 L 50,25 50,50

大写字母代表绝对路径,小写的字母代表相对路径

参考文章:

  1. Android使用矢量图(SVG, VectorDrawable)实践篇
  2. Android矢量动画实践
  3. SVG 的 PathData 在 Android 中的使用
  4. Android 矢量图动画(完结篇)

相关文章

网友评论

      本文标题:学习笔记--矢量图和矢量动画

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