Android Canvas类

1. Canvas类

Canvas主要用于2D绘图，它提供了很多相应的drawXxx()方法，Canvas的获取方式有三种

• 重写View的onDraw(Canvas)方法

  @Override
  protected void onDraw(Canvas canvas) {
  
  }
  

• SurfaceView通过lockCanvas()方法获取Canvas

  @Override
  public void surfaceCreated(SurfaceHolder holder) {
      Canvas canvas = holder.lockCanvas();
        
      holder.unlockCanvasAndPost(canvas);
  }
  

• 通过Canvas(Bitmap)或setBitmap(Bitmap)自定义Canvas

  Bitmap bitmap = Bitmap.createBitmap(600, 800, Bitmap.Config.ARGB_8888);
  Canvas canvas = new Canvas(bitmap);
  

2. 常用方法

绘制背景

// a为透明度，`r`，`g`，`b`代表颜色值
drawARGB(int a, int r, int g, int b)
drawColor(int color)
drawRGB(int r, int g, int b)

绘制点

// 根据给定的坐标，绘制点
drawPoint(float x, float y, Paint)
// 两个一组组成坐标，pts必须是二的倍数
drawPoints(float[] pts, Paint)
// offset是起始，count是数量，必须是二的倍数
drawPoints(float[] pts, int offset, int count, Paint)

绘制线，线由两个点连接而成

// 根据给定的坐标，绘制线
drawLine(float, float, float, float, Paint)
// 四个一组组成连线，pts必须是四的倍数
drawLines(float[] pts, Paint)
// offset是起始，count是数量，必须是四的倍数
drawLines(float[] pts, int offset, int count, Paint)

绘制矩形和圆角矩阵

// 绘制矩形，rect指定左右上下
drawRect(Rect rect, Paint)
drawRect(RectF, Paint)
drawRect(float, float, float, float, Paint)
// 绘制圆角矩形，rx是横向，ry是纵向
drawRoundRect(RectF, float rx, float ry, Paint)
drawRoundRect(float, float, float, float, float, float, Paint)

绘制椭圆

// 绘制椭圆，rect指定左右上下
drawOval(RectF rect, Paint)
drawOval(float, float, float, float, Paint)

绘制圆

// cx和cy是圆的中心，radius是圆的半径
drawCircle(float cx, float cy, float radius, Paint)

绘制弧形

// startAngle是圆弧开始角度，sweepAngle是圆弧经过的角度，useCenter设置圆弧是否经过中心
drawArc(RectF, float startAngle, float sweepAngle, boolean useCenter, Paint)
drawArc(float, float, float, float, float, float, boolean, Paint)

有两种不同Paint，设置了不同的Color和Style

mRedPaint = new Paint();
mRedPaint.setColor(Color.RED);
mRedPaint.setStyle(Paint.Style.STROKE);
mRedPaint.setStrokeWidth(5);

mBluePaint = new Paint();
mBluePaint.setColor(Color.BLUE);
mBluePaint.setStyle(Paint.Style.FILL_AND_STROKE);
mBluePaint.setStrokeWidth(10);

示例代码

canvas.drawPoint(100, 50, mRedPaint);
float[] pts = new float[]{100, 75, 150, 100, 200, 125};
canvas.drawPoints(pts, mBluePaint);

canvas.drawLine(100, 200, 400, 200, mRedPaint);
pts = new float[]{100, 250, 400, 250,
        400, 250, 250, 450,
        250, 450, 100, 250};
canvas.drawLines(pts, mBluePaint);

canvas.drawRect(100, 500, 300, 600, mRedPaint);
canvas.drawRect(400, 500, 600, 600, mBluePaint);

canvas.drawRoundRect(100, 650, 300, 750, 40, 20, mRedPaint);
canvas.drawRoundRect(400, 650, 600, 750, 40, 20, mBluePaint);

