浅析图形上下文栈

  • 效果图:
  • 主要代码
// DrawView.h
#import <UIKit/UIKit.h>

@interface DrawView : UIView

@end

// DrawView.m
#import "DrawView.h"

@implementation DrawView

/*
 默认会开启一个上下文,在这个上下文里面,有2个区域,一个是存放路径的区域,一个是存放
 上下文状态的区域,
 UIBezierPath *path = [UIBezierPath bezierPath];
 [path moveToPoint:CGPointMake(20, 150)];
 [path addLineToPoint:CGPointMake(280, 150)];
 这三行代码的作用是描述了一个路径,
 CGContextSaveGState(ctx);
 这一行代码的作用是保存当前的上下文的状态,一开始没有修改上下文的状态,所以保存的是系统
 默认的上下文的状态。做的操作是会把存放上下文状态的区域里面当前的上下文状态复制一份放到
 上下文栈里面进行保存
 [[UIColor redColor] set];
 CGContextSetLineWidth(ctx, 10);
 下面二行代码的作用:修改存放上下文状态的区域里面的当前上下文状态,不影响已经放到上下文
 栈里面的上下文状态
 CGContextAddPath(ctx, path.CGPath);
 这行代码的作用:把描述好的路径添加到上下文里面的路径区域中去
 CGContextStrokePath(ctx);
 这行代码的作用:把上下文里面的路径区域中的路径渲染到view中去
 这个时候,红色的水平线已经画好了。

 UIBezierPath *path2 = [UIBezierPath bezierPath];
 [path2 moveToPoint:CGPointMake(150, 20)];
 [path2 addLineToPoint:CGPointMake(150, 280)];
 这三行代码的作用是描述了一个路径,
 CGContextRestoreGState(ctx);
 这行代码的作用:从上下文状态栈当中恢复状态,即从上下文状态栈中取出栈顶的上下文状态,然后
 放到上下文里面的存放上下文状态的区域中去,作为当前的上下文状态
 CGContextAddPath(ctx, path2.CGPath);
 这行代码的作用:把描述好的路径添加到上下文里面的路径区域中去
 CGContextStrokePath(ctx);
 这行代码的作用:把上下文里面的路径区域中的路径渲染到view中去
 这个时候,黑色的垂直线已经画好了。
 */
- (void)drawRect:(CGRect)rect {

    //1.获取上下文
    CGContextRef ctx = UIGraphicsGetCurrentContext();
    //2.描述路径
    UIBezierPath *path = [UIBezierPath bezierPath];
    [path moveToPoint:CGPointMake(20, 150)];
    [path addLineToPoint:CGPointMake(280, 150)];

    // 保存上下文的状态,这个时候的上下文状态会复制一份放到上下文栈里面进行保存
    CGContextSaveGState(ctx);
    // 下面两行代码不影响已经放到上下文栈里面的上下文状态
    // 修改上下文的状态
    [[UIColor redColor] set];
    CGContextSetLineWidth(ctx, 10);

    //3.把路径 添加到上下文当中
    CGContextAddPath(ctx, path.CGPath);

    //4.把上下文内容渲染到View
    CGContextStrokePath(ctx);


    UIBezierPath *path2 = [UIBezierPath bezierPath];
    [path2 moveToPoint:CGPointMake(150, 20)];
    [path2 addLineToPoint:CGPointMake(150, 280)];


    // 从上下文状态栈当中恢复状态
    // 下面这行代码,相当于下面2行代码
    CGContextRestoreGState(ctx);
//    [[UIColor blackColor] set];
//    CGContextSetLineWidth(ctx, 1);

    //3.把路径 添加到上下文当中
    CGContextAddPath(ctx, path2.CGPath);

    //4.把上下文内容渲染到View
    CGContextStrokePath(ctx);
}


@end

  • 主要原理图:
图1

图2

推荐阅读更多精彩内容