android绘制矢量图
In this tutorial, we’ll be discussing Android Vector Drawable. Furthermore, we’ll be implementing them in our Android Application.
在本教程中,我们将讨论Android Vector Drawable。 此外,我们将在我们的Android应用程序中实现它们。
Android矢量可绘制 (Android Vector Drawable)
Often we use PNG as our drawable images. In order for the PNG images to work for different screen sizes, we create multiple PNG assets with different sizes and densities. Subsequently, PNG images take up extra space and lead to large APK sizes of the Android Apps.
通常,我们使用PNG作为可绘制图像。 为了使PNG图像适合不同的屏幕尺寸,我们创建了多个具有不同尺寸和密度的PNG素材资源。 随后,PNG图像会占用额外的空间,从而导致Android Apps的APK尺寸变大。
This is where Vector Drawable comes to our rescue! They are your replacement for PNG images.
这就是Vector Drawable拯救我们的地方! 它们是PNG图像的替代品。
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.
VectorDrawable是在XML文件中定义为一组点,线和曲线及其关联的颜色信息的矢量图形。
They can be scaled according to the screen size without loss in quality. They are rendered quickly onto the screen too. VectorDrawable are an XML file.
可以根据屏幕尺寸缩放它们,而不会降低质量。 它们也可以快速呈现到屏幕上。 VectorDrawable是一个XML文件。
You can add a new Vector Asset in your drawable folder using New | Vector Asset.
您可以使用New | New在您的可绘制文件夹中添加一个新的Vector Asset。 向量资产 。
Thus we can create Vector drawables of Material Design icons. The code for the VectorDrawable looks like this:
因此,我们可以创建“材质设计”图标的Vector drawables。 VectorDrawable的代码如下所示:
They are set in the vector
tag. android:viewportWidth
and android:viewportHeight
are used in setting the width and height of the drawable bounds. Within these dimensions, the vector drawable is drawn on the canvas.
它们在vector
标签中设置。 android:viewportWidth
和android:viewportHeight
用于设置可绘制范围的宽度和高度。 在这些尺寸内,可绘制矢量在画布上绘制。
path
is the tag that creates the drawable. Inside the path we create lines, curves, arcs and set the border, background color. We do so path commands in the pathData
.
path
是创建可绘制对象的标签。 在路径内部,我们创建直线,曲线,弧线并设置边框,背景色。 我们在pathData
执行path命令。
为矢量资产创建路径 (Creating Path for Vector Assets)
The path commands consist of an alphabet followed by coordinates. Imagine creating paths as doing a painting. Uppercase alphabets represent absolute position. Lowe