在一个HStack容器中串联两个文本视图？

Question

我想知道是否有人可以使我指向正确的方向，以使两个文本项彼此相邻放置而不会留下空白（请参见下图）。有很多间距，边界和对齐方式，但是玩了30分钟之后，我似乎再也没有靠近了。

我正在使用的代码如下：

struct TestView: View {
    var body: some View {
        VStack {
            HStack() {
                Text("SHOT").background(Color.red)
                Text("GUN").background(Color.blue)
            }
            Text("SHOTGUN").background(Color.green)
        }
    }
}

Answer 1

尝试

struct ContentView: View {
    var body: some View {
        VStack {
            HStack(spacing: 0) {
                Text("SHOT").background(Color.red)
                Text("GUN").background(Color.blue)
            }
            Text("SHOTGUN").background(Color.green)
        }
    }
}