如何解决圆角笔画/边框 SwiftUI
我正在处理一个 SwiftUI 项目,我需要一个视图的边框只有一些圆角(例如,左上角和右上角)。
我添加了一个带有笔划的 RoundedRectangle 并且能够使所有的角都变圆。但是,我只需要对一些角进行圆角处理,而我想不出办法来做到这一点。
这是我必须添加一个 RoundedRectangle 的代码:
.overlay(
RoundedRectangle(cornerRadius: 20)
.stroke(Color.gray,linewidth: 1)
)
为了仅使特定的角变圆,我查看了这篇 Stackoverflow 帖子:Round Specific Corners SwiftUI。但是,我将不得不摆脱圆角矩形(因为它可以环绕所有角落)。我将不得不使用普通边框。但是,对于普通边框,在圆角并尝试提供的任何答案时,它会切掉一块边框。
这就是我理想中想要的样子(这是来自 Bootstrap 的一个例子——我们正在将网站重建为一个应用程序):
谢谢!
解决方法
这里有另一种/更简单的方法来重新创建它。为每一行添加一个白色背景,并在它们后面添加一个灰色背景色。在行之间添加间距,让灰色背景色看起来像它们之间的分隔线。然后只需在整个视图中添加一个矩形叠加层,就像您在代码中已经拥有的那样!
struct CornerView: View {
var body: some View {
VStack(spacing: 1) {
ForEach(0..<5) { index in
Text("Item \(index)")
.frame(maxWidth: .infinity)
.frame(height: 55)
.background(Color.white)
}
}
.background(Color.gray)
.overlay(
RoundedRectangle(cornerRadius: 5)
.stroke(Color.gray,lineWidth: 1)
)
.padding()
}
}
struct CornerView_Previews: PreviewProvider {
static var previews: some View {
CornerView2()
}
}
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。