[族谱布局连线]#绘制

draw.m

//// 


- (void)setupUI {
    
    UIView *lastOne = nil;
    NSInteger count = 16;
    for (NSInteger i = 0; i < count; i++) {
        SYPersonGraphOneManView *one = [[SYPersonGraphOneManView alloc] init];
        [one addGestureRecognizer:[[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(tapOneManView:)]];
        [self.arrayM addObject:one];
        [self addSubview:one];
        [one mas_makeConstraints:^(MASConstraintMaker *make) {
            make.size.mas_equalTo(CGSizeMake(52, 78));
            if (lastOne) {
                if (i % manRow == 1) {
                    make.left.equalTo(lastOne).offset(52 * 2);
                    if (i > manRow) {
                        make.centerY.equalTo(lastOne).offset(-52 * (manRow+1));
                    } else {
                        make.centerY.equalTo(lastOne).offset(-52);
                    }
                } else if (i % manRow == 2) {
                    make.left.equalTo(lastOne);
                    make.centerY.equalTo(lastOne).offset(52 * 2);
                } else {
                    make.left.equalTo(lastOne);
                    make.centerY.equalTo(lastOne).offset(52 * 2);
                }
                
            } else {
                make.centerY.equalTo(self);
                make.left.equalTo(self).offset(52);
            }
            if (i == (count -1)) {
                make.right.equalTo(self).offset(-52);
            }
        }];
        lastOne = one;
    }
    
}

- (void)drawRect:(CGRect)rect {
//    [super drawRect:rect];
    
    for (NSInteger i = 0; i < self.arrayM.count - manRow; i++) {
        SYPersonGraphOneManView *one = self.arrayM[i];
        SYPersonGraphOneManView *two = self.arrayM[i + manRow];
        CGPoint start = CGPointMake(CGRectGetMaxX(one.frame) + 11, CGRectGetMinY(one.frame) + 39);
        CGPoint end = CGPointMake(CGRectGetMinX(two.frame) - 11, CGRectGetMinY(two.frame) + 39);
        [self drawLineWithStart:start withEnd:end];
    }

    for (NSInteger i = 1; i < manRow; i++) {
        SYPersonGraphOneManView *one = self.arrayM[0];
        SYPersonGraphOneManView *two = self.arrayM[i];
        CGPoint start = CGPointMake(CGRectGetMaxX(one.frame) + 11, CGRectGetMinY(one.frame) + 39);
        CGPoint end = CGPointMake(CGRectGetMinX(two.frame) - 11, CGRectGetMinY(two.frame) + 39);
        [self drawLineWithStart:start withEnd:end];
    }
}

//画直线
- (void)drawLineWithStart:(CGPoint)start withEnd:(CGPoint)end{

    
    //1.获取上下文(获取,创建上下文 都 以uigraphics开头)
    CGContextRef ctx = UIGraphicsGetCurrentContext();
    //2.绘制路径
    UIBezierPath *path = [UIBezierPath bezierPath];
    //2.1 设置起点
    [path moveToPoint:start];
    //2.2 添加一根线到终点
    [path addLineToPoint:end];
    
    //画第二条线
    //    [path moveToPoint:CGPointMake(100, 280)];
    //    [path addLineToPoint:CGPointMake(250, 100)];
    
    //addLineToPoint:把上一条线的终点当作是下一条线的起点
//    [path addLineToPoint:CGPointMake(200, 280)];
    
    //上下文的状态
    //设置线的宽度
    CGContextSetLineWidth(ctx, 1);
    //设置线的连接样式（两条线的交点为圆角）
    CGContextSetLineJoin(ctx, kCGLineJoinRound);
    //设置线的顶角样式（两根线的两端为圆角）
    CGContextSetLineCap(ctx, kCGLineCapRound);
    
    //设置颜色（此方法会自动判断是stroke描点，还是fill填充而设置颜色）
    [UIColorMake(75, 35, 0) set];
    //3.把绘制的内容添加到上下文当中.
    //UIBezierPath:UIKit框架 ->    CGPathRef:CoreGraphics框架
    CGContextAddPath(ctx, path.CGPath);
    //4.把上下文的内容显示到View上(渲染到View的layer)(stroke fill)
    CGContextStrokePath(ctx);

}