使用UIBezierPath绘制聊天气泡

有的时候我们项目中会碰到这样的需求：

• 点击某一个按钮的时候弹出一个气泡视图
• 随着点击位置的不同出现的位置也不同
• tipView的高度自适应内容的高度

效果如下：

Untitled-2.gif

那么是怎么实现的呢？我这里使用的UIBezierPath来绘制的,主要代码在这里

    CGFloat width = self.contentView.width;
    CGFloat height = self.contentView.height;
    UIBezierPath *path = [UIBezierPath bezierPath];
    path.lineWidth = 1;
    path.lineCapStyle = kCGLineCapRound;
    path.lineJoinStyle = kCGLineJoinRound;
    [path moveToPoint:CGPointMake(10, 0)];
    [path addLineToPoint:CGPointMake(width/2 - 8, 0)];
    [path addLineToPoint:CGPointMake(width/2, -12)];
    [path addLineToPoint:CGPointMake(width/2 + 8, 0)];
    [path addArcWithCenter:CGPointMake(width - 10, 10) radius:10 startAngle:M_PI * 3/2 endAngle:M_PI * 2 clockwise:YES];
    [path addArcWithCenter:CGPointMake(width - 10, height -10) radius:10 startAngle:0 endAngle:M_PI /2 clockwise:YES];
    [path addArcWithCenter:CGPointMake(10, height -10) radius:10 startAngle:M_PI /2 endAngle:M_PI clockwise:YES];
    [path addArcWithCenter:CGPointMake(10, 10) radius:10 startAngle:M_PI  endAngle:M_PI * 3/2 clockwise:YES];
    [path closePath];
    self.shapeLayer.path = path.CGPath;

以上只是绘制了tipView那么怎么实现根据点击位置的frame来改变自身在屏幕的位置呢？关键还是这两句代码：

//获取当前点击的cell 在tableview上的位置
     CGRect rectInTableView = [self.mainView rectForRowAtIndexPath:indexPath];
//把tableView上的位置转化为当前屏幕的位置
     CGRect rectInSuperView = [self.mainView convertRect:rectInTableView toView:[self.mainView superview]];

以上就是实现的方法，整体来说还是比较简单的。