SwiftUI：圆角矩形叠加角被切断

Question

我正在尝试使用覆盖层的宽度一致的 Broder，但我一直得到错误的结果。我的叠加看起来像这样：

使用此代码：

VStack {
    HStack {
        Text("Test")
    }
    HStack {
        Text("test2")
    }
}
.padding()
.frame(width: UIScreen.main.bounds.width*0.95)
.frame(minHeight: 50)
.overlay (
    RoundedRectangle(cornerRadius: 20)
        .stroke(RandomColor(), lineWidth: 3)
)

如您所见，边角比覆盖层的所有其他部分都厚。我该如何解决这个问题？

Answer 1

您缺少的是 stroke 和 strokeBorder 之间的区别，如果您将代码更改为 strokeBorder 会对您有所帮助。

RoundedRectangle(cornerRadius: 20)
    .strokeBorder(RandomColor(), lineWidth: 3)

Answer 2

lineWidth 使其略微超出其边界。您可以使用 inset(by:) 平衡它以将其保留在原始框架内：

RoundedRectangle(cornerRadius: 20)
 .inset(by: 3)
 .stroke(RandomColor(), lineWidth: 3)

注意：您可能只需要插入 2 —— 还没有做足够的实验来了解确切的数字是多少