Nhiều trang tính (được xuất hiện :) không hoạt động trong SwiftUI

Tôi có ContentView này với hai chế độ xem phương thức khác nhau, vì vậy tôi đang sử dụng sheet(isPresented:)cho cả hai, nhưng dường như chỉ có cái cuối cùng được trình bày. Làm thế nào tôi có thể giải quyết vấn đề này? Hoặc không thể sử dụng nhiều trang tính trên một chế độ xem trong SwiftUI?

struct ContentView: View {

    @State private var firstIsPresented = false
    @State private var secondIsPresented = false

    var body: some View {

        NavigationView {
            VStack(spacing: 20) {
                Button("First modal view") {
                    self.firstIsPresented.toggle()
                }
                Button ("Second modal view") {
                    self.secondIsPresented.toggle()
                }
            }
            .navigationBarTitle(Text("Multiple modal view problem"), displayMode: .inline)
            .sheet(isPresented: $firstIsPresented) {
                    Text("First modal view")
            }
            .sheet(isPresented: $secondIsPresented) {
                    Text("Only the second modal view works!")
            }
        }
    }
}

Đoạn mã trên biên dịch mà không có cảnh báo (Xcode 11.2.1).

Vui lòng thử mã dưới đây

enum ActiveSheet {
   case first, second
}

struct ContentView: View {

    @State private var showSheet = false
    @State private var activeSheet: ActiveSheet = .first

    var body: some View {

        NavigationView {
            VStack(spacing: 20) {
                Button("First modal view") {
                    self.showSheet = true
                    self.activeSheet = .first
                }
                Button ("Second modal view") {
                    self.showSheet = true
                    self.activeSheet = .second
                }
            }
            .navigationBarTitle(Text("Multiple modal view problem"), displayMode: .inline)
            .sheet(isPresented: $showSheet) {
                if self.activeSheet == .first {
                    Text("First modal view")
                }
                else {
                    Text("Only the second modal view works!")
                }
            }
        }
    }
}

Trường hợp của bạn có thể được giải quyết bằng cách sau (được thử nghiệm với Xcode 11.2)

var body: some View {

    NavigationView {
        VStack(spacing: 20) {
            Button("First modal view") {
                self.firstIsPresented.toggle()
            }
            .sheet(isPresented: $firstIsPresented) {
                    Text("First modal view")
            }
            Button ("Second modal view") {
                self.secondIsPresented.toggle()
            }
            .sheet(isPresented: $secondIsPresented) {
                    Text("Only the second modal view works!")
            }
        }
        .navigationBarTitle(Text("Multiple modal view problem"), displayMode: .inline)
    }
}

Cũng có thể thêm trang tính vào một EmptyView được đặt trong nền của chế độ xem. Điều này có thể được thực hiện nhiều lần:

  .background(EmptyView()
        .sheet(isPresented: isPresented, content: content))

Bạn có thể thực hiện việc này đơn giản bằng cách nhóm các nút và các cuộc gọi .sheet lại với nhau. Nếu bạn có một hàng đầu và một dấu vết thì thật đơn giản. Tuy nhiên, nếu bạn có nhiều thanh điều hướng trong đầu hoặc cuối, bạn cần bọc chúng trong HStack và cũng bọc từng nút bằng lệnh gọi bảng tính trong VStack.

Đây là một ví dụ về hai nút đuôi:

            trailing:
            HStack {
                VStack {
                    Button(
                        action: {
                            self.showOne.toggle()
                    }
                    ) {
                        Image(systemName: "camera")
                    }
                    .sheet(isPresented: self.$showOne) {
                        OneView().environment(\.managedObjectContext, self.managedObjectContext)
                    }
                }//showOne vstack

                VStack {
                    Button(
                        action: {
                            self.showTwo.toggle()
                    }
                    ) {
                        Image(systemName: "film")
                    }
                    .sheet(isPresented: self.$showTwo) {
                        TwoView().environment(\.managedObjectContext, self.managedObjectContext)
                    }
                }//show two vstack
            }//nav bar button hstack

Ngoài câu trả lời của Rohit Makwana , tôi đã tìm ra cách trích xuất nội dung trang tính thành một hàm vì trình biên dịch đang gặp khó khăn trong việc kiểm tra loại khổng lồ của tôi View.

extension YourView {
    enum Sheet {
        case a, b
    }

    @ViewBuilder func sheetContent() -> some View {
        if activeSheet == .a {
            A()
        } else if activeSheet == .b {
            B()
        }
    }
}

Bạn có thể sử dụng nó theo cách này:

.sheet(isPresented: $isSheetPresented, content: sheetContent)

Nó làm cho mã sạch hơn và cũng làm giảm căng thẳng của trình biên dịch của bạn.