如何使用SwiftUI TabView在Instagram应用程序中执行模式转换，例如中心按钮？

Question

import SwiftUI

struct ContentView: View {
    @State var showModal = false

    var body: some View {
        TabView {


            Text("Home View")
            .tabItem {
                VStack {
                    Image(systemName: "house")
                    Text("Home")
                }
            }


            Text("Dummy View")
            .onAppear {
                self.showModal = true
            }
            .sheet(isPresented: self.$showModal) {
                Text("Camera View")
            }
            .tabItem {
                VStack {
                    Image(systemName: "camera")
                    Text("Camera")
                }
            }


            Text("Setting View")
            .tabItem {
                VStack {
                    Image(systemName: "person")
                    Text("Setting")
                }
            }

        }
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}

当我用上面的代码点击中央摄像头按钮时，

1. 已显示“虚拟视图”。
2. 调用onAppear并将self.showModal设置为true。
3. 但是，不会执行模态转换，并且无法显示“摄像机视图”。

使用SwiftUI TabView轻按Tab键时如何执行模式转换？

---

谢谢你！

最后，我用以下代码解决了这个问题：

import SwiftUI

struct ContentView: View {
    @State var showModal = false

    var body: some View {
        TabView {


            Text("Home View")
            .tabItem {
                VStack {
                    Image(systemName: "house")
                    Text("Home")
                }
            }


            Text("Dummy View")
            .onAppear {
                DispatchQueue.main.async {
                    self.showModal = true
                }
            }
            .sheet(isPresented: self.$showModal) {
                Text("Camera View")
            }
            .tabItem {
                VStack {
                    Image(systemName: "camera")
                    Text("Camera")
                }
            }


            Text("Setting View")
            .tabItem {
                VStack {
                    Image(systemName: "person")
                    Text("Setting")
                }
            }

        }
    }
}

Answer 1

我对此感到很麻烦，但不确定为什么，但是当我将.sheet放在视图层次结构的最顶层时，它总是最适合我。另外，我将调用包装在.onAppear中，以便在使其正常工作的主队列（UI）上明确运行：

struct ContentView: View {
    @State var showModal = false

    var body: some View {
        TabView {
            Text("Home View")
                .tabItem {
                    VStack {
                        Image(systemName: "house")
                        Text("Home")
                    }
            }

            Text("Dummy View")
                .onAppear {
                    print("Hallo")
                    DispatchQueue.main.async {
                        self.showModal = true
                    }
                }
                .tabItem {
                    VStack {
                        Image(systemName: "camera")
                        Text("Camera")
                    }
            }

            Text("Setting View")
                .tabItem {
                    VStack {
                        Image(systemName: "person")
                        Text("Setting")
                    }
            }

        }
        .sheet(isPresented: self.$showModal) {
            Text("Camera View")
        }
    }
}

我希望这会有所帮助！