IOS开发之自定义CALayer方式实现绘图

重点：
以自定义CALayer的方式实现绘图
利用坐标系缩放比例翻转图像

步骤：创建空应用、创建Controller、创见视图、创建自定义CALayer

1. 在MainViewController中引入自定义视图，并实例化视图 ，添加到MainViewController。

- (void)viewDidLoad {
    [super viewDidLoad];
    MyView *myView = [[MyView alloc]initWithFrame:CGRectMake(0, 0, 200, 200)];
    [myView setBackgroundColor:[UIColor lightGrayColor]];
    [self.view addSubview:myView];
}

2.在MyView自定义视图中，实例化CALayer ， 设置颜色、位置、大小

- (instancetype)initWithFrame:(CGRect)frame
{
    self = [super initWithFrame:frame];
    if (self) {
        NSLog(@"initView");
        MyLayer *myLayer = [MyLayer layer];
        [myLayer setBounds:self.bounds];
        [myLayer setPosition:CGPointMake(100, 100)];
        [myLayer setBackgroundColor:[UIColor redColor].CGColor];
        [self.layer addSublayer:myLayer];
        self.myLayer = myLayer;
        [self.myLayer setNeedsDisplay];
    }
    return self;
}

注意：一定要调用[self.myLayer setNeedsDisplay];否则无法绘图。

3.在CALayer中绘制。

- (void)drawInContext:(CGContextRef)ctx
{
    //来绘制图层
    //提示：在形变坐标系前，记得保存坐标系，使用后再恢复坐标系。
    CGContextSaveGState(ctx);
    //绘制头像
    //1> 可以利用 在绘图的时候，可以利用上下文的形变。
    //2> 可以利用 形变属性的缩放实现图片的反转（1，-1）
    //3> 可以利用平移恢复位置（向下平移坐标系）
    
    //a.翻转
    CGContextScaleCTM(ctx, 1.0, -2.0);
    //b.平移
    CGContextTranslateCTM(ctx, 0, -self.bounds.size.height);
    
    UIImage *image = [UIImage imageNamed:@"image.jpg"];
    CGContextDrawImage(ctx, CGRectMake(50, 50, 100, 100), image.CGImage);
    CGContextRestoreGState(ctx);
    //画青色的园
    CGContextAddEllipseInRect(ctx, CGRectMake(0, 0, 100, 100));
    CGContextSetRGBFillColor(ctx, 0.0, 1.0, 1.0, 1.0);
    CGContextDrawPath(ctx, kCGPathFill);
    NSLog(@"draw In context");
    //画蓝色的园
    CGContextAddEllipseInRect(ctx, CGRectMake(100, 100, 100, 100));
    CGContextSetRGBFillColor(ctx, 1.0, 0.0, 1.0, 1.0);
    CGContextDrawPath(ctx, kCGPathFill);
}

最后效果：

85E2FDC8-6A39-49CD-ADDD-A718F008056B.png

图像默认是倒过来的。所以要旋转，平移之后将图片摆正。

注意：

1.如果使用自定义图层绘图时，uiview本身的DrawRect方法内的绘图结果将被layer的绘图结果覆盖。
2.如果使用CALayer绘图，就不要再写drawRect方法