基本线条的绘制

  • 关闭路径:自动的从路径的终点连接到 路径的起点
  • 如果没有关闭路径,使用fill会自动关闭路径

// DrawView.h

#import <UIKit/UIKit.h>

@interface DrawView : UIView

@end


// DrawView.m

#import "DrawView.h"

@implementation DrawView

// 作用: 绘图
// 什么时候调用:(系统自动调用)当View显示的时候调用
// 参数:当前View的bounds
// 在drawRect系统已经自动创建了一个跟当前View相关联的上下文

- (void)drawRect:(CGRect)rect {

//    //1.获取跟View相关联的上下文(UIGraphics开头)  ---- 画板
//    CGContextRef ctx =  UIGraphicsGetCurrentContext();
//    //2.描述路径
//    UIBezierPath *path = [UIBezierPath bezierPath]; //---- 画笔
//    //设置起点
//    [path moveToPoint:CGPointMake(50, 250)];
//    //添加一根曲线到某个点
//    [path addQuadCurveToPoint:CGPointMake(250, 250) controlPoint:CGPointMake(80, 100)];
//    //3.把路径添加到上下文
//    CGContextAddPath(ctx, path.CGPath);
//    //4.把上下文内容渲染到View上.
//    CGContextStrokePath(ctx);

    /*
//    // 拿到画笔
//    UIBezierPath *path = [UIBezierPath bezierPath];
//    // 设置起点
//    [path moveToPoint:CGPointMake(50, 150)];
//    // 添加一根线到某个点
//    [path addLineToPoint:CGPointMake(250, 50)];
//    // 给这支笔设置笔宽
//    [path setLineWidth:10];
//    // 设置笔的样式
//    [path setLineCapStyle:kCGLineCapRound];
//    // 设置画笔的颜色
//    [[UIColor redColor] set];
//    // 封笔结束
//    [path stroke];
     */
    
    // 画直线通过修改上下文
    [self drawLineOne];
    // 画直线通过修改画笔
//    [self drawLineTwo];
}

// 画直线通过修改上下文
- (void)drawLineOne {
    
    // 1.获取跟View相关联的上下文(uigraphics开头)
    CGContextRef ctx = UIGraphicsGetCurrentContext();
    // 2.描述路径
    // 一条路径可以绘制多条线
    UIBezierPath *path = [UIBezierPath bezierPath];
    
//    // 设置起点
//    [path moveToPoint:CGPointMake(50, 150)];
//    //添加一根线到某个点
//    [path addLineToPoint:CGPointMake(250, 50)];
//    
//    //画第二根线
//    //[path moveToPoint:CGPointMake(50, 250)];
//    //[path addLineToPoint:CGPointMake(250, 100)];
//    
//    // 把上一条路径的终点,当作是下一个路径的起点
//    [path addLineToPoint:CGPointMake(50, 250)];
    
    // 设置起点
    [path moveToPoint:CGPointMake(50, 250)];
    // 添加一根曲线到某个点
    //    [path addQuadCurveToPoint:CGPointMake(250, 250) controlPoint:CGPointMake(80, 100)];
    // 添加一根线到某个点
    [path addLineToPoint:CGPointMake(250, 250)];
    
    
    //设置上下文的状态
    CGContextSetLineWidth(ctx, 10);
    //设置线的连接样式
    /*
     kCGLineJoinMiter,
     kCGLineJoinRound,
     kCGLineJoinBevel
     */
//    CGContextSetLineJoin(ctx, kCGLineJoinRound);
    //设置线的顶角样式
    /*
     kCGLineCapButt,
     kCGLineCapRound,
     kCGLineCapSquare
     */
    CGContextSetLineCap(ctx, kCGLineCapRound);
    // 设置画笔的颜色
    [[UIColor redColor] set];
    
    //3.把路径添加到上下文
    //UIBezierPath->UIKit -->  CGPathRef->CoreGraphics
    CGContextAddPath(ctx, path.CGPath);
    //4.把上下文当中绘制的内容渲染到跟View关联的layer.(stroke ,fill)
    CGContextStrokePath(ctx);
}

// 画直线通过修改画笔
- (void)drawLineTwo {
    // 1.获取跟view相关联的上下文(UIGraphics开头) ---- 画板
    CGContextRef ctx = UIGraphicsGetCurrentContext();
    // 2.描述路径
    UIBezierPath *path = [UIBezierPath bezierPath]; // 画笔
    // 设置起点
    [path moveToPoint:CGPointMake(50, 250)];
    // 添加一根曲线到某个点
//    [path addQuadCurveToPoint:CGPointMake(250, 250) controlPoint:CGPointMake(80, 100)];
    // 添加一根线到某个点
    [path addLineToPoint:CGPointMake(250, 250)];
    // 给这支笔设置笔宽
    [path setLineWidth:10];
    // 设置笔的样式
    [path setLineCapStyle:kCGLineCapRound];
    // 设置画笔的颜色
    [[UIColor redColor] set];
    // 封笔结束
    [path stroke];
    // 3.把路径添加到上下文
    CGContextAddPath(ctx, path.CGPath);
    // 4.把上下文内容渲染到View上
    CGContextStrokePath(ctx);
}

@end

参考链接





最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容