美文网首页iOS&Xcode奇技淫巧iOSios开发
IOS开发之自定义CALayer方式实现绘图

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

作者: 大玲_ | 来源:发表于2015-05-17 18:37 被阅读4200次

    重点:
    以自定义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方法

    相关文章

      网友评论

        本文标题:IOS开发之自定义CALayer方式实现绘图

        本文链接:https://www.haomeiwen.com/subject/ixzkqttx.html