前言
官方文档地址:VectorDrawable
检索关键字:vector drawable
矢量绘制基本介绍:
英:A VectorDrawable
is a vector graphic defined in an XML file as a set of points, lines, and curves along with its associated color information. The major advantage of using a vector drawable is image scalability. It can be scaled without loss of display quality, which means the same file is resized for different screen densities without loss of image quality. This results in smaller APK files and less developer maintenance. You can also use vector images for animation by using multiple XML files instead of multiple images for each display resolution.
中:VectorDrawable
是在XML文件中定义为一组点、线和曲线及其相关颜色信息的矢量图形。使用矢量绘制的主要优点是图形的可伸缩性,矢量图形可以在不损失图形显示质量的同时进行伸缩,这意味着同一文件的图像大小可根据不同的屏幕像素密度调整,而不会损失图像质量。这样一来可以有更小的APK文件和开发人员更少的维护。您还可以通过使用多个XML文件而不是对应每个显示分辨率的多个图像来使用矢量图像进行动画实现。【手动翻译,当练习英语了】
1.基本标签格式
安卓开发中, 一个VectorDrawable
可以在XML文档中用 <vector>
标签元素定义。
简单的标签格式如下:
<vector>
<group />
<path />
<clip-path />
</vector>
//vector为矢量图形,clip-Path、group、path为其子标签
一个矢量绘制资源的示例层次结构示例
2.主标签-vector
<vector
android:name="" //矢量绘制的名称
android:width="" //矢量绘制的宽度
android:height="" //矢量绘制的高度
android:viewportWidth="" //矢量绘制的固定宽度
android:viewportHeight="" //矢量绘制的固定高度
android:tint="" //绘图颜色的色调,默认没有
android:tintMode="" //色调的Porter-Duff混合模式,默认值为src_in
android:autoMirrored="" //指明当布局方向为RTL(从右到左)时,是否需要镜像可绘制对象,默认值为false
android:alpha="" //不透明度,默认为1.0
>
</vector>
除了width
、height
、viewportWidth
、viewportHeight
四个属性必需,其余均为可选属性。
3.子标签
3.1 group
group
标签用于定义一组路径或子组以及相关变换信息。变换是在与viewport
相同的坐标中定义。应用变换时,按照缩放、旋转和平移的顺序。该标签为可选项。
<group
android:name="" //组的名字
android:rotation="" //组旋转的角度,默认为0
android:pivotX="" //组的缩放和旋转的轴的X坐标。这是在viewport空间中定义的,默认值为0
android:pivotY="" //组的缩放和旋转的轴的Y坐标。这是在viewport空间中定义的,默认值为0
android:scaleX="" //X坐标上的比例量,默认值为1
android:scaleY="" //Y坐标上的缩放量,默认值为1
android:translateX="" //X坐标上的平移量。这是在viewport空间中定义的,默认值为0
android:translateY="" //Y坐标上的平移量。这是在viewport空间中定义的,默认值为0
>
</group>
3.2 path
定义矢量图形绘制的路径。
<path
android:name="" //path的名字
android:pathData="" //使用与SVG路径数据中的“d”属性完全相同的格式定义路径数据。这是在viewport空间中定义的
android:fillColor="" //指定用于填充路径的颜色。可以是颜色,或者对于SDK 24+,可以是颜色状态列表或渐变色。如 果此属性已设置动画,则动画设置的任何值都将覆盖原始值,如果未指定此属性,则不会绘制路径 填充
android:strokeColor="" //指定用于绘制路径轮廓的颜色。可以是颜色,或者对于SDK 24+,可以是颜色状态列表或渐变 色。如果此属性已设置动画,则动画设置的任何值都将覆盖原始值,如果未指定此属性,则不会绘制 路径轮廓
android:strokeWidth="" //路径画线的宽度。默认值为0
android:strokeAlpha="" //路径画线的不透明度。默认值为1
android:fillAlpha="" //路径填充的不透明度。默认值为1
android:trimPathStart="" //截掉从起点到某个位置的部分,保留剩下的部分,范围从0到1。默认值为0
android:trimPathEnd="" //截掉从某个位置到终点的部分,保留剩下的部分,范围从0到1。默认值为1
android:trimPathOffset="" //在截取path的时候设置path原点的位置,范围从0到1,与上两个属性一起使用。默认值为0
android:strokeLineCap="" //设置线的末端形状,butt,round,square。默认为butt
android:strokeLineJoin="" //设置线的连接处形状,miter,round,bevel。默认为miter
android:strokeMiterLimit="" //设置路径画线的miter形状限制。默认值为4
android:fillType="" //对于SDK 24+,意为设置路径的填充类型。类型可以是“evenOdd”或“nonZero”。它们的行为 与SVG的“填充规则”属性相同。默认值为非零。
/>
3.3 clip-path
定义路径为当前剪切过后的路径,就是相当于已经定义好了一个矢量图形的路径,这时可以使用clip-path对其进行修剪,使得绘制后的图形变为修剪后的图形。需要注意,剪切路径操作仅适用于当前组及其子组,即定义在group
下面的组或者子组,不会对上一级生效。
<clip-path
android:name="" //clip-path的名字
android:pathData="" //使用与SVG路径数据中的“d”属性相同的格式定义剪切路径
/>
4.示例
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:height="64dp"
android:width="64dp"
android:viewportHeight="600"
android:viewportWidth="600" >
<group
android:name="rotationGroup"
android:pivotX="300.0"
android:pivotY="300.0"
android:rotation="45.0" >
<path
android:name="v"
android:fillColor="#000000"
android:pathData="M300,70 l 0,-70 70,70 0,0 -70,70z" />
</group>
</vector>
效果图:
效果图