UIBezierPath画曲线控制点的选取

来源：互联网发布：mp3剪切合并软件编辑：程序博客网时间：2024/05/14 23:35

这里写图片描述
如图，要画一条经过图中黄色点的平滑曲线，可以用UIBezierPath贝塞尔曲线来实现，UIBezierPath画曲线关键是控制点的选取。怎样实现图中曲线呢，给大家一个方法参考。

@implementation FingerPrintView- (instancetype)initWithFrame:(CGRect)frame {    if (self = [super initWithFrame:frame]) {        [self addFingerPrintLine];    }    return self;}- (void)addFingerPrintLine {    CGFloat centerX = CGRectGetWidth(self.frame)/2;    CGFloat centerY = CGRectGetHeight(self.frame)/2;    NSArray * xArray = [NSArray arrayWithObjects:@(0),@(centerX/2),@(centerX),@(1.5*centerX),@(1.8*centerX),@(centerX * 2), nil];    NSArray * yArray = [NSArray arrayWithObjects:@(centerY),@(centerY/2),@(centerY),@(1.5*centerY),@(0.5*centerY),@(centerY), nil];    for (int i = 0; i < xArray.count - 1; i ++) {        NSInteger nextIndex = i + 1 ;   // 标记下一个Index        CGFloat value_i = [xArray[i] floatValue];       // 当前点的值        CGFloat value_next_i = [xArray[nextIndex] floatValue];      // 下一个点的值        CGFloat point_i_Y = [yArray[i] floatValue];    // 当前点的 Y        CGFloat point_next_i_Y = [yArray[nextIndex] floatValue]; // 下一个点的 Y        // 控制点的横坐标都是一样的：取两点横坐标的平均值，纵坐标不同：控制点1的纵坐标是当前点的纵坐标，控制点2的纵坐标是下一个点的纵坐标。        CGPoint controlPoint1 = CGPointMake((value_i + value_next_i)/ 2 , point_i_Y);        CGPoint controlPoint2 = CGPointMake((value_i + value_next_i)/ 2, point_next_i_Y);        CAShapeLayer *mouthLayer = [CAShapeLayer layer];        UIBezierPath *mouthPath = [UIBezierPath bezierPath];        [mouthPath moveToPoint:CGPointMake(value_i, point_i_Y)];        [mouthPath addCurveToPoint:CGPointMake(value_next_i , point_next_i_Y) controlPoint1:controlPoint1 controlPoint2:controlPoint2];        mouthLayer.path = mouthPath.CGPath;        mouthLayer.lineWidth = 2;        mouthLayer.fillColor = [UIColor clearColor].CGColor;        mouthLayer.strokeColor = [UIColor redColor].CGColor;        [self.layer addSublayer:mouthLayer];        UIView * view = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 10, 10)];        view.center = CGPointMake(value_i, point_i_Y);        view.layer.cornerRadius = 5;        view.backgroundColor = [UIColor yellowColor];        [self addSubview:view];    } }

这样无论有多少个点，都可以用平滑的曲线连接起来了。
如果有其他更好的办法，欢迎交流。

阅读全文

0 0