canvas.drawOval(100, 800, 300, 900, mRedPaint);
canvas.drawOval(400, 800, 600, 900, mBluePaint);

canvas.drawCircle(200, 1000, 50, mRedPaint);
canvas.drawCircle(500, 1000, 50, mBluePaint);

canvas.drawArc(100, 1100, 300, 1200, 45, 225, false, mRedPaint);
canvas.drawArc(400, 1100, 600, 1200, 45, 225, true, mRedPaint);

canvas.drawArc(100, 1250, 300, 1350, 45, 225, false, mBluePaint);
canvas.drawArc(400, 1250, 600, 1350, 45, 225, true, mBluePaint);

效果如下

3. 绘制字符

基础绘制字符方法，y是基线，详见Android FontMetrics类

//  x, y 为起始位置
drawText(String text, float x, float y, Paint)
drawText(String text, int start, int end, float x, float y, Paint)
drawText(CharSequence text, int start, int end, float x, float y, Paint)
drawText(char[] text, int index, int count, float x, float y, Paint)

start设置为2，end设置为14，效果如下

设置Paint可以实现不同的样式，详情可见Android Paint类

沿路径绘制

// hOffset与路径起始点的水平偏移距离，vOffset与路径中心点的垂直偏移量 
drawTextOnPath(String text, Path path, float hOffset, float vOffset, Paint)
drawTextOnPath(char[] text, int index, int count, Path path, float hOffset, float vOffset, Paint)

Path是一条斜线，hOffset为80，vOffset为20，效果如下

4. save()和restore()方法

save()方法将当前Canvas状态进行保存，调用restore()方法后，会将Canvas还原成最近的一个save()的状态。
save()方法会有一个返回值，可以调用restoreToCount(int saveCount)方法，将Canvas还原成某一个特定的save()状态。

5. clipPath(Path)方法

clipPath(Path)和clipPath(Path, Region.Op)方法按所定义的路线剪裁，Region.Op参数

• DIFFERENCE剪裁出差异的部分
• INTERSECT剪裁出相交的部分
• UNION剪裁出合并的部分
• XOR，与INTERSECT刚好相反
• REVERSE_DIFFERENCE，与DIFFERENCE相反
• REPLACE，后面覆盖前面

示例代码

private void drawClipPath(Canvas canvas, float dx, float dy, Region.Op op) {
    canvas.save();
    canvas.translate(dx, dy);

    Path path1 = new Path();
    path1.addCircle(150, 100, 75, Path.Direction.CW);
    canvas.clipPath(path1);

    Path path2 = new Path();
    path2.addCircle(250, 100, 75, Path.Direction.CW);
    canvas.clipPath(path2, op);
    canvas.drawColor(Color.RED);

    canvas.restore();
}

效果如下

6. 位移操作

平移操作

translate(float dx, float dy)

示例代码

canvas.drawRect(rect, mRedPaint);
canvas.translate(50, 50);
canvas.drawRect(rect, mBluePaint);

旋转操作

// 以(0, 0)为原点，旋转
rotate(float degrees)
// 以(px, py)为原点，旋转
rotate(float degrees, float px, float py)

示例代码

canvas.drawRect(rect, mRedPaint);
canvas.rotate(45);
canvas.drawRect(rect, mBluePaint);

canvas.rotate(90, 125, 50);
canvas.drawRect(rect, mGreenPaint);

偏离操作

skew(float sx, float sy)

示例代码

canvas.drawRect(rect, mRedPaint);
canvas.skew(1, 0);
canvas.drawRect(rect, mBluePaint);

canvas.skew(0, 1);
canvas.drawRect(rect, mGreenPaint);

缩放操作

scale(float sx, float sy)
scale(float sx, float sy, float px, float py)

示例代码

canvas.drawRect(rect, mRedPaint);
canvas.scale(0.5f, 2f);
canvas.drawRect(rect, mBluePaint);

效果如下

相关文章
Android Path类
Android Paint类
Android Canvas类