关于Canvas的save和restore的那些事

最新推荐文章于 2024-01-04 18:24:16 发布

过自己想过的生活

最新推荐文章于 2024-01-04 18:24:16 发布

阅读量8.3k

点赞数 7

CC 4.0 BY-SA版权

分类专栏： Android 文章标签： android canvas 保存和恢复 android绘制

本文链接：https://blog.youkuaiyun.com/u011043551/article/details/73692134

Android 专栏收录该内容

69 篇文章

订阅专栏

本文深入探讨了Android中Canvas的save和restore方法如何影响坐标系的变化，包括平移、旋转等操作，通过具体代码实例展示了这些变化的具体效果。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

本篇博客主要是关于一个canvas在调用save和restore会产生什么影响。android中的Canvas我们直接使用的场景并不是很多，在我的印象中，只有在自定义View，手动绘制bitmap和手动更新SurfaceView的时候会需要手动的在Canvas上绘制图形。
在尚未对Canvas进行操作前，Canvas的坐标与屏幕的坐标相同，且原点重合，详细的如下图所示：
这里写图片描述

我们在使用Canvas的save和restore方法时，基本上都是伴随着我们需要对Canvas进行平移或者旋转操作，这里的这些操作将会对Canvas的坐标产生一些影响，这些影响包括改变坐标的原点，X坐标轴和Y坐标轴的方向等。
下面根据代码来详细分析这些Canvas的操作，代码实现如下：

        canvas.drawCircle(40,40,40,mPaint);
        canvas.save();//保存当前画布状态
        mPaint.setColor(Color.BLUE);
        //画布右移mWidth/2,此时画布的原点位置由原来的（0,0）移动至（mWidth/2,0）
        canvas.translate(mWidth/2,0);
        canvas.drawCircle(0,40,40,mPaint);
        canvas.restore();
        mPaint.setColor(Color.GREEN);
        canvas.drawCircle(40,mHeight/2,40,mPaint);

在代码中首先在（40,40）的位置绘制了一个半径为40的圆，这里的数字表示的都是像素，在绘制完成会，我们保存当前的canvas状态，在这里我就理解为复制了一个canvas，并将这个canvas向右移动mWidth/2，这时，canvas的坐标的原点已经发生改变了，如图所示：
这里写图片描述
这时在执行绘制动作，在（0,40）绘制一个圆，然后调用Canvas的restore方法，相当于将新复制的canvas上的内容与原来的canvas的内容进行合并，这个合并根据屏幕的坐标进行的（个人是这么理解的），在调用restore方法后，新复制的canvas就被销毁了，而原来的canvas的坐标还是以左上角为原点的坐标系，代码的运行结果如下:
这里写图片描述

运行结果跟我们分析的也是一致！！！

再来看一段代码：

        canvas.drawCircle(0,0,80,mPaint);
        canvas.save();
        canvas.rotate(90);//顺时针旋转
        mPaint.setColor(Color.BLACK);
        canvas.drawCircle(mWidth/2,0,80,mPaint);
        canvas.restore();
        mPaint.setColor(Color.GREEN);
        canvas.drawCircle(mWidth/2,mHeight/2,80,mPaint);

在代码中首先在（0,0）的位置绘制了一个半径为80的圆，这里只能看到1/4的圆，其余部分绘制到屏幕外面了，在绘制完成会，我们保存当前的canvas状态，理解为复制了一个canvas，并将这个canvas顺时针旋转90度，这时，canvas的坐标的X、Y轴的方向已经发生改变了，如图所示：
这里写图片描述
然后再在（mWidth/2,0），绘制一个半径为80的圆，有图可以看出，将会有半个圆绘制在屏幕外，用户只能看到半个圆，然后调用restore方法，将新复制的canvas和原来的canvas上的内容根据屏幕坐标系进行合并。
然后再在（mWidth/2,mHeight/2）的位置绘制一个半径为80的圆，由于此时canvas的坐标系就是原来的默认的坐标系，所以这个圆会绘制在View的中心处，代码的运行结果如图所示：
这里写图片描述