在 SwiftUI 中的特定頁面上隱藏標簽欄

Question

我正在我的應用程序中使用相機。 該應用程序允許您在TabView中的 TabView 的幫助下導航到此相機視圖。 但是，問題是，當我在相機視圖上時，我想讓TabView隱藏。 到目前為止，我一直在努力尋找解決方案，但似乎找不到任何解決方案。

這是代碼和帶有 tabview 的視圖的屏幕截圖

注意：如果預覽，屏幕截圖包含圖像。 當我在真實設備上運行它時，相機工作正常。 問題是我需要在進入相機視圖后隱藏標簽欄。

這是我正在使用的代碼示例：

import SwiftUI

struct AppView: View {
    var body: some View {
        TabView{
            Home()
                .tabItem {
                    // Add icon
                Text("Home")
            }

            MomentsCam()
                .tabItem {
                    // Add icon
                    Text("Camera")
            }.navigationBarHidden(true)

            Moments()
                .tabItem{
                    //Add icon
                     Text("Moments")
            }
        }
    }
}

Answer 1

我根據您的情況使用 TabView 更新了我的解決方案。 相同的想法：您正在使用ZStack和@State var selection 。 而這個想法是使用.opacity的TabView和YourCameraView （這僅僅是Image(systemName: "plus.circle")在我的例子）：

struct TabViewModel: View {

    @State var selection: Int = 0

    var body: some View {

        ZStack {
            GeometryReader { geometry in
                TabView(selection: self.$selection) {

                    Text("list")
                        .tabItem {
                            Image(systemName: "list.bullet.below.rectangle")
                    }.tag(0)

                    Text("plus")
                        .tabItem {
                            Image(systemName: "camera")
                    }.tag(1)

                    Text("more categories!")
                        .tabItem {
                            Image(systemName: "square.grid.2x2")
                    }.tag(2)
                }
                .opacity(self.selection == 1 ? 0.01 : 1)

                Image(systemName: "plus.circle")
                    .resizable()
                    .frame(width: 60, height: 60)
                    .shadow(color: .gray, radius: 2, x: 0, y: 5)
                    .offset(x: geometry.size.width / 2 - 30, y: geometry.size.height - 80)
                    .onTapGesture {
                        self.selection = 0
                }
                .opacity(self.selection == 1 ? 1 : 0)
            }

        }

    }
}

當你點擊相機 tabItem TabView變得不可見

Answer 2

您可以根據需要嘗試以下代碼。

  struct MomentsCam: View {
                var body: some View {
                    Text("Cam")
                }
            }

            struct Moments: View {
                var body: some View {
                    Text("Moments Cam")
                }
            }
            struct AppView: View {

                @State var  showCamera = false
                var body: some View {

                      GeometryReader{ p in
                    ZStack{
                    TabView{
                        Home()
                            .tabItem {
                                // Add icon
                            Text("Home")
                        }

                        Text("holder")
                            .tabItem {
                                // Add icon
                                Text("Camera")
                        }.navigationBarHidden(true).onAppear{
                            self.showCamera = true
                            print(p.size)
                        }

                        Moments()
                            .tabItem{
                                //Add icon
                                 Text("Moments")
                        }
                    }
                        if self.showCamera{
                    MomentsCam().frame(width: p.size.width, height: p.size.height).background(Color.white)
                            }
                        }
                    }
                }
            }