Quartz2D 绘图

画线

- (void)drawRect:(CGRect)rect {
    // Drawing code
    UIBezierPath *path = [UIBezierPath bezierPath];
    [path moveToPoint:CGPointMake(100, 100)];
    [path addLineToPoint:CGPointMake(100, 130)];
    [path stroke];
}

连接处样式

/* Line join styles. */

typedef CF_ENUM(int32_t, CGLineJoin) {
    kCGLineJoinMiter,
    kCGLineJoinRound,
    kCGLineJoinBevel
};

顶角样式

/* Line cap styles. */

typedef CF_ENUM(int32_t, CGLineCap) {
    kCGLineCapButt,
    kCGLineCapRound,
    kCGLineCapSquare
};

画扇型

// Only override drawRect: if you perform custom drawing.
// An empty implementation adversely affects performance during animation.
- (void)drawRect:(CGRect)rect {
    // Drawing code
    
    // 圆角矩形
//   UIBezierPath *path = [UIBezierPath bezierPathWithRoundedRect:CGRectMake(20, 20, 200, 200) cornerRadius:100];
    
    
    // 圆弧
    // Center：圆心
    // startAngle:弧度
    // clockwise:YES:顺时针 NO：逆时针
    
    // 扇形
    CGPoint center = CGPointMake(125, 125);
    UIBezierPath *path = [UIBezierPath bezierPathWithArcCenter:center radius:100 startAngle:0 endAngle:M_PI_2 clockwise:YES];
    
    // 添加一根线到圆心
    [path addLineToPoint:center];
    
    // 封闭路径，关闭路径：从路径的终点到起点
//    [path closePath];
    
    
//    [path stroke];
    
    // 填充：必须是一个完整的封闭路径,默认就会自动关闭路径
    [path fill];

}

重绘

// 重绘，系统会先创建与view相关联的上下文，然后再调用drawRect
    [self setNeedsDisplay];

下载的进度条制作

// 注意：drawRect不能手动调用，因为图形上下文我们自己创建不了，只能由系统帮我们创建，并且传递给我们
- (void)drawRect:(CGRect)rect {
    // Drawing code
    
    // 创建贝瑟尔路径
    CGFloat radius = rect.size.width * 0.5;
    CGPoint center = CGPointMake(radius, radius);
    CGFloat endA = -M_PI_2 + _progress * M_PI * 2;
    
    UIBezierPath *path = [UIBezierPath bezierPathWithArcCenter:center radius:radius - 2 startAngle:-M_PI_2 endAngle:endA clockwise:YES];
    
    [path stroke];
    
}

画饼图

- (void)drawRect:(CGRect)rect 
{
    CGFloat radius = self.bounds.size.width * 0.5;
    CGPoint center = CGPointMake(radius, radius);
    
    
    CGFloat startA = 0;
    CGFloat angle = 0;
    CGFloat endA = 0;

    
    // 第一个扇形
    angle = 25 / 100.0 * M_PI * 2;
    endA = startA + angle;
    UIBezierPath *path = [UIBezierPath bezierPathWithArcCenter:center radius:radius startAngle:startA endAngle:endA clockwise:YES];
    
    // 添加一根线到圆心
    [path addLineToPoint:center];
    
    // 描边和填充通用
    [[UIColor redColor] set];
    
    [path fill];
    
    // 第二个扇形
    startA = endA;
    angle = 25 / 100.0 * M_PI * 2;
    endA = startA + angle;
    UIBezierPath *path1 = [UIBezierPath bezierPathWithArcCenter:center radius:radius startAngle:startA endAngle:endA clockwise:YES];
    
    // 添加一根线到圆心
    [path1 addLineToPoint:center];
    
    // 描边和填充通用
    [[UIColor greenColor] set];
    
    [path1 fill];
    
    // 第二个扇形
    startA = endA;
    angle = 50 / 100.0 * M_PI * 2;
    endA = startA + angle;
    UIBezierPath *path2 = [UIBezierPath bezierPathWithArcCenter:center radius:radius startAngle:startA endAngle:endA clockwise:YES];
    
    // 添加一根线到圆心
    [path2 addLineToPoint:center];
    
    // 描边和填充通用
    [[UIColor blueColor] set];
    
    [path2 fill];

}

绘制文字

- (void)drawRect:(CGRect)rect {
    // 绘制文字
    
    NSString *str = @"asfdsfsdfasfdsfsdfasfdsfsdfasfdsfsdfasfdsfsdfasfdsfsdfasfdsfsdfasfdsfsdfasfdsfsdfasfdsfsdfasfdsfsdfasfdsfsdfasfdsfsdf";
    // 不会换行
    //[str drawAtPoint:CGPointZero withAttributes:nil];
    
    [str drawInRect:self.bounds withAttributes:nil];

}

绘制图片

- (void)drawRect:(CGRect)rect {
    // Drawing code
    
    static CGFloat _snowY = 0;

    // 超出裁剪区域的内容全部裁剪掉
    // 注意：裁剪必须放在绘制之前
    UIRectClip(CGRectMake(0, 0, 50, 50));
    
    UIImage *image = [UIImage imageNamed:@"001"];
    
    // 默认绘制的内容尺寸跟图片尺寸一样大
//    [image drawAtPoint:CGPointZero];
    
//    [image drawInRect:rect];
    // 绘图平铺
    [image drawAsPatternInRect:rect];
    
}

