最近在复习巩固自定义View相关的知识点，发现还是有挺多基础知识点是完全忘记了，于是想在复习过程中将复习到的知识点整理并记录下来，方便加深记忆
。
Canvas简介
Canvas即画布，是Android中2D图形绘制的重要元素，适合画各种图形，功能强大。
Canvas常用操作速查
| 操作类型 | 相关API | 备注 |
|---|---|---|
| 绘制颜色 | drawColor, drawRGB, drawARGB | 使用单一颜色填充整个画布 |
| 绘制基本形状 | drawPoint, drawPoints, drawLine, drawLines, drawRect, drawRoundRect, drawOval, drawCircle, drawArc | 依次为 点、线、矩形、圆角矩形、椭圆、圆、圆弧 |
| 绘制图片 | drawBitmap, drawPicture | 绘制位图和图片 |
| 绘制文本 | drawText, drawPosText, drawTextOnPath | 依次为 绘制文字、绘制文字时指定每个文字位置、根据路径绘制文字 |
| 绘制路径 | drawPath | 绘制路径，绘制贝塞尔曲线时也需要用到该函数 |
| 顶点操作 | drawVertices, drawBitmapMesh | 通过对顶点操作可以使图像形变，drawVertices直接对画布作用、 drawBitmapMesh只对绘制的Bitmap作用 |
| 画布剪裁 | clipPath, clipRect | 设置画布的显示区域 |
| 画布快照 | save, restore, saveLayerXxx, restoreToCount, getSaveCount | 依次为 保存当前状态、 回滚到上一次保存的状态、 保存图层状态、 回滚到指定状态、 获取保存次数 |
| 画布变换 | translate, scale, rotate, skew | 依次为 位移、缩放、 旋转、错切 |
| Matrix(矩阵) | getMatrix, setMatrix, concat | 实际画布的位移，缩放等操作的都是图像矩阵Matrix，只不过Matrix比较难以理解和使用，故封装了一些常用的方法。 |
Canvas画各种基本图形
1.绘制画布的颜色：
canvas.drawColor(Color.BLUE); //绘制蓝色
2.绘制一个点或是一组点：
canvas.drawPoint(150, 150, mPaint); //在坐标(150,150)位置绘制一个点
canvas.drawPoints(new float[]{ //绘制一组点，坐标位置由float数组指定
450,500,
450,600,
450,700
},mPaint);
3.绘制直线：绘制直线需要有起始点和终点两点的坐标，同样的也可以画一组线
canvas.drawLine(200,200,400,500,mPaint); // 在坐标(200,200)(400,500)之间绘制一条直线
canvas.drawLines(new float[]{ // 绘制一组线 每四数字(两个点的坐标)确定一条线
50,100,100,100,
50,200,100,200
},mPaint);
4.绘制矩形：矩形有四个角，因此绘制的时候至少需要知道对角线上两个点的坐标，另外还可以用Rect（int型）或是RectF（float型）进行绘制（同样是需要知道两个点的坐标）
// 第一种
canvas.drawRect(200,200,800,400,mPaint);
// 第二种
Rect rect = new Rect(200,200,800,400);
canvas.drawRect(rect,mPaint);
// 第三种
RectF rectF = new RectF(200,200,800,400);
canvas.drawRect(rectF,mPaint);
5.绘制圆角矩形：
// 第一种 RectF rectF = new RectF(200,200,800,400); canvas.drawRoundRect(rectF,35,35,mPaint); // 第二种 canvas.drawRoundRect(200,200,800,400,35,35,mPaint);
基本的图形绘制大概就先掌握这几个，但是我们得把它应用到实际当中，所以我为了将这些知识点学以致用，于是做了一个demo,这个demo就是使用canvas逐个画点，并将这些点逐个的画成一个“陈”字，具体看下面。
实例
xml文件直接引用自定义View，activity_main.xml文件代码如下：
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" tools:context="com.chen.canvas.MainActivity"> <com.chen.canvas.CanvasView android:layout_width="match_parent" android:layout_height="match_parent" android:background="#ffffff" /> </LinearLayout>
自定义View中CanvasView.java文件代码如下：
package com.chen.canvas; import android.content.Context; import android.graphics.Canvas; import android.graphics.Color; import android.graphics.Paint; import android.os.Handler; import android.os.Message; import android.support.annotation.Nullable; import android.util.AttributeSet; import android.util.Log; import android.view.View; /** * Created by Administrator on 2018/4/10 0010. */ public class CanvasView extends View { // x 轴坐标数组 private int xPoint1[] = {100,150,200,250,300,350, 300,250,200,225,250,275,300, 250,230,210,190,180,170,160,150, 150,150,150,150,150,150,150, 400,450,500,550,600,650,700, 570,550,530,450,400, 450,500,550,600,650, 550,550,550,550,550,550,550,550,520,510,500, 480,470,460,450,440, 630,640,650,660,670}; // y 轴坐标数组 private int yPoint1[] = {100,100,100,100,100,100, 150,200,220,240,260,280,300, 310,320,330,340,350,340,330,320, 150,200,250,300,350,400,450, 200,200,200,200,200,200,200, 100,125,150,250,300, 300,300,300,300,300, 230,260,290,320,350,370,400,430,410,390,370, 350,360,370,380,390, 350,360,370,380,390}; // 画笔 private Paint mPaint; // 存放已经画过的点的x轴坐标 private int xPoint2[] = new int[xPoint1.length]; // 存放已经画过的点的y轴坐标 private int yPoint2[] = new int[yPoint1.length]; // 记录画下一个点的位置 private int i = 0; public CanvasView(Context context) { super(context); } public CanvasView(Context context, @Nullable AttributeSet attrs) { super(context, attrs); initPaint(); } /** * 初始化画笔Paint */ private void initPaint() { mPaint = new Paint(); mPaint.setColor(Color.GREEN); mPaint.setStyle(Paint.Style.FILL); mPaint.setStrokeWidth(10f); } @Override protected void onDraw(Canvas canvas) { super.onDraw(canvas); if (i < xPoint1.length){ canvas.drawPoint(xPoint1[i], yPoint1[i], mPaint); // 画点 xPoint2[i] = xPoint1[i]; yPoint2[i] = yPoint1[i]; postInvalidateDelayed(120); i++; Log.i("BBBBB", "onDraw: 大爷画点--------"+i); } for (int j = 0; j < xPoint2.length; j++) { canvas.drawPoint(xPoint2[j], yPoint2[j], mPaint); Log.i("BBBBB", "onDraw: 画到哪个点了--------"+j); } } }
MainActivity.java文件的代码如下：
package com.chen.canvas; import android.support.v7.app.AppCompatActivity; import android.os.Bundle; public class MainActivity extends AppCompatActivity { @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); } }
效果图如下gif图所示：
好了，今天就暂时先学这几个基本图形的绘制，接下来继续学习其他基本图形的绘制，到时候再和大家一起共同学习探讨。
