绘图［上］（四）
image.png
目录
绘图工具
Android下绘图需要使用view.使用自定义的view完成绘制． 其中需要使用的有三个工具：Paint，Canvas，Path.
Paint
绘图需要两个工具，笔和纸。
这里的 Paint相当于笔，而 Canvas相当于纸，不过需要注意的是 Canvas（画布）无限大，没有边界，切记理解成只有屏幕大小。
API | 含义 |
|---|---|
setAntiAlias(); | 设置画笔的锯齿效果 |
setColor(); | 设置画笔的颜色 |
setARGB(); | 设置画笔的A、R、G、B值 |
setAlpha(); | 设置画笔的Alpha值 |
setTextSize(); | 设置字体的尺寸 |
setStyle(); | 设置画笔的风格（空心或实心） |
setStrokeWidth(); | 设置空心边框的宽度 |
getColor(); | 获取画笔的颜色 |
Canvas
Canvass是画布．
API | 含义 |
|---|---|
canvas.drawPoint(x,y,paint); | 绘制点 |
canvas.drawLine(startX,startY,endX,endY,paint); | 绘制直线 |
canvas.drawRect(left,top,right,button,paint); | 绘制矩形 |
canvas.drawRect(left,top,right,button,radiusX,radiusY,paint); | 绘制圆角矩形 |
canvas.drawCircle(圆心X坐标,Y坐标,半径,paint1); | 绘制圆 |
canvas.drawArc(left,top,right,button, startAngle, sweepAngle, useCenter, paint2); | 绘制弧形/扇形 |
Path
顾名思义，就是路径的意思．
使用Path不仅可以绘制简单的图形（如圆形，矩形，直线等），也可以绘制复杂一些的图形（如正多边形，五角星等），还有绘制裁剪和绘制文本都会用到Path。
API | 含义 |
|---|---|
moveTo | 移动起点 |
lineTo | 连接直线 |
setLastPoint | 设置终点 |
close | 闭合路劲 |
addRect | 添加矩形 |
addRoundRect | 添加圆角矩形 |
addOval | 添加椭圆 |
addCircle | 添加圆 |
addPah | 添加路劲 |
addArc | 添加圆弧 |
arcTo | 圆弧 |
isEmpty | 是否为空 |
isRect | 是否为矩形 |
set | 替换路劲 |
offset | 偏移路劲 |
quadTo | 贝塞尔曲线 二次贝塞尔曲线的方法 |
cubicTo | 贝塞尔曲线 三次贝塞尔曲线的方法 |
setFillType | 填充模式 |
getFillType | 填充模式 |
isInverseFillType | 是否逆填充 |
toggleInverseFillType | 相反模式 |
getFillType | 填充模式 |
incReserve | 提示方法 |
computeBounds | 计算边界 |
reset，rewind | 重置路劲 |
transform | 矩阵操作 |
好了，理论结束，下面开始实战．
使用Canvas和Paint画圆
首先创建一个新的类，集成于view类：
HelloView.java文件：
package com.example.user.test11;
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.util.AttributeSet;
import android.view.View;
public class HelloView extends View{
public HelloView(Context context, AttributeSet attrs) {
super(context, attrs);
// TODO Auto-generated constructor stub
}
@Override
protected void onDraw(Canvas canvas) {
// TODO Auto-generated method stub
super.onDraw(canvas);
// 设置画笔
Paint mPaint = new Paint();
// 设定画笔颜色
mPaint.setColor(Color.BLACK);
//抗锯齿
mPaint.setAntiAlias(true);
//获取控件的宽高
int width = getWidth();
int height = getHeight();
//设置半径
int raius = width/4;
//画圆
canvas.drawCircle(width/2,height/2, raius, mPaint);
}
}然后再activity_main.xml中添加：
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout 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"
tools:context=".MainActivity">
<com.example.user.test11.HelloView
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</android.support.constraint.ConstraintLayout>这样就可以了，代码里有注释，不再过多解释.
编译后的效果：
image.png
运行的效果：
image.png
好丑，下面让我们来画个太极图吧．Ｏ（∩＿∩）Ｏ
小练习（太极图源码)
HelloView.java文件：
package com.example.user.test11;
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.util.AttributeSet;
import android.view.View;
public class HelloView extends View{
public HelloView(Context context, AttributeSet attrs) {
super(context, attrs);
// TODO Auto-generated constructor stub
}
@Override
protected void onDraw(Canvas canvas) {
// TODO Auto-generated method stub
super.onDraw(canvas);
// 设置画笔
Paint mPaint = new Paint();
// 设定画笔颜色
mPaint.setColor(Color.BLACK);
//抗锯齿
mPaint.setAntiAlias(true);
//获取控件的宽高
int width = getWidth();
int height = getHeight();
//设置半径
int raius = width/4;
// 设定画笔填充类型(不填充)
mPaint.setStyle(Paint.Style.STROKE);
//绘制圆
canvas.drawCircle(width/2, height/2, raius, mPaint);
// 设定画弧区域
float left = width/2 - raius;
float top = height/2 - raius;
float right = width/2 + raius;
float bottom = height/2 + raius;
// 设定画笔填充类型(填充)
mPaint.setStyle(Paint.Style.FILL);
//绘制一个黑色的半圆（下半圆）
canvas.drawArc(left, top, right, bottom, 0, 180, true, mPaint);
//绘制圆（黑色区域的头）
canvas.drawCircle(width/2 - raius/2, height/2, raius/2, mPaint);
// 设定画笔颜色
mPaint.setColor(Color.WHITE);
//绘制圆（白色区域的头）
canvas.drawCircle(width/2 + raius/2, height/2, raius/2, mPaint);
//绘制圆（白色眼睛）
canvas.drawCircle(width/2 - raius/2, height/2, raius/10, mPaint);
// 设定画笔颜色
mPaint.setColor(Color.BLACK);
//绘制圆（黑色眼睛）
canvas.drawCircle(width/2 + raius/2, height/2, raius/10, mPaint);
}
}activity_main.xml文件没有变化：
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout 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"
tools:context=".MainActivity">
<com.example.user.test11.HelloView
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</android.support.constraint.ConstraintLayout>配置效果：
image.png
运行结果：
image.png
参考
Android开发中三个绘图工具(Paint，Canvas，Path)的基本用法（总结） Android绘图（2D绘图、3D绘图） Android 自定义View之绘图 Android开发--图形图像与动画（一）--Paint和Canvas类