绘制雪花

// Only override drawRect: if you perform custom drawing.
// An empty implementation adversely affects performance during animation.
- (void)drawRect:(CGRect)rect {
    
    // 如果以后想绘制东西到view上面，必须在drawRect方法里面，不管有没有手动获取到上下文
    // 修改雪花y值
    UIImage *image =  [UIImage imageNamed:@"雪花"];
    
    [image drawAtPoint:CGPointMake(50, _snowY)];
    
    _snowY += 10;
    
    if (_snowY > rect.size.height) {
        _snowY = 0;
    }

}

// 如果在绘图的时候需要用到定时器，通常CADisplayLink
// NSTimer很少用于绘图，因为调度优先级比较低，并不会准时调用
- (void)awakeFromNib
{
    // 创建定时器
//    [NSTimer scheduledTimerWithTimeInterval:0.1 target:self selector:@selector(timeChange) userInfo:nil repeats:YES];
    CADisplayLink *link = [CADisplayLink displayLinkWithTarget:self selector:@selector(timeChange)];
    
    // 添加主运行循环
    [link addToRunLoop:[NSRunLoop mainRunLoop] forMode:NSDefaultRunLoopMode];
}

// CADisplayLink:每次屏幕刷新的时候就会调用，屏幕一般一秒刷新60次
// 1秒 2次
- (void)timeChange
{
    // 注意：这个方法并不会马上调用drawRect,其实这个方法只是给当前控件添加刷新的标记，等下一次屏幕刷新的时候才会调用drawRect
    [self setNeedsDisplay];
    
}

图形上下文栈

// 如果以后用贝瑟尔绘制图形【path stroke】,上下文的状态由贝瑟尔路径状态
// Only override drawRect: if you perform custom drawing.
// An empty implementation adversely affects performance during animation.
- (void)drawRect:(CGRect)rect {
    // Drawing code
    
    // 1.获取上下文
    CGContextRef ctx = UIGraphicsGetCurrentContext();
    
#pragma mark - 第一根
   // 2.描述路径
    // 第一根
    UIBezierPath *path = [UIBezierPath bezierPath];
    
    [path moveToPoint:CGPointMake(10, 125)];
    
    [path addLineToPoint:CGPointMake(240, 125)];
    
    // 把路径添加到上下文
    // .CGPath 可以UIkit的路径转换成CoreGraphics路径
    CGContextAddPath(ctx, path.CGPath);
    
    // 设置上下文状态
    CGContextSetLineWidth(ctx, 10);
    
    [[UIColor redColor] set];
    
#pragma ---------- 
    
    // 保存一份上下文的状态
    CGContextSaveGState(ctx);
    
#pragma ---------
    
    // 设置上下文状态
    CGContextSetLineWidth(ctx, 5);
    
    [[UIColor yellowColor] set];
    
    // 渲染上下文
    CGContextStrokePath(ctx);
    
    
    
#pragma mark - 第二根
    // 2.描述路径
    // 第二根
    path = [UIBezierPath bezierPath];
    
    [path moveToPoint:CGPointMake(125, 10)];
    
    [path addLineToPoint:CGPointMake(125, 240)];
    
    // 把路径添加到上下文
    // .CGPath 可以UIkit的路径转换成CoreGraphics路径
    CGContextAddPath(ctx, path.CGPath);
    
    // 还原上一次保存的上下文状态
    CGContextRestoreGState(ctx);
    
    // 渲染上下文
    CGContextStrokePath(ctx);
    
}

平移旋转等矩阵操作

// Only override drawRect: if you perform custom drawing.
// An empty implementation adversely affects performance during animation.
- (void)drawRect:(CGRect)rect {
    
    // 1.获取上下文
    CGContextRef ctx = UIGraphicsGetCurrentContext();
    
    // 2.描述路径
   UIBezierPath *path = [UIBezierPath bezierPathWithOvalInRect:CGRectMake(-100, -50, 200, 100)];
    
    [[UIColor redColor] set];
    
    // 上下文矩阵操作
    // 注意:矩阵操作必须要在添加路径之前
    
    //  平移
    CGContextTranslateCTM(ctx, 100, 50);
    
    // 缩放
    CGContextScaleCTM(ctx, 0.5, 0.5);
    
    // 旋转
    CGContextRotateCTM(ctx, M_PI_4);
    
    
    
    // 3.把路径添加上下文
    CGContextAddPath(ctx, path.CGPath);
    
    #pragma 此后的平移缩放旋转操作无效 但是颜色设置有效
    //  平移
    CGContextTranslateCTM(ctx, 300, 200);
    
    // 缩放
    CGContextScaleCTM(ctx, 2, 2);
    
    // 旋转
    CGContextRotateCTM(ctx, M_PI);
    
    
    [[UIColor blueColor] set];
    
    
    // 4.渲染上下文
    CGContextFillPath(ctx);
    
}