首页 > 代码库 > Canvas的save和restore简单程序说明

Canvas的save和restore简单程序说明

关于save和restore网上不少说明,在这里简单的用程序证实了一下。

技术分享

                         图1

     上图为绘制的最终图画,绘制这种view有多中方式。

a) 简单的方式:不对canvas进行任何平移或者旋转的操作,对canvas直接绘制。代码如下

@Override
		protected void onDraw(Canvas canvas) {
			int width = 900;
			int height = 900;

			Paint paint = new Paint();
			//上半部分红色举行
			paint.setColor(Color.RED);
			canvas.drawRect(0, 0, width, height / 2, paint);
			//下半部分绿色部分
			paint.setColor(Color.GREEN);
			canvas.drawRect(0, height / 2, width, height, paint);

            //右下角画个黑色的圆
			paint.setColor(Color.BLACK);
			canvas.drawCircle(width - 50, height - 50, 50, paint);
		}

b)  第二种方式

     1.先绘制红色和绿色矩形

      2.画布canvas旋转90度

     3.绘制黑色的圆(注意此种方式没有调用save和restore方法),运行的效果图肯定不是图1的效果。如下

	protected void onDraw(Canvas canvas) {
			int width = 900;
			int height = 900;

			Paint paint = new Paint();
			//上半部分红色举行
			paint.setColor(Color.RED);
			canvas.drawRect(0, 0, width, height / 2, paint);
			//下半部分绿色部分
			paint.setColor(Color.GREEN);
			canvas.drawRect(0, height / 2, width, height, paint);

			//以canvas为圆心进行旋转,旋转90度
			canvas.rotate(90,width/2,height/2);
            //右下角画个黑色的圆
			paint.setColor(Color.BLACK);
			canvas.drawCircle(width - 50, height - 50, 50, paint);
		}

技术分享

             图2

我的理解:

  其实注意旋转(包括平移的情况下)不是画布,而是(0,0)坐标轴的改变,在旋转之前(0,0)坐标轴左上角,而旋转90度之后就是右上角为(0,0)点,所以以右上角为(0,0)点做参照的画,canvas.drawCircle(width - 50, height - 50, 50, paint);

计算出的位置就是左下角了。

这就说明如果想让黑色的圆绘制在右下角,那么就得以左上角为(0,0)参照点来进行计算绘制。当然    canvas.rotate(-90,width/2,height/2);在原来的基础在旋转-90度就可以了实现图1的效果了,但是还没有说明save的作用。

下面说明save和restore用在这里的步骤

1)在画布旋转之前调用save();(0,0)为左上角

2)然后旋转90度 (0,0)坐标为右上角

3)restore()恢复到未旋转之前的状态.也就是(0,0)坐标恢复为左上角

4)绘制圆

此时就会绘制如图1的效果,如果不调用restore的回复save之前的状态,那么就会在旋转之后的canvas上(也就是以右上角为0,0左边来进行计算绘制。也就是图2的效果了

@Override
		protected void onDraw(Canvas canvas) {
			int width = 900;
			int height = 900;

			Paint paint = new Paint();
			//上半部分红色举行
			paint.setColor(Color.RED);
			canvas.drawRect(0, 0, width, height / 2, paint);
			//下半部分绿色部分
			paint.setColor(Color.GREEN);
			canvas.drawRect(0, height / 2, width, height, paint);

			
			canvas.save();//保存旋转之前的状态
			//以canvas为圆心进行旋转,旋转90度
			canvas.rotate(90,width/2,height/2);
            
			//回复旋转之前的画布状态
			canvas.restore();
			//右下角画个黑色的圆
			paint.setColor(Color.BLACK);
			canvas.drawCircle(width - 50, height - 50, 50, paint);
		}

总结:

 

 


Canvas的save和restore简单程序说明