Quartz2D-白红宇

Quartz2D

阅读量：5947 次

发布时间：2019-06-19

本文共 3952 字，大约阅读时间需要 13 分钟。

1 Quartz2D简介

Quartz2D写的同一份代码，既可以运行在iphone上又可以运行在mac上，可以跨平台开发。开发中比较常用的是截屏/裁剪/自定义UI控件。

1.drwaRect方法的使用

- (void)drawRect:(CGRect)rect.

1>.方法当视图第一次显示的时候就会调用，再viewWillAppear后调用

2>.默认只会调用一次。当使用[self setNeedDisplay]就可以重绘。但不会立即绘制，只会再一次显示刷新绘制

2. 使用步骤

1.自定义view，并且复写drawRect：

2.取得跟当前view想关联的图形

3. 绘制好图形，绘制时的线条叫路径。路径由一个或多条直线或曲线组成

4.图形上下文的内容显示到view上

2 基本图形绘制

1.线条绘制

- (void)drawRect:(CGRect)rect{    // 1.获取上下文CGContextRef    // 目前学的上下文都跟UIGraphics有关，以后想直接获取上下文，直接敲一个UIGraphics    CGContextRef ctx = UIGraphicsGetCurrentContext(); //current默认是view        // 2.设置绘图信息(拼接路径)    UIBezierPath *path = [UIBezierPath bezierPath];    // 设置起点    [path moveToPoint:CGPointMake(10, 10)];    // 添加一条线到某个点    [path addLineToPoint:CGPointMake(125, 125)];    [path addLineToPoint:CGPointMake(240, 10)];  //以上个点为起点        // 3.把路径添加到上下文    // 直接把UIKit的路径转换成CoreGraphics    CGContextAddPath(ctx, path.CGPath);        // 设置绘图状态    CGContextSetLineWidth(ctx, 10);                    //设置线宽    CGContextSetLineCap(ctx, kCGLineCapRound);         //设置线条端点的形状    //CGContextSetRGBStrokeColor(ctx, 1, 0, 0, 1);     //设置线条的颜色    [[UIColor redColor] set];        // 4.把上下文渲染到视图    // Stroke描边    CGContextStrokePath(ctx);    }

2.曲线绘制

- (void)drawRect:(CGRect)rect{    // 1.获取上下文    CGContextRef ctx = UIGraphicsGetCurrentContext();        // 2.拼接路径    UIBezierPath *path = [UIBezierPath bezierPath];        CGPoint startP = CGPointMake(10, 125);    //起点    CGPoint endP = CGPointMake(240, 125);     //终点    CGPoint controlP = CGPointMake(125, 0);   //顶点    [path moveToPoint:startP];    [path addQuadCurveToPoint:endP controlPoint:controlP];        // 3.把路径添加到上下文    CGContextAddPath(ctx, path.CGPath);        // 4.渲染上下文到视图    CGContextStrokePath(ctx);    }

3.封闭图形

    三角形        // 1.获取上下文    CGContextRef ctx = UIGraphicsGetCurrentContext();        // 2.拼接路径    UIBezierPath *path = [UIBezierPath bezierPath];        CGPoint startP = CGPointMake(10, 10);        [path moveToPoint:startP];        [path addLineToPoint:CGPointMake(125, 125)];        [path addLineToPoint:CGPointMake(240, 10)];        // 从路径的终点连接到起点    [path closePath];    //[path addLineToPoint:startP];        // 3.把路径添加到上下文    CGContextAddPath(ctx, path.CGPath);        [[UIColor blueColor] setFill];        //填充颜色    [[UIColor redColor] setStroke];       //线条颜色，需要设置线宽              CGContextSetLineWidth(ctx, 15);        // 4.渲染上下文    //    CGContextStrokePath(ctx);    //    CGContextFillPath(ctx);    // 即填充又描边 kCGPathFillStroke    CGContextDrawPath(ctx, kCGPathFillStroke);

4.矩形/圆矩形

cornerRadius的大小是长宽的一半，那么就是圆形

    // 1.获取上下文    CGContextRef ctx = UIGraphicsGetCurrentContext();        // 2.拼接路径  cornerRadius    UIBezierPath *path = [UIBezierPath bezierPathWithRect:CGRectMake(10, 10, 200, 200)];    path = [UIBezierPath bezierPathWithRoundedRect:CGRectMake(10, 10, 200, 200) cornerRadius:20];        // 3.把路径添加到上下文    CGContextAddPath(ctx, path.CGPath);        // 4.渲染上下文    CGContextStrokePath(ctx);

5.圆形

    // 1.获取上下文    CGContextRef ctx = UIGraphicsGetCurrentContext();        // 2.拼接路径    UIBezierPath *path = [UIBezierPath bezierPathWithOvalInRect:CGRectMake(10, 10, 200, 100)];        // 3.把路径添加到上下文    CGContextAddPath(ctx, path.CGPath);        // 4.渲染上下文    CGContextStrokePath(ctx);

6.圆弧

    // 1.获取上下文    CGContextRef ctx = UIGraphicsGetCurrentContext();        // 2.拼接路径    CGPoint center = CGPointMake(125, 125);   //圆心    CGFloat radius = 100;                     //半径    CGFloat startA = 0;                       //起点。0℃为右正方（北偏东45°）     CGFloat endA = M_PI_2;                    //终点，45℃    //clockwise为YES代表是顺时针    UIBezierPath *path = [UIBezierPath bezierPathWithArcCenter:center radius:radius startAngle:startA endAngle:endA clockwise:YES];        [path addLineToPoint:center]; //添加一条线到圆心，就可绘制四分之一圆    // 3.把路径添加到上下文    CGContextAddPath(ctx, path.CGPath);        // 4.渲染上下文    CGContextStrokePath(ctx);   绘制圆弧    //CGContextFillPath(ctx);   绘制圆形