Android自定义View基础之Canvas、Paint介绍

Android自定义View是每个初级开发者向中高级开发者进阶的必要条件，所以接下来就自定义View的基础会做一些介绍和学习，与大家一起进步。

首先学习关于自定义View最基础的相关类Canvas：

Canvas英文含义为画布，

Canvas.drawXXX()

 是自定义绘制最基本的操作。掌握了这些方法，你才知道怎么绘制内容，例如怎么画圆、怎么画方、怎么画图像和文字。组合绘制这些内容，再配合上 

Paint

的一些常见方法来对绘制内容的颜色和风格进行简单的配置，就能够应付大部分的绘制需求了。

Paint英文含义为涂料，也就相当于画家手中的画笔，Paint可以设置其属性包括颜色，画笔绘制模式，及画笔线条宽度等等；

使用时首先需要new一个Paint对象；

Paint mPaint=new Paint();

mPaint.setColor(Color.BLUE);//设置画笔颜色
mPaint.setAntiAlias(true);//设置抗锯齿
mPaint.setStrokeWidth(5);//设置线条宽度
mPaint.setStyle(Paint.Style.STROKE);//设置绘制模式

如我们想画一个半径为200的圆，那么我们可以这样去操作：

canvas.drawCircle(300,300,200,mPaint);//画圆

如我们想画一个矩形，那么可以这样书写：

canvas.drawRect(100, 400, 500, 800, mPaint);//画矩形

我们注意到canvas.drawCircle(floatcx,floatcy,floatradius,
@NonNull Paintpaint);需要传4个参数，其中前三

个均为要画的圆的属性，包括圆心的坐标，圆的半径，paint参数为公共属性，我们可以公用相同的paint变量，只需要动态更改其属性即可；
相应的xml文件为：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.lcy.neusoft.activity.PaintLearningActivity">
<com.lcy.neusoft.widget.PaintView
android:layout_gravity="center"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>

效果图如下:

我们注意到，圆的坐标分别为cx=300,cy=300,那么这个坐标是怎么计算的呢？在
Android 里，每个 View 都有一个自己的坐标系，

彼此之间是不影响的。这个坐标系的原点是 View 左上角的那个点；水平方向是 x 轴，右正左负；竖直方向是 y 轴，下正上负（注意，

是下正上负，不是上正下负，和上学时候学的坐标系方向不一样）。也就是下面这个样子。



所以一个 View 的坐标 (x, y) 处，指的就是相对它的左上角那个点的水平方向 x 像素、竖直方向 y 像素的点。例如，(300, 300) 指的

就是左上角的点向右 300 、向下 300 的位置； (100, -50) 指的就是左上角的点向右 100 、向上 50 的位置。也就是说， 

canvas.drawCircle(300,
300, 200, paint)

 这行代码绘制出的圆，在 View 中的位置和尺寸应该是这样的：



drawPoints方法可以采用如下两种形式：

public void drawPoints (float[] pts, Paint paint)

public void drawPoints (float[] pts, int offset, int count, Paint paint)

参数说明

pts：绘制端点的数组，每个端点占用两个数据。

offset：跳过的数据个数，这些数据将不参与绘制过程。

count：实际参与绘制的数据个数。

paint：绘制时所使用的画笔。

mPaint.setStrokeWidth(20);//设置线条宽度
mPaint.setStyle(Paint.Style.STROKE);//设置绘制模式
mPaint.setStrokeCap(Paint.Cap.ROUND);//SQUARE画方形

float[] points = {0, 0, 50, 50, 50, 100, 100, 50, 100, 100, 150, 50, 150, 100};
canvas.drawPoints(points, 2, 10, mPaint);

效果如图：