四、Android绘制知识总结(画布篇)

Canvas(画布)，绘制的载体，可以通过Paint(画笔)在上面绘制所有你想绘制的图案。

1、Canvas绘制API

其包含一系列drawXXX方法： 1、绘制颜色

java 复制代码

public void drawColor(int color)
public void drawARGB(int a, int r, int g, int b)
public void drawRGB(int r, int g, int b)

2、绘制形状

绘制点

java 复制代码

void drawPoint(float x, float y, Paint paint)
void drawPoints(float[] pts, Paint paint)
void drawPoints(float[] pts, int offset, int count, Paint paint)

绘制线段

java 复制代码

void drawLine(float startX, float startY, float stopX, float stopY, Paint paint)
void drawLines(float[] pts, int offset, int count, Paint paint)
void drawLines(float[] pts, Paint paint)

绘制矩形

java 复制代码

void drawRect(RectF rect, Paint paint)
void drawRect(Rect r, Paint paint)
void drawRect(float left, float top, float right, float bottom, Paint paint)

绘制圆角矩形，与shape标签不同的是，它不能单独设置4个圆角

java 复制代码

void drawRoundRect(RectF rect, float rx, float ry, Paint paint)
void drawRoundRect(float left, float top, float right, float bottom, float rx, float ry, Paint paint)

绘制双框圆角矩形

java 复制代码

void drawDoubleRoundRect( RectF outer, float outerRx, float outerRy, RectF inner, float innerRx, float innerRy, Paint paint)

/**
  * 这个方法通过内外边框来完成绘制，且内外边框的四个角的圆角半径都可控
  * @param outer 外边框的范围
  * @param inner 内边框的范围
  * @param innerRadii、outerRadii 
  * 这两个float数组分别保存了内外边框的四个角的圆角半径
  * 每个数组需要传入8个float，每两个为一组 rx，ry即圆角半径在x,y方向的值
  * @param paint 这里我传入的paint里面保存着bitmapShader
  * 此外需要注意设置Style：
  * FILL将会绘制到两个矩形（RectF）中间的内容
  * STROKE，就是会把两个边框给绘制出来。
  */
void drawDoubleRoundRect(RectF outer, float[] outerRadii, RectF inner, float[] innerRadii, Paint paint)

绘制圆

java 复制代码

void drawCircle(float cx, float cy, float radius, Paint paint)

绘制椭圆

java 复制代码

void drawOval(RectF oval, Paint paint)
void drawOval(float left, float top, float right, float bottom, Paint paint)

绘制弧

java 复制代码

void drawArc(RectF oval, float startAngle, float sweepAngle, boolean useCenter, Paint paint)
void drawArc(float left, float top, float right, float bottom, float startAngle, float sweepAngle, boolean useCenter, Paint paint)

绘制路径

java 复制代码

void drawPath(Path path, Paint paint)

3、绘制图像

java 复制代码

void drawBitmap(Bitmap bitmap, float left, float top, Paint paint)
void drawBitmap(Bitmap bitmap, Rect src,  RectF dst, Paint paint)
void drawBitmap(Bitmap bitmap, Rect src,  Rect dst, Paint paint) 

void drawPicture(Picture picture)
void drawPicture(Picture picture, RectF dst)

android.graphics.Picture相对于Drawable和Bitmap来说，更加小巧，它并不存储实际的像素，仅仅记录了每个绘制的过程。使用介绍

4、绘制文字

绘制常规文字

java 复制代码

void drawText(char[] text, int index, int count, float x, float y, Paint paint)
void drawText(String text, float x, float y, Paint paint)
void drawText(String text, int start, int end, float x, float y, Paint paint) 
void drawText(CharSequence text, int start, int end, float x, float y, Paint paint)

注意：这里x和y坐标分别表示文字起始位置和文字基线位置坐标。

沿路径绘制文字

java 复制代码

void drawTextOnPath(char[] text, int index, int count, Path path, float hOffset, float vOffset, Paint paint)
void drawTextOnPath(String text, @NonNull Path path, float hOffset, float vOffset, Paint paint)

float hOffset：与路径起始点的水平偏移量
float vOffset：与路径起始点的垂直偏移量

drawTextRun 对汉字没用，可以不用了解

java 复制代码

void drawTextRun(char[] text, int index, int count, int contextIndex, int contextCount, float x, float y, boolean isRtl, Paint paint)
void drawTextRun(CharSequence text, int start, int end, int contextStart, int contextEnd, float x, float y, boolean isRtl, Paint paint)
void drawTextRun(MeasuredText text, int start, int end, int contextStart, int contextEnd, float x, float y, boolean isRtl, Paint paint)

其余：

java 复制代码

public void drawPaint(Paint paint)

绘制3D图形利器

java 复制代码

