视图切换方式

状态

通过当前的状态（e.g. @State、@StateObject、@ObservedObject...）来决定当前的SwiftUI View展示与否，且自带有动画效果。示例如下

dart 复制代码

struct ContentView: View {
  @State var show = true
  var body: some View {
    
    VStack {
      Button("Show Text") {
        show.toggle()
        print(show)
      }
      
      if show {
        Text("Show")
      }
    }
  }
}

Sheet

隐式地启动/嵌入新的VC，类似于iOS开发中的presentViewController，SwiftUI提供如下两个API。

less 复制代码

public func sheet<Item, Content>(item: Binding<Item?>,
                                 onDismiss: (() -> Void)? = nil,
                                 @ViewBuilder content: @escaping (Item) -> Content)
-> some View where Item : Identifiable, Content : View

public func fullScreenCover<Content>(isPresented: Binding<Bool>,
                                     onDismiss: (() -> Void)? = nil,
                                     @ViewBuilder content: @escaping () -> Content)
-> some View where Content : View

调用示例如下

dart 复制代码

struct ContentView: View {
  @State var show = false
  
    var body: some View {
      Button("Show Text") {
          show.toggle()
          print(show)
      }.sheet(isPresented: $show) {
        Button("Hide Text") {
            show.toggle()
            print(show)
        }
      }
    }
}

NavigationView

表示视图栈的View，该View表示导航层次结构中可见的路径。使用NavigationView创建一个基于导航的应用程序，用户可以在其中遍历视图集合。用户通过选择你提供的NavigationLink导航到目标视图。在iPadOS和macOS上，目标内容将在下一栏中显示。其他平台将一个新的View推入堆栈，并通过平台特定的控件(如后退按钮或滑动手势)从堆栈中删除项目。

在macOS上显示多列导航视图，在iOS上显示视图堆栈的图表（类比的UINavigationController）

示例如下:

css 复制代码

struct ContentView: View {
    var body: some View {
      NavigationView {
        NavigationLink {
          Text("Destination")
        } label: {
          Text("Show Text")
        }
      }
    }
}

SwiftUI学习-视图切换方式

视图切换方式

状态

Sheet

NavigationView