好久沒(méi)有自己寫點(diǎn)東西了，昨天看到前公司的一個(gè)小功能，挺感興趣的，就自己做了個(gè)類似于手繪板的功能。廢話不多說(shuō)，上圖上代碼。

2016-12-23 14_29_37.gif

@property (nonatomic, strong) NSMutableArray *LayerArray;

@property (nonatomic, strong) HBShapLayer *drawLayer;

@property (nonatomic, strong) UIBezierPath *beganPath;
//線寬
@property (nonatomic, assign) CGFloat lineWidth;
//線的顏色
@property (nonatomic, strong) UIColor *lineColor;


- (void)touchesBegan:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event
{
    UITouch *touch = [touches anyObject];
    CGPoint beganPoint = [touch locationInView:self];
    [self drawBeganPoint:beganPoint];
}
- (void)touchesMoved:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event
{
    UITouch *touch = [touches anyObject];
    CGPoint currentPoint = [touch locationInView:self];
    //上一個(gè)點(diǎn)的坐標(biāo)
    CGPoint previousPoint = [touch previousLocationInView:self];
    CGPoint middlePoint = midPoint(previousPoint,currentPoint);
    [self drawControlPoint:middlePoint EndPoint:currentPoint];
}
- (void)touchesEnded:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event
{
    UITouch *touch = [touches anyObject];
    CGPoint currentPoint = [touch locationInView:self];
    CGPoint previousPoint = [touch previousLocationInView:self];
    CGPoint middlePoint = midPoint(previousPoint,currentPoint);
    [self drawControlPoint:middlePoint EndPoint:currentPoint];
}

線條起點(diǎn)位置：

- (void)drawBeganPoint:(CGPoint)point
{
    
    HBShapLayer *drawLayer = [HBShapLayer layer];
    drawLayer.lineWidth = self.lineWidth;
    drawLayer.fillColor = [UIColor clearColor].CGColor;
    drawLayer.strokeColor = self.lineColor.CGColor;
    _drawLayer = drawLayer;
    _drawLayer.isPen = YES;
    [self.layer addSublayer:_drawLayer];
    
    [_LayerArray addObject:drawLayer];
    
    UIBezierPath *beganPath = [UIBezierPath bezierPath];
    [beganPath moveToPoint:point];
    _beganPath = beganPath;
    
}

更新線條的位置：

- (void)drawControlPoint:(CGPoint)controlPoint EndPoint:(CGPoint)point
{
    [_beganPath addQuadCurveToPoint:point controlPoint:controlPoint];
    _drawLayer.path = _beganPath.CGPath;
}
// 計(jì)算中間點(diǎn)
CGPoint midPoint(CGPoint p1, CGPoint p2)
{
    return CGPointMake((p1.x + p2.x) * 0.5, (p1.y + p2.y) * 0.5);
}

這個(gè)方法是將UIView轉(zhuǎn)為UIImage:

注意UIGraphicsBeginImageContextWithOptions這個(gè)方法的第二個(gè)和第三個(gè)參數(shù)，如果將第二個(gè)參數(shù)設(shè)置為yes的話，保存的圖片會(huì)出現(xiàn)模糊的情況.

//將UIView轉(zhuǎn)成UIImage
-(UIImage *)getImageFromView:(UIView *)theView
{
     // 下面方法，第一個(gè)參數(shù)表示區(qū)域大小。第二個(gè)參數(shù)表示是否是非透明的。如果需要顯示半透明效果，需要傳NO，否則傳YES。第三個(gè)參數(shù)就是屏幕密度了
    UIGraphicsBeginImageContextWithOptions(theView.bounds.size, NO, [UIScreen mainScreen].scale);
    [theView.layer renderInContext:UIGraphicsGetCurrentContext()];
    UIImage *image = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();
    return image;
}

有什么錯(cuò)誤和疏漏，歡迎指正，附上demo地址。