这是我参与更文挑战的第4天,活动详情查看: 更文挑战
Canvas使用
旋转
围绕指定点旋转
public final void rotate(float degrees, float px, float py)
围绕坐标原点旋转
public void rotate(float degrees)
平移
public void translate(float dx, float dy)
dx dy单位是像素
缩放
sx:x轴缩放的大小
sy:y轴缩放的大小
public void scale(float sx, float sy)
px:x轴的缩放点
py:y轴的缩放点
public final void scale(float sx, float sy, float px, float py)
保存和恢复
canvas.svae():保存画布
canvas.restore(): 释放画布
代码示例:
override fun onDraw(canvas: Canvas?) {
super.onDraw(canvas)
canvas?.save()//保存画布
canvas?.translate(measuredWidth/2f,measuredHeight/2f)
for (i in 0..360 step 60){
canvas?.drawCircle(100f,0f,20f,paint)
canvas?.rotate(60f)
}
canvas?.restore()//释放画布
canvas?.drawCircle(100f,100f,100f,paint)
}
本例的代码中,save和restore中间的操作将画布移动到了屏幕中央,然后围绕屏幕中央绘制了六个圆。restore后canvas状态复原,再次画圆的参考点变为了左上角,圆绘制在了左上角
代码实现效果:
画圆
cx:圆心x坐标
cy:圆心y坐标
radius:圆半径
public void drawCircle(float cx, float cy, float radius, @NonNull Paint paint)
画线
startX:绘制起点x坐标
startY:绘制起点y坐标
stopX:绘制终点x坐标
stopY:绘制终点y坐标
一次绘制一条线
public void drawLine(float startX, float startY, float stopX, float stopY,
@NonNull Paint paint)
一次性绘制多条线
public void drawLines(@Size(multiple = 4) @NonNull float[] pts, int offset, int count,
@NonNull Paint paint)
绘制多个点的代码
override fun onDraw(canvas: Canvas?) {
super.onDraw(canvas)
canvas?.translate(measuredWidth / 2f, measuredHeight / 2f)
val lines = floatArrayOf(-200f, 200f, 200f, 200f, 200f, -200f, -200f, -200f)
canvas?.drawLines(lines, paint)
}
这段代码的效果就是,绘制两条线:
第一条: (-200,200)--(200,200),
第二条线:(200,-200)--(-200,-200)
绘制效果
画椭圆
画椭圆需要构建一个RectF对象
RectF oval = new RectF(150, 200, 500, 400);// 画一个椭圆
canvas.drawOval(oval, p);
画弧形
api
public void drawArc(@NonNull RectF oval, float startAngle, float sweepAngle, boolean useCenter,
@NonNull Paint paint)
绘制代码
val oval = RectF(200f, 200f, 500f, 500f)
override fun onDraw(canvas: Canvas?) {
super.onDraw(canvas)
canvas?.drawArc(oval, 0f, 120f, false, paint)
canvas?.translate(0f,400f)
canvas?.drawArc(oval, 0f, 120f, true, paint)
}
绘制效果
画矩形
api
public void drawRect(float left, float top, float right, float bottom, @NonNull Paint paint)
public void drawRoundRect(@NonNull RectF rect, float rx, float ry, @NonNull Paint paint)
绘制代码
override fun onDraw(canvas: Canvas?) {
super.onDraw(canvas)
canvas?.apply {
drawRect(rect, paint)
translate(0f,500f)
drawRoundRect(rect,60f,80f,paint)
}
}
绘制效果
画多边形
通过Path绘制多边行,path篇有过介绍了
画贝塞尔曲线
通过Path绘制贝塞尔曲线,path篇有过介绍了
画点
api
绘制一个点
public void drawPoint(float x, float y, @NonNull Paint paint)
绘制多个点
public void drawPoints(@Size(multiple = 2) float[] pts, int offset, int count,
@NonNull Paint paint)
画图片
绘制图片代码
override fun onDraw(canvas: Canvas?) {
super.onDraw(canvas)
canvas?.drawBitmap(bitmap, 300f, 300f, paint)
}