最近涉及到画板，需求是这样

• 画直线
• 可以选中直线，选中后进入编辑状态（改变颜色，并且在两端绘制可选中标记）
• 当直线为可操作状态时，点击两端标记，可以改变端点位置
• 可以删除线段
• 可以上下左右移动编辑状态的直线
  下载

画直线

画直线

0001.gif

进入编辑状态，并且可以拖动直线两端

huaban003.gif

1.创建一个PathStyle类，里面保存了贝塞尔路劲的属性，但是我没有保存一个被贝塞尔对象，为什么后面再说

// 线段颜色
@property (nonatomic ,strong) UIColor *color;
// 线宽
@property (nonatomic ,assign) CGFloat width;
// 秒边 或者 充满
@property (nonatomic ,assign) PrintStyle printStyle;
// 画直线
@property (nonatomic ,assign) DrawStyle drawStyle;
// 画笔起点
@property (nonatomic, assign) CGPoint one;
// 画笔终点
@property (nonatomic, assign) CGPoint two;
// 时候隐藏图案
@property (nonatomic, assign) BOOL hiddenCir;

2..保存起点和终点

- (void)touchesMoved:(NSSet<UITouch*>*)touches withEvent:(UIEvent*)event
{
    CGPoint point = [touches.anyObject locationInView:self];
    
    // 当拖动大于8时，我们认为用户是想画线，显示小圆点
    // 绘制第二个点
    // 如果没有选中某个点，就把点复制给第二个点
    if (!_onDraw) {
        
        if (point.x - _currentPoint.x < -8 || point.x - _currentPoint.x > 8) {
            [self.delegate handLine];
            _currentPoint = [touches.anyObject locationInView:self];
            self.currentStyle.hiddenCir = NO;
            self.currentStyle.two = _currentPoint;
        }
    }
    else {// 如果选中某个点，就赋值给某个点
        _currentPoint = [touches.anyObject locationInView:self];
        self.currentStyle.one = _onOne ? _currentPoint : self.currentStyle.one;
        self.currentStyle.two = _onTwo ? _currentPoint : self.currentStyle.two;
    }
    [self setNeedsDisplay];
}

3.画线

- (UIBezierPath*)drawLine
{
    UIBezierPath* path = [UIBezierPath bezierPath];
    [path moveToPoint:self.currentStyle.one];
    [path addLineToPoint:self.currentStyle.two];
    [self.currentStyle.color setStroke];
    [path setLineWidth:self.currentStyle.width];
    return path;
}
//画线，并画出可编辑的圆圈
- (void)drawLinePath
{
    if (self.currentStyle != nil) {
        UIBezierPath* cir1 = [UIBezierPath bezierPathWithArcCenter:self.currentStyle.one
                                                            radius:5
                                                        startAngle:0
                                                          endAngle:2 * M_PI
                                                         clockwise:1];
        
        [cir1 stroke];
        UIBezierPath* cir2 = [UIBezierPath bezierPathWithArcCenter:self.currentStyle.two
                                                            radius:5
                                                        startAngle:0
                                                          endAngle:2 * M_PI
                                                         clockwise:1];
        [cir2 stroke];
        
        [[self drawLine] stroke];

    }
}

实现选中直线

长按直线一秒钟，直线进入编辑状态，可以移动，删除

画板002.gif

// 判断是否选中
- (BOOL)jugdeIncludeboundaryWithTouchPoint:(CGPoint)nowPoint{
    // 在非画线下才能选中
    if (!_ishandle) {
        // 遍历路劲
        for (PathStyle *style in self.pathArr) {
            
            CGPoint startCD = style.one;
            CGPoint endCD = style.two;
            // 斜率
            CGFloat k = ((CGFloat)endCD.y - startCD.y) / (endCD.x - startCD.x);
            CGFloat CK = 15;
            CGFloat sina = CK * sqrt(k*k / (k * k + 1));
            // 拿到长按的线与Y轴的交点
            CGFloat Startvalue = nowPoint.y - nowPoint.x * k;
            // 拿到过触摸点与长按的线平行的线与Y轴交点
            CGFloat EndValue = startCD.y - startCD.x * k;
            // 将Y轴交点的坐标差转换为平行线垂直方向距离
            CGFloat chang = (Startvalue - EndValue) * sqrt(1/(k*k +1));
            CGFloat bigInteger = endCD.x  >= startCD.x  ? endCD.x  : startCD.x;
            CGFloat lowInteger = endCD.x  <= startCD.x  ? endCD.x  : startCD.x;
            if (nowPoint.x >= lowInteger - sina && nowPoint.x <= bigInteger + sina) {
                
                // 点击点在范围内
                if (chang <= CK && chang >= -CK) {
                    // 保存编辑的style
                    if (self.currentStyle != nil) {
                        self.currentStyle.color = [UIColor blackColor];
                        [self.pathArr addObject:self.currentStyle];
                    }
                    NSLog(@"选中了");
                    self.selectIndex = 3;
                    self.currentStyle = style;
                    [self.pathArr removeObject:style];
                    // 弹出操作视图
                    [self.delegate handLine];
                    return YES;
                }
            }
            
        }
    }
    
    return NO;

}