swiftui - SwiftUI：在 HStack 中操作按钮之间的空格

Question

我正在实现一个警报视图，警报视图有两个按钮：

Submit是一个按钮，Cancel是另一个按钮，但要靠近中心。有没有办法控制按钮的位置？

这是我的实现：

var body: some View {
    ZStack {
        VStack{
            Text(text)
            TextField("", text: $text, onEditingChanged: {
                self.typing = $0
            }, onCommit: {
                self.text = self.text
            })
            .textFieldStyle(RoundedBorderTextFieldStyle())
            HStack {
                Button(action: {
                    
                    
                }, label: {
                    Text("Submit")
                })
                Button(action: {
                    
                }, label: {
                    Text("Cancel")
                })
                
            }
        }
        .padding()
        .frame(width: screenSize.width * 0.7, height: screenSize.height * 0.3)
        .background(Color(red: 0.9268686175, green: 0.9416290522, blue: 0.9456014037, opacity: 1))
        .clipShape(RoundedRectangle(cornerRadius: 20.0, style: .continuous))
        .offset(y: isShown ? 0 : screenSize.height)
        .animation(.spring())
        .shadow(color: Color(red: 0.8596749902, green: 0.854565084, blue: 0.8636032343, opacity: 1), radius: 6, x: -9, y: -9)
        
    }
}

你们中的任何人都知道如何操纵按钮的分离吗？

Answer 1

1. 您可以在按钮所在的 HStack 中添加间距：

        HStack(spacing: 20) {
   

2. 您可以为按钮添加填充：

            Button(action: {
                //action
            }, label: {
                Text("Button")
            })
            .padding(.horizontal, 20)
   

3. 您可以设置按钮的框架：

            Button(action: {
                //action
            }, label: {
                Text("Button")
            })
            .frame(width: 100)
   

4. 您可以在 HStack 中添加一个垫片：

            HStack {
                Button...
                Spacer()
                Button...
            }
   

Answer 2

除了上面的惊人答案之外，您还可以使用以下代码设置垫片的确切长度：

HStack {
             Button...
             Spacer().frame(height: 30)
             Button...
}

将框架高度添加到垫片将控制它尽可能不扩大；）

Answer 3

我认为两个按钮之间的 Spacer 会帮助你。在你的 HStack ....

HStack {
 
Button(action: {
                        
                        
                    }, label: {
                        Text("Submit")
                    })
                    Spacer()
                    Button(action: {
                    
                    }, label: {
                        Text("Cancel")
                    })
                    
                }