Android 自定义View-Canvas

Canvas的使用

Paint简单介绍

画笔，用于绘制内容的具体效果，如：颜色、文字大小、线条粗细、阴影，实心空心等。

常用API

Paint.setStyle(Style style) 设置绘制模式
Style 具体来说有三种： FILL, STROKE 和 FILL_AND_STROKE 。FILL 是填充模式，STROKE 是画线模式（即勾边模式


Paint.setColor(int color) 设置颜色
Paint.setStrokeWidth(float width) 设置线条宽度
Paint.setTextSize(float textSize) 设置文字大小
Paint.setAntiAlias(boolean aa) 设置抗锯齿开关

Canvas绘制

drawColor 绘制颜色

protected void onDraw(Canvas canvas) {
    super.onDraw(canvas);
    //canvas.drawColor(Color.GREEN);
    //canvas.drawColor(Color.parseColor("#88880000"));
    canvas.drawRGB(100, 200, 100);
    //canvas.drawARGB(100, 100, 200, 100);
}

drawCircle 绘制圆形

private void init() {
    paint = new Paint(Paint.ANTI_ALIAS_FLAG);
    paint.setColor(Color.RED);
}

protected void onDraw(Canvas canvas) {
    super.onDraw(canvas);
    paint.setStyle(Paint.Style.FILL);
    //圆心坐标，半径，画笔
    canvas.drawCircle(110, 110, 100, paint);

    paint.setStrokeWidth(10);
    paint.setStyle(Paint.Style.STROKE);
    canvas.drawCircle(110, 320, 100, paint);
}

drawRect 绘制矩形

protected void onDraw(Canvas canvas) {
    super.onDraw(canvas);
    paint.setStyle(Paint.Style.FILL);
    //左上右下四个顶点坐标，画笔
    canvas.drawRect(100, 100, 200, 200, paint);

    paint.setStrokeWidth(10);
    paint.setStyle(Paint.Style.STROKE);
    canvas.drawRect(100, 250, 200, 350, paint);
}

drawRoundRect 绘制圆角矩形

protected void onDraw(Canvas canvas) {
    super.onDraw(canvas);
    paint.setStyle(Paint.Style.FILL);
    //左上右下四个顶点，圆角半径
    canvas.drawRoundRect(100, 100, 500, 300, 50, 50, paint);

    paint.setStrokeWidth(10);
    paint.setStyle(Paint.Style.STROKE);
    canvas.drawRoundRect(100, 400, 500, 600, 50, 50, paint);
}

drawPoint 绘制点

protected void onDraw(Canvas canvas) {
    super.onDraw(canvas);
    paint.setStrokeWidth(20);
    //点的样式
    paint.setStrokeCap(Paint.Cap.ROUND);
    //点的坐标，画笔
    canvas.drawPoint(100, 100, paint);

    paint.setStrokeWidth(20);
    paint.setStrokeCap(Paint.Cap.SQUARE);
    canvas.drawPoint(150, 150, paint);
}

drawPoints 绘制多个点

protected void onDraw(Canvas canvas) {
    super.onDraw(canvas);
    paint.setStrokeWidth(20);
    paint.setStrokeCap(Paint.Cap.ROUND);
    float[] points = {10, 10, 50, 50, 100, 100, 150, 150, 200, 200};
    //所有点坐标，跳过前几个，一共绘制8个数（4个点）
    canvas.drawPoints(points, 2, 8, paint);
}

drawOval 绘制椭圆

protected void onDraw(Canvas canvas) {
    super.onDraw(canvas);
    paint.setStyle(Paint.Style.FILL);
    //左上右下四个坐标
    canvas.drawOval(50, 100, 250, 250, paint);

    paint.setStyle(Paint.Style.STROKE);
    canvas.drawOval(50, 300, 250, 450, paint);
}

drawArc 绘制弧线或扇形

protected void onDraw(Canvas canvas) {
    super.onDraw(canvas);
    //左上右下四个顶点
    RectF rectF = new RectF(100F, 100F, 400F, 300F);
    //设置填充模式
    paint.setStyle(Paint.Style.FILL);
    //startAngle：弧形开始角度，sweepAngle：弧形划过角度
    //useCenter：是否连接圆心
    canvas.drawArc(rectF, -100, 100, true, paint);
    canvas.drawArc(rectF, 30, 90, false, paint);
    paint.setStyle(Paint.Style.STROKE);
    canvas.drawArc(rectF, 130, 50, false, paint);
}

drawLine 绘制线

protected void onDraw(Canvas canvas) {
    super.onDraw(canvas);
    paint.setStrokeWidth(20);
    canvas.drawLine(200, 200, 500, 500, paint);
}

drawLines 绘制多条线

protected void onDraw(Canvas canvas) {
    super.onDraw(canvas);
    paint.setStrokeWidth(5);
    float[] points = {20, 20, 120, 20, 70, 20, 70, 100, 20, 100, 120, 100};
    canvas.drawLines(points, paint);
}

drawBitmap 绘制Bitmap

canvas.drawBitmap(bitmap, 200, 200, new Paint());

drawText 绘制文本

protected void onDraw(Canvas canvas) {
    super.onDraw(canvas);
    paint.setTextSize(30);
    canvas.drawText("hello", 100, 100, paint);
}

代码下载