ios - 在没有按钮的 SwiftUI 中呈现新视图

Question

因此，我想使用 SwiftUI 呈现一个新视图，而无需用户点击按钮，因为NavigationButton可以使用它。这是一个例子

struct ContentView : View {

    var model: Model

    var body: some View {
        NavigationView {
            Text("Hello World")
        }.onAppear {
            if model.shouldPresent {
                // present a new view
            }
        }
    }
}

在onAppear我想包含一些将新视图推送到导航堆栈的代码。

Answer 1

这是一种将视图呈现为模态的方法。

struct PresentOnloadView: View {
    var body: some View {
        HStack {
            Text("Hey there")
            }
            .presentation(Modal(HelloView(), onDismiss: nil))
        }
}

struct HelloView: View {
    var body: some View {
        Text("Whats up! ")
    }
}

同样，如果您希望控制是否使用变量呈现或不显示，您可以执行以下操作。

struct PresentOnloadControlledView : View {
  @State var sayHello = false

    var body: some View {
        HStack {
                Text("What's up!")
            }
            .onAppear(perform: {
                // Decide whether to show another view or not here
                self.sayHello = true
            })
            .presentation(sayHello ? Modal(HelloView()) : nil)
    }
}

自版本 11.0 beta 4 ➝ .presentation和Modal起已弃用。

不用担心！.sheet节省了一天！

struct PresentOnloadControlledView : View {
  @State var sayHello = false

    var body: some View {
        HStack {
            Text("What's up!")
        }
        .onAppear(perform: {
            // Decide whether to show another view or not here
            self.sayHello = true
        })
        .sheet(isPresented: $sayHello) {
            HelloView()
        }
    }
}

Answer 2

SwiftUI 2

SwiftUI 2 / iOS 14 中的 Segue 等价物：

• 显示（推）

struct ContentView: View {
    @State var showSecondView = false

    var body: some View {
        NavigationView {
            Text("First view")
                .background(NavigationLink("", destination: Text("Second view"), isActive: $showSecondView))
        }
        .onAppear {
            DispatchQueue.main.asyncAfter(deadline: .now() + 1) {
                showSecondView = true
            }
        }
    }
}

• 显示详细信息（替换）

struct ContentView: View {
    @State private var showSecondView = false

    var body: some View {
        NavigationView {
            if showSecondView {
                Text("Second view")
            } else {
                Text("First view")
            }
        }
        .onAppear {
            DispatchQueue.main.asyncAfter(deadline: .now() + 1) {
                showSecondView = true
            }
        }
    }
}

• 现在模态

struct ContentView: View {
    @State private var showSecondView = false

    var body: some View {
        NavigationView {
            Text("First view")
        }
        .sheet(isPresented: $showSecondView) {
            Text("Second view")
        }
        .onAppear {
            DispatchQueue.main.asyncAfter(deadline: .now() + 1) {
                showSecondView = true
            }
        }
    }
}

• 全屏显示

struct ContentView: View {
    @State private var showSecondView = false

    var body: some View {
        NavigationView {
            Text("First view")
        }
        .fullScreenCover(isPresented: $showSecondView) {
            Text("Second view")
        }
        .onAppear {
            DispatchQueue.main.asyncAfter(deadline: .now() + 1) {
                showSecondView = true
            }
        }
    }
}

注意：我添加了DispatchQueue.main.asyncAfter(deadline: .now() + 1)以便您可以看到过渡。您可以删除它，过渡将立即开始。

Answer 3

在您的视野中：

@State var present = true

var body: some View {
    NavigationLink(destination: DestinationView(), isActive: $present) {
        EmptyView()
    }
}

DestinationView只要 NavigationLink 加载，此代码就会显示。关键部分是isActive参数，它以编程方式触发到另一个视图的转换。

你可以重写如下

@State var present = false

var body: some View {
    NavigationLink(destination: DestinationView(), isActive: $present) {
        Button { 
            present = true
        } label: { Text("Present") }
    }
}

手动创建导航按钮。

Answer 4

您可以简单地将逻辑放在NavigationView. 像这样：

@State var x = true;

var body : some View {
    NavigationView {
        if x {
            Text("Hello")
            Button(action: {
                self.x = false;
            }, label: { Text("Click Me") })
        } else {
            Text("World")
        }
    }
}