我想在 Swift UI 中使用带有按钮的多个弹出窗口

I want to use multiple popovers with buttons in the Swift UI

在 SwiftUI 中使用带按钮的 Popover 时,我想使用多个按钮弹出,如下所示,但实际上只有上部按钮 我拿不到弹出窗口。如果你想分别弹出两者怎么办?

struct MySelection: Identifiable {
        let id = UUID()
        var text = ""
    }
    
    struct PopoverTest: View {
        @State var selected: MySelection?
        
        var body: some View {
            VStack (spacing: 88) {
                // First Button
                Button(action: {
                    selected = MySelection(text: "Popover1")
                }, label: {
                    Image(systemName: "stopwatch")
                })
                // Second Button
                Button(action: {
                    selected = MySelection(text: "Popover2")
                }, label: {
                    Image(systemName: "globe")
                })
            }
            .buttonStyle(.plain)
            .popover(item: $selected) { selection in
                Text(selection.text).font(.largeTitle)
            }
        }
        
    }

在这种情况下,您似乎必须引入 2 个 selected 变量。 optional selected 可以将不同的值交给popover,但是如果是从不同的subview触发,SwiftUI不知道把popover锚定到哪里。

struct ContentView: View {
    @State var selected1: MySelection?
    @State var selected2: MySelection?

    var body: some View {
        VStack (spacing: 88) {
            
            // First Button
            Button(action: {
                selected1 = MySelection(text: "Popover1")
            }, label: {
                Image(systemName: "stopwatch")
            })
            .popover(item: $selected1) { selection in
                Text(selection.text).font(.largeTitle)
            }
            
            // Second Button
            Button(action: {
                selected2 = MySelection(text: "Popover2")
            }, label: {
                Image(systemName: "globe")
            })
            .popover(item: $selected2) { selection in
                Text(selection.text).font(.largeTitle)
            }
        }
        .buttonStyle(.plain)
    }
}

仔细想想,更好的方法可能是创建一个可以在任何地方使用的自定义“带弹出窗口的按钮”视图:

struct ContentView: View {

    var body: some View {
        VStack (spacing: 88) {
            
            // First Button
            ButtonWithPopover(image: "stopwatch",
                              item: MySelection(text: "Popover1"))
            
            // Second Button
            ButtonWithPopover(image: "globe",
                              item: MySelection(text: "Popover2"))
        }
        .buttonStyle(.plain)
    }
}


struct ButtonWithPopover: View {
    
    let image: String
    let item: MySelection
    
    @State var selected: MySelection?
    
    var body: some View {
        Button(action: {
            selected = item
        }, label: {
            Image(systemName: image)
        })
        .popover(item: $selected) { selection in
            Text(selection.text).font(.largeTitle)
        }
    }
}