UIBezierPath 绘制微信聊天气泡

UIBezierPath 绘制微信聊天气泡

废话不多说，直接上代码

    CGSize photoSize = message.bubbleFrame.size;
    
    CGFloat w = photoSize.width;
    CGFloat h = photoSize.height;
    
    CGFloat radius = 8;
    CGFloat angleWidth = 6;
    
    
    UIBezierPath *bezierPath = [UIBezierPath bezierPath];
    bezierPath.lineWidth = 1;
    bezierPath.lineCapStyle = kCGLineCapRound;
    bezierPath.lineJoinStyle = kCGLineJoinRound;
    
    if (message.bubbleMessageType == GCBubbleMessageTypeSending) {
        
        [bezierPath moveToPoint:CGPointMake(w-angleWidth,h-radius)];
        [bezierPath addArcWithCenter:CGPointMake(w-radius-angleWidth, h-radius) radius:radius startAngle:0 endAngle:M_PI/2 clockwise:YES];
        [bezierPath addArcWithCenter:CGPointMake(radius, h-radius) radius:radius startAngle:M_PI/2 endAngle:M_PI clockwise:YES];
        [bezierPath addArcWithCenter:CGPointMake(radius,radius) radius:radius startAngle:M_PI endAngle:3*M_PI/2 clockwise:YES];
        [bezierPath addArcWithCenter:CGPointMake(w-radius-angleWidth, radius) radius:radius startAngle:3*M_PI/2 endAngle:2*M_PI clockwise:YES];
        [bezierPath addLineToPoint:CGPointMake(w-angleWidth,40/2-angleWidth)];
        [bezierPath addLineToPoint:CGPointMake(w, 40/2)];
        [bezierPath addLineToPoint:CGPointMake(w-angleWidth, 40/2+angleWidth)];
        
    }else
    {
        [bezierPath moveToPoint:CGPointMake(w,h-radius)];
        [bezierPath addArcWithCenter:CGPointMake(w-radius, h-radius) radius:radius startAngle:0 endAngle:M_PI/2 clockwise:YES];
        [bezierPath addArcWithCenter:CGPointMake(radius+angleWidth, h-radius) radius:radius startAngle:M_PI/2 endAngle:M_PI clockwise:YES];
        [bezierPath addLineToPoint:CGPointMake(angleWidth, 40/2+angleWidth)];
        [bezierPath addLineToPoint:CGPointMake(0, 40/2)];
        [bezierPath addLineToPoint:CGPointMake(angleWidth,40/2-angleWidth)];
        [bezierPath addArcWithCenter:CGPointMake(radius+angleWidth,radius) radius:radius startAngle:M_PI endAngle:3*M_PI/2 clockwise:YES];
        [bezierPath addArcWithCenter:CGPointMake(w-radius, radius) radius:radius startAngle:3*M_PI/2 endAngle:2*M_PI clockwise:YES];
    }
    
    [bezierPath closePath];

    CAShapeLayer *shapLayer = [CAShapeLayer layer];
    shapLayer.path = bezierPath.CGPath;
    
    boarderLayer.path = bezierPath.CGPath;
    boarderLayer.frame=_photoImageView.bounds;
    
    _photoImageView.layer.mask = shapLayer;

注意：

 `addArcWithCenter` 中的弧度和数学中的弧度方向是相反的。