圆角笔画/边框 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()
    }
}