View绘制系列(10)-Canvas基础变换

小半 • 2023年1月2日下午3:19 • Android • 阅读 209

Canvas基础变换

前面学习了Canvas相关的一些绘制方法，不知道大家发现没？我们都是根据左上角(0,0)点算出来新的坐标，然后再绘制，这样明显不符合我们平常基于坐标原点绘制的习惯，那么我们能不能直接在原点绘制图形，然后通过操作Canvas来实现移动到目标位置呢？答案是肯定的，这就需要用到Canvas变换方法了。

Canvas变换方法总体分为四类：平移，旋转，放缩，错切。

平移

代码如下：

@Override
protected void onDraw(Canvas canvas) {
    super.onDraw(canvas);
    //移动画布坐标原点到View几何中心
    canvas.translate(getWidth()/2,getHeight()/2);

    Paint paint = new Paint();
    paint.setStyle(Paint.Style.STROKE);
    paint.setColor(Color.BLUE);
    paint.setStrokeWidth(20);

    canvas.drawCircle(0,0,200,paint);
    //保存当前绘制
    canvas.save();

    //恢复画布到绘制圆的状态
    canvas.restore();
}

绘制效果：

旋转

代码如下：

Paint paint = new Paint();
paint.setStyle(Paint.Style.STROKE);
paint.setColor(Color.BLUE);
paint.setStrokeWidth(20);
//旋转画布30度，中心旋转，以顺时针方向为正，逆时针方向为负
canvas.rotate(30);
canvas.drawRect(600,600,1000,900,paint);
canvas.save();
canvas.restore();

运行效果：

放缩

代码如下：

Paint paint = new Paint();
paint.setStyle(Paint.Style.STROKE);
paint.setStrokeWidth(20);paint.setColor(Color.GRAY);
//绘制原始圆环
canvas.drawCircle(600,600,400,paint);
canvas.scale(0.5f,0.5f);
paint.setColor(Color.BLUE);
//绘制缩放0.5f的圆环
canvas.drawCircle(600,600,400,paint);
canvas.save();
canvas.restore();

绘制效果：

错切

代码如下：

Paint paint = new Paint();
paint.setStyle(Paint.Style.STROKE);
paint.setStrokeWidth(20);

paint.setColor(Color.GRAY);
//绘制原始圆环
canvas.drawRect(100,0,600,600,paint);
canvas.save();
//y轴逆时针旋转45度，x轴不变
canvas.skew(1,0);
paint.setColor(Color.BLUE);
//绘制缩放0.5f的圆环
canvas.drawRect(100,0,600,600,paint);
canvas.save();
canvas.restore();