ios - 在 iPhone XR 模拟器上横向使用 SwifUI NavigationView 的任何经验？

Question

我尝试在 iPhone XR 模拟器上横向运行我的应用程序并得到一个空白屏幕。

下面的代码是我的测试。如果我删除 NavigationView，它可以在 iPhone 8 模拟器上正常工作，也不能在 iPhone XR 模拟器上正常工作。

import SwiftUI

struct ContentView: View {
    var body: some View {
        NavigationView {
            GeometryReader { gp in
                VStack(alignment: HorizontalAlignment.center) {
                    Text("Width: \(gp.size.width)")
                    Text("Height: \(gp.size.height)")
                }
            }
        }
    }
}

我希望我能看到横向和纵向的屏幕尺寸。

有没有人有这种组合的经验？

Answer 1

没有任何错误。只是当大 iPhone 横屏时，它的水平尺寸等级设置为.regular，而不是.compact。想一想，就好像它是一台 iPad。

您可以通过从屏幕左侧大小滑动来验证它：

如果在未选择任何内容的情况下更改代码以添加默认视图，则会得到另一种外观：

struct ContentView: View {
    var body: some View {
        NavigationView {
            GeometryReader { gp in
                VStack(alignment: HorizontalAlignment.center) {
                    Text("Width: \(gp.size.width)")
                    Text("Height: \(gp.size.height)")
                    NavigationLink(destination: Text("Something got selected")) { Text("Select something") }
                }

            }

            Text("No Selection")
        }
    }
}

如果您想强制它为 .compact，请执行以下操作：

struct ContentView: View {
    var body: some View {
        NavigationView {
            GeometryReader { gp in
                VStack(alignment: HorizontalAlignment.center) {
                    Text("Width: \(gp.size.width)")
                    Text("Height: \(gp.size.height)")
                    NavigationLink(destination: Text("Something got selected")) { Text("Select something") }
                }

            }

            Text("No Selection")
        }.environment(\.horizontalSizeClass, .compact)
    }
}

Answer 2

将此修饰符添加到 NavigationView 可以禁用主从视图。

NavigationView {
  // Code
}
.environment(\.horizontalSizeClass, .compact) 

Answer 3

解决此问题的另一种方法是强制 NavigationView 堆叠样式。

NavigationView {
    Text("Hello World")
    }.navigationViewStyle(StackNavigationViewStyle())

或者更新的：

NavigationView {
    Text("Hello World")
    }.navigationViewStyle(.stack)