從子視圖呈現模態視圖表

Question

我正在嘗試從從導航欄上的菜單項中選擇的子視圖中顯示一個工作表，但不顯示模態工作表。 我花了幾天時間嘗試調試，但無法確定問題所在。

對不起，這有點令人困惑，並且將顯示要重現的代碼的簡化版本。 但簡而言之，問題似乎是我作為主視圖一部分的工作表視圖。 從主視圖中刪除工作表代碼會顯示子視圖中的工作表。 不幸的是，我沒有更改 Mainview.swift 的自由

讓我展示一些代碼以使其易於理解......

首先，在展示代碼之前，重復問題的步驟：

1. 單擊導航欄中帶有 3 個點的圓圈
2. select 第二項（子視圖）
3. 單擊“編輯參數”按鈕，EditParameters() 視圖將不會顯示

ContentView.swift（只需調用 Mainview()）。 包含復制問題的代碼:-)

struct ContentView: View {
    var body: some View {
        NavigationView {
            VStack {
                Mainview()
            }
        }
    }
}

Mainview.swift。 這是實際應用程序的簡化版本，非常復雜，不幸的是，我在這里沒有太多改變的余地！

fileprivate enum CurrentView {
    case summary, sub
}
enum OptionSheet: Identifiable {
    var id: Self {self}
    case add
}
struct Mainview: View {
    @State private var currentView: CurrentView? = .summary
    @State private var showSheet: OptionSheet? = nil

    var body: some View {
        GeometryReader { g in
            content.frame(width: g.size.width, height: g.size.height)
                .navigationBarTitle("Main", displayMode: .inline)
        }
        //Removing the below sheet view will display the sheet from the subview but with this sheet here, it the sheet from subview does not work. This is required as these action items are accessed from the second menu item (circle and arrow) navigation baritem
        .sheet(item: $showSheet, content: { mode in
            sheetContent(for: mode)
        })
        .toolbar {
            HStack {
                trailingBarItems
                actionItems
            }
        }
    }
    
    var actionItems: some View {
        Menu {
            Button(action: {
                showSheet = .add
            }) {
                Label("Add Elements", systemImage: "plus")
            }
        } label: {
            Image(systemName: "cursorarrow.click").resizable()
            
        }
        
    }

    var trailingBarItems: some View {
        Menu {
            Button(action: {currentView = .summary}) {
                Label("Summary", systemImage: "list.bullet.rectangle")
            }
            Button(action: {currentView = .sub}) {
                Label("Subview", systemImage: "circle")
            }
        } label: {
            Image(systemName: "ellipsis.circle").resizable()
        }
    }
    
    @ViewBuilder
    func sheetContent(for mode: OptionSheet) -> some View {
        switch mode {
        case .add:
            AddElements()
        }
    }
    
    @ViewBuilder
    var content: some View {
        if let currentView = currentView {
            switch currentView {
            case .summary:
                SummaryView()
            case .sub:
                SubView()
            }
        }
    }
}

子視圖.swift。 這是包含不顯示工作表的“編輯參數”按鈕的文件。 我正在嘗試從此視圖顯示工作表。

struct SubView: View {
    @State private var editParameters: Bool = false
    var body: some View {
        VStack {
            Button(action: {
                editParameters.toggle()
            }, label: {
                HStack {
                    Image(systemName: "square.and.pencil")
                        .font(.headline)
                    Text("Edit Parameters")
                        .fontWeight(.semibold)
                        .font(.headline)
                }
            })
            .padding(10)
            .foregroundColor(Color.white)
            .background(Color(.systemBlue))
            .cornerRadius(20)
            .sheet(isPresented: $editParameters, content: {
                EditParameterView()
            })
            .padding()
            Text("Subview....")
        }
        .padding()
    }
}

編輯參數.swift。 這是按下“編輯參數”按鈕時應顯示的視圖

struct EditParameterView: View {
    var body: some View {
        Text("Edit Parameters...")
    }
}

摘要view.swift。 這里沒什么特別的。 只是為了完整性

struct SummaryView: View {
    var body: some View {
        Text("Summary View")
    }
}

Answer 1

在 SwiftUI 中，您不能在同一層次結構中有 2.sheet() 修飾符。 在這里，first.sheet() 修飾符位於 second.sheet() 的父視圖之一上。 簡單的解決方案是移動其中一個 the.sheets() 使其成為自己的層次結構。

您可以使用 ZStacks：

var body: some View {
    ZStack {
        GeometryReader { g in
            content.frame(width: g.size.width, height: g.size.height)
                .navigationBarTitle("Main", displayMode: .inline)
        }
        
        ZStack{ }
        .sheet(item: $showSheet, content: { mode in
            sheetContent(for: mode)
        })
    }
    .toolbar {
        HStack {
            trailingBarItems
            actionItems
        }
    }
}

或更優雅地：

   var body: some View {
        GeometryReader { g in
            content.frame(width: g.size.width, height: g.size.height)
                .navigationBarTitle("Main", displayMode: .inline)
        }
        .background(
            ZStack{ }
            .sheet(item: $showSheet, content: { mode in
                sheetContent(for: mode)
            })
        )
        .toolbar {
            HStack {
                trailingBarItems
                actionItems
            }
        }
    }