#swift #image #swiftui #tooltip #popover
#swift #изображение #swiftui #всплывающая подсказка #всплывающее окно
Вопрос:
Хотел бы я сделать такую вещь, как показано на изображении.
Я пытаюсь использовать этот фрагмент кода, но я не совсем понимаю, как это исправить.
Я хотел бы использовать его на Button
или на ImageMac
, который должен быть изображением.
Кто-нибудь может мне помочь?
Код:
func showLittlePopoverWithMessage(sender: NSView, message: String) {
let controller = NSViewController()
controller.view = NSView(frame: CGRect(x: CGFloat(100), y: CGFloat(50), width: CGFloat(100), height: CGFloat(50)))
let popover = NSPopover()
popover.contentViewController = controller
popover.contentSize = controller.view.frame.size
popover.behavior = .transient
popover.animates = true
let invisibleWindow = NSWindow(contentRect: NSMakeRect(0, 0, 20, 5), styleMask: .borderless, backing: .buffered, defer: false)
invisibleWindow.backgroundColor = .red
invisibleWindow.alphaValue = 0
//controller.view.addSubview(sender)
popover.show(relativeTo: sender.bounds, of: sender as! NSView, preferredEdge: .maxY)
}
#if os(macOS)
struct ImageMac: View {
let symbol: String
init(systemName: String) {
self.symbol = [
"star": "☆",
"star.fill": "★",
"heart": "",
"heart.fill": "",
"video": "",
"lock.fill": "",
"lock.open.fill": "",
"checkmark.seal.fill": ""
][systemName] ?? "?"
}
var body: some View { Text(symbol) }
}
#endif
ImageMac(systemName: "checkmark.seal.fill").foregroundColor(.blue)
Button(action: {}) {
Text("Button")
}
Ответ №1:
Вот демонстрация возможного подхода. Подготовлено и протестировано с Xcode 11.7 / macOS 10.15.6
struct ContentView: View {
@State var isPopover = false
var body: some View {
VStack {
Button(action: { self.isPopover.toggle() }) {
Image(nsImage: NSImage(named: NSImage.infoName) ?? NSImage())
}.popover(isPresented: self.$isPopover, arrowEdge: .bottom) {
PopoverView()
}.buttonStyle(PlainButtonStyle())
}.frame(width: 800, height: 600)
}
}
struct PopoverView: View {
var body: some View {
VStack {
Text("Some text here ").padding()
Button("Resume") {
}
}.padding()
}
}
Комментарии:
1. Хотя в ответе действительно отображается всплывающее окно, кнопка Возобновить не закрывает его. Один из способов решить эту проблему — передать параметр состояния isPopover в качестве @Binding в PopoverView. Там можно переключить isPopover, чтобы закрыть представление.