void drawVertices(@NonNull VertexMode mode, int vertexCount, @NonNull float[] verts,
            int vertOffset, @Nullable float[] texs, int texOffset, @Nullable int[] colors,
            int colorOffset, @Nullable short[] indices, int indexOffset, int indexCount,
            @NonNull Paint paint)

2、Canvas变换操作

1、每次调用drawXXX系列函数来绘图时，都会产生一个全新的Canvas透明图层。

2、如果在调用drawXXX系列函数前，调用平移、旋转等函数对Canvas进行了操作，那么这个操作是不可逆的。每次产生的画布的状态都是执行这些操作后的状态。

3、在Canvas图层与屏幕合成时，超出屏幕范围的图像是不会显示出来的。

Canvas变换只会影响后续绘制内容。

1、平移操作

java 复制代码

void translate(float dx, float dy) `

2、缩放操作

java 复制代码

void sacle(float sx, float sy)`
//相当于先translate(dx, dy)，再sacle(sx, sy),再反向translate(-dx, -dy)
void sacle(float sx, float sy, float dx, float dy)

3、旋转操作

java 复制代码

void rotate(float degress)
void rotate(float degress, float px, float py)

4、倾斜操作

java 复制代码

void skew(float sx, float sy)

5、Matrix，通过矩阵等操作Canvas

java 复制代码

void setMatrix(Matrix matrix)

3、Canvas裁剪

切割操作，只能绘制图像到指定区域内

java 复制代码

void clipXXX(...)

反切割操作，只能绘制图像到指定区域外

java 复制代码

void clipOutXXX(...)

注意：clip系列函数需要禁用硬件加速功能

java 复制代码

setLayerType (LAYER_TYPE_SOFTWARE,null)

4、状态恢复与保存

当Canvas经过变换操作或裁剪操作后，后续操作都是基于变换后的Canvas，都将受到影响。所以Canvas提供save、restore和restoreToCount方法来保存和恢复状态。

1、save

java 复制代码

int save()

会保存当前Canvas的Matrix和Clip等信息到Canvas的私有栈中。返回当前栈的位置，可作为Canvas.restoreToCount()的入参，用于快速恢复到当前状态。

2、restore

java 复制代码

void restore()

Canvas的私有栈中恢复Matrix和Clip等信息。

3、restoreToCount

java 复制代码

void restoreToCount(int saveCount)

与restore()类似，但restore()只能依次从私有栈中弹出，而restoreToCount()，可以弹出到私有栈中特定的位置。

示例代码如下：

java 复制代码

canvas.drawRect(100, 100, 300, 300, paint);  
int count = canvas.save();  
canvas.rotate(45, 200, 200);  
paint.setColor(Color.GRAY);  
canvas.drawRect(100, 100, 300, 300, paint);  
canvas.restoreToCount(count);  
canvas.drawLine(200, 100, 200, 300, paint);

5、离屏渲染

离屏渲染，意思是把内容绘制到单独的缓冲画布中，从而保证绘制的内容不受旧画布的影响。一般配合Xfermode使用，同时需要禁止硬件加速。

Android通过了saveLayer、saveLayerAlpha两个方法来实现离屏渲染。它们能够为Canvas创建一个缓冲画布，后续对该Canvas的操作都将基于最新的画布上来完成。

saveLayer

java 复制代码

int saveLayer(RectF bounds, Paint paint)
int saveLayer(float left, float top, float right, float bottom, Paint paint)

创建缓冲画布，并保存画笔对象，并在离屏渲染结束后，画布restore()时，将缓冲画布用该画笔与旧画布进行混合。

saveLayerAlpha

java 复制代码

int saveLayerAlpha(RectF bounds, int alpha)
int saveLayerAlpha(float left, float top, float right, float bottom, int alpha)

创建缓冲画布，在离屏渲染结束后，画布restore()时，将缓冲画布用alpha与旧画布进行混合。

一般流程是：先绘制目标图(dst)，然后设置Xfermode，再绘制原图(src)，最后清除Xfermode。

代码如下：

java 复制代码

//禁止使用硬件加速
setLayerType(View.LAYER_TYPE_HARDWARE, null); 
//离屏绘制
int layerId = canvas.saveLayer(0, 0, getWidth(), getHeight(), paint, Canvas.ALL_SAVE_FLAG); 
//绘制目标图 
canvas.drawBitmap(createDstBitmap(), 0, 0, paint);  
//设置混合模式
paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.DST_IN));  
//绘制原图
canvas.drawBitmap(createSrcBitmap(), 0, 0, paint);  
//清除混合模式
paint.setXfermode(null);  
canvas.restoreToCount(layerId);

更多有关Xfermode和硬件加速的知识，请参考：Android绘制知识总结(Xfermode和硬件加速)