如何使用SwiftUI确保视图在横向和纵向模式下都能工作

Question

我是SwiftUI的新手，正在编写一个简单的租金分割应用程序。我有以下代码。

var body: some View {
NavigationView {
GeometryReader { bounds in
VStack(alignment: .center){
Text("Welcome to Fair Rent")
.font(Font.system(size: 30, design: .rounded))
.fontWeight(.bold)
.frame(width: nil)
Image(systemName: "person.3.fill")
.font(.largeTitle)
.padding(2)
Text("How many people do you live with?")
.font(Font.system(size:20, design: .rounded))
.multilineTextAlignment(.center)
.lineLimit(nil)
.padding(18.0)
NavigationLink(destination: FairRentView(viewModel: FairRentViewModel(Amounts(), housemates: 1)))
{
Text("      1 other person")
.styledLinkLabel(with: gradient)
}
NavigationLink(destination: FairRentView(viewModel: FairRentViewModel(Amounts(), housemates: 2)))
{
Text("      2 other people")
.styledLinkLabel(with: gradient)
}
NavigationLink(destination: FairRentView(viewModel: FairRentViewModel(Amounts(), housemates: 3)))
{
Text("      3 other people")
.styledLinkLabel(with: gradient)
}
NavigationLink(destination: FairRentView(viewModel: FairRentViewModel(Amounts(), housemates: 4)))
{
Text("      4 other people")
.styledLinkLabel(with: gradient)
}
NavigationLink(destination: FairRentView(viewModel: FairRentViewModel(Amounts(), housemates: 5)))
{
Text("      5 other people")
.styledLinkLabel(with: gradient)
}
NavigationLink(destination: FairRentView(viewModel: FairRentViewModel(Amounts(), housemates: 6)))
{
Text("      6 other people")
.styledLinkLabel(with: gradient)
}
}.frame(width: bounds.size.width, height: bounds.size.height)
}
}.navigationBarTitle("Fair Rent", displayMode: .inline)
.navigationViewStyle(StackNavigationViewStyle())
}
}

这在纵向效果很好，但不适用于横向

并且我无法向下滚动以选择所有按钮。

有人能指出我哪里错了吗？

Answer 1

VStack不滚动。将VStack置于ScrollView中。