SwiftUI：在主视图上显示模态（实际上不是模态）视图时，如何限制视图的可点击区域？

Question

I am developing an app based on a Tabview with three TabItems. Each TabItem is a List and I would be able to show a kind of modal view over those Lists. The problem becomes when I can not call a Sheet as modal view because Sheets are almost full windowed. I need some kind of bottom modal view, so I create a View that I present over a List with higher ZIndex. It seems to work until you click in the tabbar and select another TabItem having deployed the "modal" view. The error is:

[TableView] Warning once only: UITableView was told to layout its visible cells and other contents without being in the view hierarchy (the table view or one of its superviews has not been added to a window). This may cause bugs by forcing views inside the table view to load and perform layout without accurate information (eg table view bounds, trait collection, layout margins, safe area insets, etc), and will also cause unnecessary performance overhead due to extra layout passes.

So, I would like as solution to restrict the tappable area to the "modal" view area. ¿Is there a way to achieve this?

Answer 1

Probably you have some condition state depending on which you present your "modal-like" view, so depending on the same condition you can disable below TabView, like below

TabView {
// ... tabs content here
}.disabled(showingModal)

Update: Here is a demo of approach that I meant (tested with Xcode 11.3+)

struct TestTabViewModal: View {
    @State private var selectedTab = 0
    @State private var modalShown = false
    var body: some View {
        ZStack {
            TabView(selection: $selectedTab) {
                VStack {
                    Button("Show Modal") { self.modalShown = true }
                        .padding(.top, 40)
                    Spacer()
                }
                .tabItem {
                    Image(systemName: "1.circle")
                }.tag(0)

                Text("2").tabItem {
                    Image(systemName: "1.circle")
                }.tag(1)
            }.disabled(modalShown)

            if modalShown {
                RoundedRectangle(cornerRadius: 10)
                    .fill(Color.yellow)
                    .frame(width: 320, height: 240)
                    .overlay(Button("CloseMe") { self.modalShown = false })
            }
        }
    }
}