SwiftUI如何调整不同的屏幕尺寸

我正在使用 SwiftUI 开发人员列表页面，iPhone X 屏幕足够大，但标题在 iPhone 8 中超出屏幕：

iPhone X：

然而，在 iPhone 8 或更小的屏幕中，“查找人员”太靠近左侧，“全部关注”甚至超出了屏幕：

我知道在 UIKit 自动布局中会很容易地解决这个问题，但我想知道 SwiftUI 解决这个问题的最佳方法或正确方法是什么，有些答案说使用类似Spacer or HStack，但它们实际上都不起作用。

var body: some View {
    NavigationView {
        List {
            ForEach(people) {person in
                PersonView(person: person)
            }
        }.navigationBarItems(leading:
            VStack(spacing: 10) {
                HStack(spacing: 100) {
                    Text("Find People").font(.system(size: 30)).bold()
                    Text("Follow All").foregroundColor(Color(ColorUtils.hexStringToUIColor(hex: Constants.THEME.THEME_COLOR)))
                }
                HStack(spacing: 20) {
                     Text("Import from: ")
                     ForEach(socialIcons, id: \.self) {icon in
                         Image(icon).resizable().frame(width: 25, height: 25)
                     }
                }
            }
        )
    }
}

您正在放置静态间距，因此会发生该问题。你可以使用修复它Spacer()修改并给出一些Frame().

var body: some View {
    NavigationView {
        List {
            ForEach(peoples, id: \.self) {person in
                PersonView(person: person)
            }
        }.navigationBarItems(leading:
            VStack(spacing: 5) { // Change Spacing as you want
                HStack {
                    Text("Find People").font(.system(size: 30)).bold()
                    Spacer()
                    Text("Follow All").foregroundColor(Color(ColorUtils.hexStringToUIColor(hex: Constants.THEME.THEME_COLOR)))
                }
                HStack() {
                    Text("Import from:")
                    Spacer()
                    ForEach(socialIcons, id: \.self) {icon in
                        Image(icon).resizable().frame(width: 25, height: 25)
                            .padding(.horizontal)
                    }
                }
            }.frame(width: UIScreen.main.bounds.width-20, alignment: .center)
        )
    }
}