Canvas: canvas的save()和restore()
- save(): 用来保存canvas的状态。
- restore(): 用来恢复Canvas旋转、缩放等之后的状态,当和canvas.save( )一起使用时,恢复到canvas.save( )保存时的状态。
注意:
1. 这里的状态包括矩阵的变换状态,如:平移(Translate), 缩放(Scale), 旋转(Rotate), 倾斜(Skew), 以及画布的裁剪区域clip;
2. Canvas的save()和restore()方法只会在有效范围内生效,它是绘制状态的存储器,并不是画布内容的存储器, 在canvas上绘制的路径和位图并不是绘制状态的一部分。
下面使用一个简单的Demo来验证这个结论:
1. 绘制一个简单的圆:
package com.yongdaimi.android.androidapitest.view; import android.content.Context; import android.graphics.Canvas; import android.graphics.Color; import android.graphics.Paint; import android.util.AttributeSet; import androidx.annotation.Nullable; public class ClockView extends android.view.View { private Paint mPaint; public ClockView(Context context) { this(context, null, 0); } public ClockView(Context context, @Nullable AttributeSet attrs) { this(context, attrs, 0); } public ClockView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) { super(context, attrs, defStyleAttr); init(); } private void init() { mPaint = new Paint(Paint.ANTI_ALIAS_FLAG); mPaint.setStyle(Paint.Style.STROKE); mPaint.setStrokeWidth(6); mPaint.setColor(Color.RED); } @Override protected void onDraw(Canvas canvas) { super.onDraw(canvas); int measuredWidth = getMeasuredWidth(); int x = measuredWidth, y = measuredWidth; int cx = x / 2; int radius = x / 2; int cy = radius; // Draw background circle canvas.drawCircle(cx, cy, radius, mPaint); } }
2. 画类似仪表盘效果的刻度
package com.yongdaimi.android.androidapitest.view; import android.content.Context; import android.graphics.Canvas; import android.graphics.Color; import android.graphics.Paint; import android.util.AttributeSet; import androidx.annotation.Nullable; public class ClockView extends android.view.View { private Paint mPaint; public ClockView(Context context) { this(context, null, 0); } public ClockView(Context context, @Nullable AttributeSet attrs) { this(context, attrs, 0); } public ClockView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) { super(context, attrs, defStyleAttr); init(); } private void init() { mPaint = new Paint(Paint.ANTI_ALIAS_FLAG); mPaint.setStyle(Paint.Style.STROKE); mPaint.setStrokeWidth(6); mPaint.setColor(Color.RED); } @Override protected void onDraw(Canvas canvas) { super.onDraw(canvas); int measuredWidth = getMeasuredWidth(); int x = measuredWidth, y = measuredWidth; int cx = x / 2; int radius = x / 2; int cy = radius; // Draw background circle canvas.drawCircle(cx, cy, radius, mPaint); // Draw scale mPaint.setColor(Color.BLUE); canvas.drawLine(x / 2, y / 8, x / 2, 0, mPaint); canvas.save(); for (int i = 0; i < 3; i++) { canvas.rotate(30, x / 2, y / 2); // 注意这里的后两个参数:代表以哪个位置为中心开始旋转,默认是以(0,0)位置为中心开始旋转,这里是以该圆的圆心为中心点开始旋转。 canvas.drawLine(x / 2, y / 8, x / 2, 0, mPaint); } } }
此时,画布已经顺时针旋转了3个30度,即90度。并且,在旋转画布之前已经调用了canvas.save()方法,所以此时保存的canvas的状态是未旋转时的正常状态。
3. 继续画一条直线,观察效果
package com.yongdaimi.android.androidapitest.view; import android.content.Context; import android.graphics.Canvas; import android.graphics.Color; import android.graphics.Paint; import android.util.AttributeSet; import androidx.annotation.Nullable; public class ClockView extends android.view.View { private Paint mPaint; public ClockView(Context context) { this(context, null, 0); } public ClockView(Context context, @Nullable AttributeSet attrs) { this(context, attrs, 0); } public ClockView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) { super(context, attrs, defStyleAttr); init(); } private void init() { mPaint = new Paint(Paint.ANTI_ALIAS_FLAG); mPaint.setStyle(Paint.Style.STROKE); mPaint.setStrokeWidth(6); mPaint.setColor(Color.RED); } @Override protected void onDraw(Canvas canvas) { super.onDraw(canvas); int measuredWidth = getMeasuredWidth(); int x = measuredWidth, y = measuredWidth; int cx = x / 2; int radius = x / 2; int cy = radius; // Draw background circle canvas.drawCircle(cx, cy, radius, mPaint); // Draw scale mPaint.setColor(Color.BLUE); canvas.drawLine(x / 2, y / 8, x / 2, 0, mPaint); canvas.save(); for (int i = 0; i < 3; i++) { canvas.rotate(30, x / 2, y / 2); canvas.drawLine(x / 2, y / 8, x / 2, 0, mPaint); } mPaint.setColor(Color.YELLOW); mPaint.setStrokeWidth(10); canvas.drawLine(x / 2, y / 2, x / 2, y / 4, mPaint); } }
上面对画笔进行加粗,并且把画笔的颜色变成了黄色,注意到当前线条的方向和最后一条仪表盘刻度的方向是一致的(都旋转了90度)。下面在绘制黄线的code之前,调用 canvas.restore() 恢复画布的状态:
package com.yongdaimi.android.androidapitest.view; import android.content.Context; import android.graphics.Canvas; import android.graphics.Color; import android.graphics.Paint; import android.util.AttributeSet; import androidx.annotation.Nullable; public class ClockView extends android.view.View { private Paint mPaint; public ClockView(Context context) { this(context, null, 0); } public ClockView(Context context, @Nullable AttributeSet attrs) { this(context, attrs, 0); } public ClockView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) { super(context, attrs, defStyleAttr); init(); } private void init() { mPaint = new Paint(Paint.ANTI_ALIAS_FLAG); mPaint.setStyle(Paint.Style.STROKE); mPaint.setStrokeWidth(6); mPaint.setColor(Color.RED); } @Override protected void onDraw(Canvas canvas) { super.onDraw(canvas); int measuredWidth = getMeasuredWidth(); int x = measuredWidth, y = measuredWidth; int cx = x / 2; int radius = x / 2; int cy = radius; // Draw background circle canvas.drawCircle(cx, cy, radius, mPaint); // Draw scale mPaint.setColor(Color.BLUE); canvas.drawLine(x / 2, y / 8, x / 2, 0, mPaint); canvas.save(); for (int i = 0; i < 3; i++) { canvas.rotate(30, x / 2, y / 2); canvas.drawLine(x / 2, y / 8, x / 2, 0, mPaint); } canvas.restore(); mPaint.setColor(Color.YELLOW); mPaint.setStrokeWidth(10); canvas.drawLine(x / 2, y / 2, x / 2, y / 4, mPaint); } }
运行:
注意到黄线又恢复了正常显示。当然,不使用canvas.restore(),而是继续旋转-90度画布,也是可以恢复画布到初始状态的。 canvas.rotate(-90, x /2, y /2);
如果您觉得阅读本文对您有帮助,请点一下“推荐”按钮,您的“推荐”将是我最大的写作动力!欢迎各位转载,但是未经作者本人同意,转载文章之后必须在文章页面明显位置给出作者和原文连接,否则保留追究法律责任的权利。
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· Linux系列:如何用 C#调用 C方法造成内存泄露
· AI与.NET技术实操系列(二):开始使用ML.NET
· 记一次.NET内存居高不下排查解决与启示
· 探究高空视频全景AR技术的实现原理
· 理解Rust引用及其生命周期标识(上)
· 物流快递公司核心技术能力-地址解析分单基础技术分享
· 单线程的Redis速度为什么快?
· 展开说说关于C#中ORM框架的用法!
· Pantheons:用 TypeScript 打造主流大模型对话的一站式集成库
· SQL Server 2025 AI相关能力初探