首页 > 解决方案 > 具有自定义视图的 NSMenuItem 在滚动时消失

问题描述

我用 NSMenuItem 实现了一个 NSMenu 并为其设置了自定义视图。当菜单可滚动时,鼠标悬停在 ▼ 按钮上滚动会导致某些 menuItem 消失(或无法正确绘制)。希望有人给我一些帮助。我会很感激的。

这是有关此问题的视频: https ://streamable.com/obbrbon

这是我的代码:

private func setupMenuItemView(_ menu: NSMenu) {
    let menuItemHeight: CGFloat = 20
    let menuWidth = frame.width
    let textFieldPadding: CGFloat = 10
    for menuItem in menu.items {
        guard !menuItem.title.isEmpty else { continue }
        let menuItemView = MenuItemView(frame: NSRect(x: 0, y: 0, width: Int(menuWidth), height: menuItemHeight))
        let textField = MenuItemTextField(labelWithString: menuItem.title)
        textField.frame = NSRect(
            x: textFieldPadding,
            y: (menuItemView.frame.height-textField.frame.height)/2,
            width: menuWidth-textFieldPadding*2,
            height: textField.frame.height
        )
        textField.lineBreakMode = .byTruncatingTail
        menuItemView.addSubview(textField)
        menuItemView.toolTip = menuItem.title
        menuItem.view = menuItemView
        menuItem.target = self
        menuItem.action = #selector(onMenuItemClicked(_:))
    }
}

fileprivate class MenuItemView: NSView {
    override func mouseUp(with event: NSEvent) {
        guard let menuItem = enclosingMenuItem else { return }
        guard let action = menuItem.action else { return }
        NSApp.sendAction(action, to: menuItem.target, from: menuItem)
        menuItem.menu?.cancelTracking()
    }

    override func draw(_ dirtyRect: NSRect) {
        guard let menuItem = enclosingMenuItem else { return }
        if menuItem.isHighlighted {
            NSColor.alternateSelectedControlColor.set()
        } else {
            NSColor.clear.set()
        }
        NSBezierPath.fill(dirtyRect)
        super.draw(dirtyRect)
    }
}

fileprivate class MenuItemTextField: NSTextField {
    override var allowsVibrancy: Bool {
        return false
    }
}

打电话后setupMenuItemView(),我打电话menu.popup()。希望这些信息有所帮助。

标签: swiftcocoaappkitnsmenunsmenuitem

解决方案


第二种可能的替代方法是使用带有下拉菜单的 NSPopUpButton,它通过更改文本颜色来适应 DarkMode。和以前一样,每个 menuItem.view 中都嵌入了一个子类文本字段,以支持文本截断和对齐。可以按照前面给出的说明在 Xcode 中运行。

import Cocoa

var view = [NSTextField]()

class TextField: NSTextField {

override func mouseDown(with event: NSEvent) {
 print("selected = \(self.tag)")
 for i:Int in 0..<view.count {
  if(self.tag == i) {
   view[i].backgroundColor = .lightGray
   } else {
   view[i].backgroundColor = .windowBackgroundColor
  }
 }
}

}

class AppDelegate: NSObject, NSApplicationDelegate {
var window:NSWindow!
var menu:NSMenu!
var pullDwn:NSPopUpButton!
var count:Int = 0

let _menuItemH : CGFloat = 20

func isDarkMode(view: NSView) -> Bool {
 if #available(OSX 10.14, *) {
  return view.effectiveAppearance.bestMatch(from: [.darkAqua, .aqua]) == .darkAqua
 }
 return false
}

@objc func myBtnAction(_ sender:Any ) {
 print(pullDwn.index(of:sender as! NSMenuItem))
}

func buildMenu() {
 let mainMenu = NSMenu()
 NSApp.mainMenu = mainMenu
 // **** App menu **** //
 let appMenuItem = NSMenuItem()
 mainMenu.addItem(appMenuItem)
 let appMenu = NSMenu()
 appMenuItem.submenu = appMenu
 appMenu.addItem(withTitle: "Quit", action:#selector(NSApplication.terminate), keyEquivalent: "q") 
}
    
func buildWnd() {
    
let _wndW : CGFloat = 400
let _wndH : CGFloat = 300

 window = NSWindow(contentRect:NSMakeRect(0,0,_wndW,_wndH),styleMask:[.titled, .closable, .miniaturizable, .resizable], backing:.buffered, defer:false)
 window.center()
 window.title = "Swift Test Window"
 window.makeKeyAndOrderFront(window)

// **** NSPopUpButton with Menu **** //
let menuItems = ["10%","25%","50%","75%","100%","200%","300%","400%","800%","longertext"]
pullDwn = NSPopUpButton(frame:NSMakeRect(80, _wndH - 50, 80, 30), pullsDown:true)
pullDwn.autoresizingMask = [.maxXMargin,.minYMargin]
let menu = pullDwn.menu
for mItem in menuItems{
 let menuItem = NSMenuItem()
 menu?.addItem(menuItem)
 menuItem.title = "Fit"
 let textField = TextField(frame:NSMakeRect( 0, 0, pullDwn.frame.size.width, _menuItemH))
 menuItem.view = textField
 textField.alignment = .left // .left, .center, .right
 textField.stringValue = mItem
 textField.lineBreakMode = .byTruncatingTail
 if (isDarkMode(view: textField)){
  textField.textColor = .white
 } else {
  textField.textColor = .black
 }
 textField.backgroundColor = .windowBackgroundColor
 textField.isEditable = false
 textField.tag = count
 textField.isBordered = false
 textField.font = NSFont( name:"Menlo", size:14 )
 count = count + 1
 view.append(textField) 
}
window.contentView!.addSubview (pullDwn)

// **** Quit btn **** //
let quitBtn = NSButton (frame:NSMakeRect( _wndW - 50, 10, 40, 40 ))
 quitBtn.bezelStyle = .circular
 quitBtn.autoresizingMask = [.minXMargin,.maxYMargin]
 quitBtn.title = "Q"
 quitBtn.action = #selector(NSApplication.terminate)
 window.contentView!.addSubview(quitBtn)
}
 
func applicationDidFinishLaunching(_ notification: Notification) {
 buildMenu()
 buildWnd()
}

func applicationShouldTerminateAfterLastWindowClosed(_ sender: NSApplication) -> Bool {
 return true
}

}
let appDelegate = AppDelegate()

// **** main.swift **** //
let app = NSApplication.shared
app.delegate = appDelegate
app.setActivationPolicy(.regular)
app.activate(ignoringOtherApps:true)
app.run()



推荐阅读