swift画圆角对话框

最新推荐文章于 2024-08-20 11:02:28 发布

杨杨1234

最新推荐文章于 2024-08-20 11:02:28 发布

阅读量948

点赞数 1

CC 4.0 BY-SA版权

分类专栏： iOS swift

本文链接：https://blog.youkuaiyun.com/yjw1007020425/article/details/51509792

swift 同时被 2 个专栏收录

13 篇文章

订阅专栏

iOS

9 篇文章

订阅专栏

本文介绍如何使用Swift编程语言实现类似安卓.9.png效果的圆角对话框，包括步骤：1.绘制圆角矩形；2.画出指向下方的三角形；3.进行描边，并避免在三角形区域内出错，最终实现居中悬浮的文本显示。

这里的圆角的对话框我指的是类似安卓的.9.png那样的圆角的对话框，就是这个样子的。

分解出来就是一个实心的圆角矩形加一个三角形，外面用直线描边，里面写一些居中悬浮的字符串而已。

1.画圆角矩形假设x1,y1为右下角的点

let rx:CGFloat =4      //圆角弧度
CGContextSetFillColorWithColor(context, UIColor(red: 248/255, green:248/255, blue:248/255, alpha:1).CGColor)//设置画笔颜色
CGContextMoveToPoint(context, x1, y1 - rx);                         // 右下角
CGContextAddArcToPoint(context, x1, y1, x2, y1, rx);               // 右下角度－左下角
CGContextAddArcToPoint(context, x2, y1, x2, y2, rx);               // 左下角－左上角
CGContextAddArcToPoint(context, x2, y2, x1, y2, rx);                //左上角－右上角
CGContextAddArcToPoint(context, x1, y2, x1, y1, rx);                //右上角－右下脚
CGContextClosePath(context);//封起来
CGContextDrawPath(context, CGPathDrawingMode.Fill)   //根据坐标绘制路径

2.画三角形

取圆角矩形的底边上某个点(xs,y1)，这里随便举个栗子啦这里x2<xs<x1

let sPoint = [CGPointMake(xs, y1),CGPointMake(xs + 10, y1),CGPointMake(xs + 5, y1＋5)];
CGContextAddLines(context, sPoints5, 3);//添加线
CGContextClosePath(context);//封起来
CGContextDrawPath(context, CGPathDrawingMode.Fill)//根据坐标绘制路径

这样基本轮廓就出来啦，一个尖尖向下的对话框

3.描边

就是画线咯，注意在三角形区域不要画错喔

CGContextSetLineWidth(context, 0.5)//设置画笔宽度
CGContextSetStrokeColorWithColor(context, UIColor(red: 204/255, green:204/255, blue:204/255, alpha:1).CGColor)//设置画笔颜色
CGContextMoveToPoint(context, x1, y1);           //起点
CGContextAddLineToPoint(context, xs＋10, y1);
CGContextAddLineToPoint(context, xs＋5, y1+5);   //斜边1
CGContextAddLineToPoint(context, xs, y1);        //斜边2
CGContextAddLineToPoint(context, x2, y1);
CGContextAddLineToPoint(context, x2, y2);
CGContextAddLineToPoint(context, x1, y2);
CGContextAddLineToPoint(context, x1, y1);
CGContextStrokePath(context) //关闭路径

写到这里，萌萌哒圆角对话框就写好咯，加下来在里面挖坑写字符串就可以了