ToB企服应用市场:ToB评测及商务社交产业平台

标题: swiftui给视图添加边框大概只给某个边设置border边框 [打印本页]

---

作者: 天空闲话    时间: 2024-11-15 17:34
标题: swiftui给视图添加边框大概只给某个边设置border边框

直接利用border()就可以给一个视图添加边框效果，但是这种边框会给所有的边都设置上。 border()内里也可以添加属性.border(.blue, width: 5)这种就是设置颜色和宽度。
设置圆角边框

1.         Text("1024小神")
2.             .padding()
3.             .cornerRadius(20)
4.             .overlay(
5.                 RoundedRectangle(cornerRadius: 20, style: .continuous)
6.                      .stroke(.orange, lineWidth: 2)
7.                         
8.             )

复制代码

设置正圆形边框：

1. Text("1024小神")
2.             .padding(30)
3.             .overlay(Circle().stroke(.orange, lineWidth: 2))

复制代码

单独给某个边沿设置边框：
通过修改alignment的对齐方式，可以实现上下边框

1. Text("1024小神")
2.             .padding(30)
3.             .overlay(
4.                 Rectangle()
5.                     .frame(width: nil, height: 2, alignment: .top)
6.                     .foregroundColor(Color.red),
7.                 alignment: .top
8.             )

复制代码

实现左右边框
将Rectangle的宽度设置2，高度设置为0，就有了长条形的形状，然后再设置alignment为leading就可以实现左边边框，设置为trailing就可以实现右边边框。

1. Text("1024小神")
2.             .padding(30)
3.             .overlay(
4.                 Rectangle()
5.                     .frame(width: 2, height: nil, alignment: .top)
6.                     .foregroundColor(Color.red),
7.                 alignment: .leading
8.             )

复制代码

右边边框：
可以通过修改width设置边框的粗细

免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！更多信息从访问主页：qidao123.com:ToB企服之家，中国第一个企服评测及商务社交产业平台。

---

欢迎光临 ToB企服应用市场:ToB评测及商务社交产业平台 (https://dis.qidao123.com/)

Powered by Discuz! X3.4