在APP中实现类似聊天内容背景图时,需要绘制圆角及箭头。很多人会选择使用图片(这也是最省事的一种方法),但是对于在视图中对内容做约束布局的话,我们无法准确的知道箭头的偏移量。下面就来介绍一下利用CGContextRef怎样绘制吧。
先来看看效果图吧!
代码实现:
?
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
|
- (void)drawRect:(CGRect)rect {
float lw = 2; // 边线宽度
float aw = 4;// 箭头宽
float ah = 5;// 箭头高
float r = 3;// 圆角角度
// 需要减去边线的宽度,为什么不是减去边线的宽度x2?
// 因为左边线和上边线是往视图内描绘的,而右边线和下边线是往视图外描绘的。
float w = self.frame.size.width - lw;// 设置画线长度
float h = self.frame.size.height - lw;// 设置画线宽度
// 获取上下文
CGContextRef context = UIGraphicsGetCurrentContext();
// 设置边线宽度
CGContextSetLineWidth(context, lw);
//边框颜色
CGContextSetStrokeColorWithColor(context, [UIColor redColor].CGColor);
// 矩形填充颜色
CGContextSetFillColorWithColor(context, [UIColor whiteColor].CGColor);
CGContextMoveToPoint(context, 0, lw); // 开始坐标左边开始
CGContextAddArcToPoint(context, w, lw, w, r, r); // 右上角角度
CGContextAddArcToPoint(context, w , h, w-r, h, r); // 右下角角度
CGContextAddArcToPoint(context, aw, h, aw, h-r, r); // 左下角角度
CGContextAddLineToPoint(context, aw, ah); // 向左上竖线
CGContextAddLineToPoint(context, 0, lw); // 向左上斜线
CGContextDrawPath(context, kCGPathFillStroke); //根据坐标绘制路径
// 父类调用 放在画完边线后。不然设置的文字会被覆盖
[super drawRect:rect];
}
|
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持快网idc。
相关文章
猜你喜欢
- 个人服务器网站搭建:如何选择适合自己的建站程序或框架? 2025-06-10
- 64M VPS建站:能否支持高流量网站运行? 2025-06-10
- 64M VPS建站:怎样选择合适的域名和SSL证书? 2025-06-10
- 64M VPS建站:怎样优化以提高网站加载速度? 2025-06-10
- 64M VPS建站:是否适合初学者操作和管理? 2025-06-10
TA的动态
- 2025-07-10 怎样使用阿里云的安全工具进行服务器漏洞扫描和修复?
- 2025-07-10 怎样使用命令行工具优化Linux云服务器的Ping性能?
- 2025-07-10 怎样使用Xshell连接华为云服务器,实现高效远程管理?
- 2025-07-10 怎样利用云服务器D盘搭建稳定、高效的网站托管环境?
- 2025-07-10 怎样使用阿里云的安全组功能来增强服务器防火墙的安全性?
快网idc优惠网
QQ交流群
您的支持,是我们最大的动力!
热门文章
-
2025-05-29 12
-
2025-05-25 75
-
2025-05-29 36
-
2025-06-04 73
-
2025-06-04 87
热门评论


