将 SwiftUI NavigationView 从 3 列布局切换到“堆叠”布局答案

【问题标题】：Switch SwiftUI NavigationView from a 3-column Layout to a "stacked" Layout将 SwiftUI NavigationView 从 3 列布局切换到“堆叠”布局
【发布时间】：2021-01-13 08:49:35
【问题描述】：

我有以下带有 NavigationView 的 SwiftUI 3 列布局，效果很好。
如果 Mac 上的窗口变得非常小（宽度）或应用程序在 iPad 上以分屏方式运行，我想更改 NavigationViews 的行为，就像在 iPhone 上一样（视图堆栈）。

这可能吗？

struct MainNav: View {
    var body: some View {
      NavigationView{
        SideBar()
        MainView()
        Detail()
      }
      //.navigationViewStyle(DoubleColumnNavigationViewStyle())
    }
}

struct SideBar: View {
  var body: some View {
    Text("sidebar")
    NavigationLink("Main", destination: MainView() )
    NavigationLink("Text", destination: Text("from Sidebar"))
  }
}

struct MainView: View {
  var body: some View {
    VStack {
      Text("MAIN")
      NavigationLink("TEXT1", destination: Text("1  from main") )
      NavigationLink("TEXT2", destination: Text("2  from main") )
      NavigationLink("detail", destination: Detail())
    }
  }
}

struct Detail: View {
  var body: some View {
    VStack{
    Text("detail")
    NavigationLink("TEXT", destination: Text("from detail") )
    }
  }
}

【问题讨论】：

标签： ios macos swiftui ipados

【解决方案1】：

如果你没有设置navigationViewStyle，那么iPad应该会自动折叠成分屏的“stack”样式（或者至少是较小尺寸的分屏）。

我认为你不能在 macOS 上做同样的事情。事实上，我不确定“堆栈”风格是否适用于 Big Sur。

【讨论】：