利用canvas.save()、canvas.restore()、canvas.translate()、canvas.rotate()绘制一个时钟表盘

这篇博客介绍了如何在Android中利用canvas.save()、canvas.restore()、canvas.translate()和canvas.rotate()方法绘制一个时钟表盘。首先，解释了Android坐标系的基本概念，然后详细阐述了这些方法的作用：save用于保存当前绘图状态，restore用于合并图层，translate用于平移坐标系，rotate则用于旋转坐标系。通过这些方法，作者展示了如何创建一个钟表的坐标定位和旋转效果。

Android绘制坐标系，原点在屏幕左上角，向右为x轴正方向，向下为y轴正方向。

canvas.save();

这个方法作用是将已经绘制的图像保存起来，让后续的操作就好像在一个新图层上操作一样。

 canvas.restore();

这个方法可以理解为合并图层的操作，作用是将save之后绘制的图像和save之前的图像进行合并。

canvas.translate();

这个方法理解成为坐标系的平移与翻转更加合适。默认绘图坐标原点在屏幕左上角。调用canvas.translate(x，y)之后将原点（0,0）移动到了(x,y)。之后操作以(x,y)作为原点执行。

canvas.rotate()；

同样是将坐标系旋转了一个角度。

下面就用这几个方法绘制一个如图所示的钟表表盘：

这里写图片描述

上代码：

        //width为屏幕宽度，height为屏幕高度，
        //绘制圆形表盘
        Paint paintCircle = new Paint();
        paintCircle.setStyle(Paint.Style.STROKE);
        paintCircle.setAntiAlias(true);
        paintCircle.setStrokeWidth(5);
       //以屏幕中心为圆心，宽度一半为半径画圆
        canvas.drawCircle(width/2, height/2, width/2, paintCircle);

        //绘制刻度线
        Paint paintDegree = new Paint();
        paintDegree.setStrokeWidth(3);
        for (int i = 0; i < 24; i++) {
        //判断是否为0、6、12、18四时刻
            if (i == 0 | i == 6 || i == 12 || i == 18) {
                //这四个时刻绘制变宽，字体变大
                paintDegree.setStrokeWidth(5);
                paintDegree.setTextSize(30);
                //绘制刻度线
                canvas.drawLine(width / 2, height/2-width/2, width/2, height/2-width/2 + 60, paintDegree);
                //绘制时刻
                canvas.drawText(i + "", width / 2 - paintDegree.measureText(i + "") / 2, height / 2 - width / 2 + 90, paintDegree);
            } else {
                //不是这四个特殊时刻，字体变小，刻度线变窄
                paintDegree.setStrokeWidth(3);
                paintDegree.setTextSize(15);
                //绘制刻度线
                canvas.drawLine(width / 2, height / 2 - width / 2, width / 2, height / 2 - width / 2 + 30, paintDegree);
                 //绘制时刻
                canvas.drawText(i + "", width / 2 - paintDegree.measureText(i + "") / 2, height / 2 - width / 2 + 60, paintDegree);
            }
            //每回绘制完，绕 width/2, height/2 这个点即屏幕中心点，旋转15度。
            canvas.rotate(15, width / 2, height / 2);
        }

        //绘制时针和分针
        Paint paintHour = new Paint();
        paintHour.setStrokeWidth(20);
        Paint paintMinute = new Paint();
        paintMinute.setStrokeWidth(10);
        //先将之前绘制的保存
        canvas.save();
        //将坐标原点移动至屏幕中心
        canvas.translate(width/2,height/2);
        //绘制时针和分针，绘制从(0,0)原点（现在即中心点）到(100,100)的一条线
        canvas.drawLine(0,0,100,100,paintHour);
        canvas.drawLine(0,0,100,200,paintMinute);
        //合并之前绘制
        canvas.restore();