UIBezierPath 基础（一）

首先了解贝塞尔曲线的初始化方法都有那些，可以根据不同的需求来初始化；其次设置贝塞尔曲线的绘制路线；最后把贝塞尔曲线设置为layer的path，把layer添加到相应的view就能显示出你要绘制的贝塞尔曲线。
也可以直接在继承于UIView的子类中重写drawRect方法来绘制图形，此处是绘制到layer，之后再添加到view上。
一、贝塞尔曲线初始化方法

/// 1.初始化贝塞尔曲线 -- 无形状
bezierPath = [UIBezierPath bezierPath];

/// 2.绘制矩形的贝塞尔曲线 -- Rect为矩形的frame
bezierPath = [UIBezierPath bezierPathWithRect:CGRectMake(100, 10, 50, 50)];

/// 3.绘制圆形（椭圆）曲线  w = h 就是圆
bezierPath = [UIBezierPath bezierPathWithOvalInRect:CGRectMake(100, 80, 80, 50)];

/// 4.绘制圆角的贝塞尔曲线 -- 四个角都是圆角 cornerRadius -- 圆角半径
bezierPath = [UIBezierPath bezierPathWithRoundedRect:CGRectMake(100, 160, 50, 50) cornerRadius:5];

/// 5.绘制可选择圆角方位的矩形贝塞尔曲线
/// roundCorner - 哪个部位圆角（注意：在OC中是位枚举，在swift中是数组）
/// cornerRadii - 圆角的CGSize
bezierPath = [UIBezierPath bezierPathWithRoundedRect:CGRectMake(100, 240, 50, 50) byRoundingCorners:UIRectCornerBottomLeft | UIRectCornerBottomRight cornerRadii:CGSizeMake(5, 5)];

/// 6.根据CGPathRef 绘制线
CGMutablePathRef path = CGPathCreateMutable();
/// 起点
CGPathMoveToPoint(path, NULL, 100, 89);
/// 画直线到某一点 (需要结合起点MoveToPoint) 此方法确定了终点
CGPathAddLineToPoint(path, NULL, 200, 200);
/// 画圆弧 (需要结合起点MoveToPoint) 此方法确定终点
CGPathAddArcToPoint(path, NULL, 100, 100, 200, 200, 50);

/// 画圆
CGPathAddArc(path, NULL, 100, 100, 50, 0, M_PI * 2, YES);
/// 画矩形
CGPathAddRect(path, NULL, CGRectMake(300, 300, 100, 100));
bezierPath = [UIBezierPath bezierPathWithCGPath:path];
/// 不在ARC管理范围内，需要手动释放 (带有ref的一般都是C的方法，需要手动释放内存)
CGPathRelease(path);

/// 7.绘制圆弧曲线
/// ArcCenter -- 圆心坐标
/// startAngle--起始点角度
/// endAngle--终点角度
/// radius - 圆的半径
/// clockwise -- 是否顺时针
bezierPath = [UIBezierPath bezierPathWithArcCenter:CGPointMake(200, 320) radius:50 startAngle:0 endAngle:M_PI * 2 clockwise:NO];

二、绘制贝塞尔曲线

    /// 设置贝塞尔曲线 起点
    [bezierPath moveToPoint:CGPointMake(200, 320)];
    /// 添加直线到该点
    [bezierPath addLineToPoint:CGPointMake(300, 320)]; /// 水平直线
    [bezierPath addLineToPoint:CGPointMake(300, 200)]; /// 垂直竖线
    [bezierPath addLineToPoint:CGPointMake(200, 320)]; /// 回到起始点的斜线

    /// 绘制二次贝塞尔曲线 QuadCurveToPoint -- 终点  controlPoint -- 控制点
//    [bezierPath addQuadCurveToPoint:CGPointMake(100, 320) controlPoint:CGPointMake(150, 50)];
    /// 绘制三次贝塞尔曲线 -- 会从上一条beizerPath的终点作为起点开始绘制
    /// CurveToPoint -- 终点  controlPoint1 -- 第一个控制曲线的点 controlPoint2 -- 第二个控制曲线的点
    [bezierPath addCurveToPoint:CGPointMake(350, 320) controlPoint1:CGPointMake(50, 100) controlPoint2:CGPointMake(300, 150)];
    /// 添加圆弧（圆） radius -- 半径 startAngle -- 起始弧度 endAngle -- 终点弧度
    [bezierPath addArcWithCenter:CGPointMake(200, 400) radius:50 startAngle:0 endAngle:M_PI * 2 clockwise:YES];
    /// 端点类型
    bezierPath.lineCapStyle = kCGLineCapButt;
    /// 线条链接类型
    bezierPath.lineJoinStyle = kCGLineJoinMiter;
    // Used when lineJoinStyle is kCGLineJoinMiter -- 线条最大宽度限度
    bezierPath.miterLimit = 150;
    
//    CGFloat dash[] = {20, 1};
//    [bezierPath setLineDash:dash count:2 phase:0];
    bezierPath.lineWidth = 1;
    /// 填充贝塞尔曲线内部
//    [bezierPath fill];
    /// 设置填充颜色 --- drawRect中使用（此处无效）
    [[UIColor yellowColor] set];
    /// 移除所有曲线点
//    [bezierPath removeAllPoints];
    /// 闭合曲线
//    [bezierPath closePath];
    /// 绘制贝塞尔曲线边框
    [bezierPath stroke];

借用个图来展示控制点controlPoint的意思

贝塞尔曲线1.jpeg

贝塞尔曲线2.jpeg

三、将绘制曲线的路径添加到layer上

    /// 创建layer --- 注意：layer与贝塞尔曲线相同的属性同时设置，最终以layer的属性设置形式为准
    CAShapeLayer *shapeLayer = [CAShapeLayer layer];
    /// 设置layer的填充颜色  -- 会覆盖贝塞尔曲线设置的填充颜色,最终显示为无色
    shapeLayer.fillColor = [UIColor clearColor].CGColor;
    /// 设置曲线的绘制路线颜色
    shapeLayer.strokeColor = [UIColor redColor].CGColor;
    /// 将曲线的路径添加到layer上
    shapeLayer.path = bezierPath.CGPath;
    /// 将layer添加到view上
    [self.view.layer addSublayer:shapeLayer];

以上就是贝塞尔曲线的基本使用，希望对您有帮助。

UIBezierPath 基础（一）

你可能感兴趣的:(UIBezierPath 基础（一）)