iOS_Quartz2D_仿射变化和图形上下文栈

展示效果:


iOS_Quartz2D_仿射变化和图形上下文栈_第1张图片
效果图



iOS_Quartz2D_仿射变化和图形上下文栈_第2张图片
效果图


iOS_Quartz2D_仿射变化和图形上下文栈_第3张图片
效果图

请问:实现的步骤是什么?

第一步,首先绘制一个线条,一个椭圆,和一个矩形框,然后添加到路径中,进行渲染.

第二步,进行仿射变化.特别注意:仿射变化应该在拿到上下文之后立即编写代码,然后再进行绘制操作.不然就没有效果了.

第三步,需求:最后再绘制一个圆,这个圆的宽度是默认的,颜色也是默认的,并且不要做任何形变操作.因此我们需要在最开始对图形上下文的状态进行备份.将状态先备份到“图形上下文栈”中,然后再进行下一个路径绘制时,先取出保存在图形上下文栈的状态.最后来绘制.

//代码实现

------------------------------ HMRootView.m------------------------------

- (void)drawRect:(CGRect)rect {

// 1.获取图形上下文

CGContextRefctx =UIGraphicsGetCurrentContext();

//在对图形上下文的状态进行任何操作之前,先备份一份到"图形上下文栈"中

CGContextSaveGState(ctx);

/*****拿到上下文后立刻做仿射变换,然后再开始绘图操作*****/

//缩放

CGContextScaleCTM(ctx,0.5,0.5);

//旋转

CGContextRotateCTM(ctx,M_PI_4*0.5);

//平移

CGContextTranslateCTM(ctx,150,100);

// 2.创建路径对象

// 2.1画线

UIBezierPath*pathLine = [UIBezierPathbezierPath];

[pathLinemoveToPoint:CGPointMake(50,50)];

[pathLineaddLineToPoint:CGPointMake(250,150)];

// 2.2画椭圆

UIBezierPath*pathOval = [UIBezierPathbezierPathWithOvalInRect:CGRectMake(30,200,250,80)];

// 2.3绘制一个矩形

UIBezierPath*pathRect = [UIBezierPathbezierPathWithRect:CGRectMake(150,50,50,200)];

//把路径添加到上下文中

CGContextAddPath(ctx, pathLine.CGPath);

CGContextAddPath(ctx, pathOval.CGPath);

CGContextAddPath(ctx, pathRect.CGPath);

//设置颜色

[[UIColorredColor]set];

//设置线宽

CGContextSetLineWidth(ctx,20);

//设置线头样式

CGContextSetLineCap(ctx,kCGLineCapRound);

// 3.渲染

CGContextDrawPath(ctx,kCGPathStroke);

/*****需求:最后再绘制一个圆,这个圆的线宽是默认的,颜色也是默认的,并且不要做任何形变操作*****/

//从上下文栈中获取上次保存的状态

CGContextRestoreGState(ctx);

UIBezierPath*pathCircle = [UIBezierPathbezierPathWithOvalInRect:CGRectMake(80,100,200,200)];

CGContextAddPath(ctx, pathCircle.CGPath);

CGContextDrawPath(ctx,kCGPathStroke);

}

你可能感兴趣的:(iOS_Quartz2D_仿射变化和图形上下文栈)