SwiftUI:如何将视图限制为仅在一个方向上调整大小?

时间:2020-09-18 19:45:08

标签: swiftui

如何限制视图仅向下调整大小?

我正在尝试添加更多按钮,并调整视图的大小以容纳按钮,而不会与上方的红色矩形重叠。

这是我当前正在使用的代码:

struct ContentView: View {
    var body: some View {
        VStack{
            RoundedRectangle(cornerRadius: 20)
                .frame(width: .infinity, height: 55)
                .foregroundColor(.red)
                
            HStack{
                Spacer()
                ZStack{
                    RoundedRectangle(cornerRadius: 20)
                        .foregroundColor(.green)
                    
                    VStack{
                        Button(action: {}) {
                            Text("Test Button")
                                .foregroundColor(.white)
                                .font(.headline)
                                .frame(width: .infinity)
                            Spacer()
                        }.padding()
                        
                        Button(action: {}) {
                            Text("Test Button")
                                .foregroundColor(.white)
                                .font(.headline)
                                .frame(width: .infinity)
                            Spacer()
                        }.padding()
                        
                        Button(action: {}) {
                            Text("Test Button")
                                .foregroundColor(.white)
                                .font(.headline)
                                .frame(width: .infinity)
                            Spacer()
                        }.padding()
                    }
                    
                }.frame(width: 250, height: 100)
            }
            Spacer()
        }


    }
}

1 个答案:

答案 0 :(得分:0)

将您的.frame(width: 250, height: 100)更改为.frame(width: 250, height: 100, alignment: .top),原始示例默认为.center,这就是为什么它会扩展为红色矩形的原因。