NSPopupButton that displays image not text of selected item

Question

I am creating a NSPopUpButton that has multiple NSMenuItems each with an image and a title. The functionality I am trying to create is as such: When the popup is displaying I would like it to behave normally, displaying the title and image, however when the popup is closed I would like the button to show only the image of the selected item. Much like how the Calendars Mac app behaves.

Any help would be greatly appreciated.

`NSPopUpButton` is a subclass of `NSButton`. Did you try to set the title and image when an item is selected? — Willeke, Jul 29 '17 at 09:12

score 6 · Accepted Answer · answered Jul 29 '17 at 18:50

All you have to do is to set popupButton.imagePosition = .imageOnly. Here's an example:

func swatch(size: NSSize, color: NSColor) -> NSImage {
    let image = NSImage(size: size)
    image.lockFocus()
    color.drawSwatch(in: NSMakeRect(0, 0, size.width, size.height))
    image.unlockFocus()

    return image
}

override func viewDidLoad() {
    super.viewDidLoad()

    let homeItem = NSMenuItem(title: "Home", action: nil, keyEquivalent: "")
    let workItem = NSMenuItem(title: "Work", action: nil, keyEquivalent: "")
    let familityItem = NSMenuItem(title: "Family", action: nil, keyEquivalent: "")

    let size = NSSize(width: 12, height: 12)
    homeItem.image = swatch(size: size, color: .blue)
    workItem.image = swatch(size: size, color: .purple)
    familityItem.image = swatch(size: size, color: .orange)

    let menu = NSMenu()
    menu.addItem(homeItem)
    menu.addItem(workItem)
    menu.addItem(familityItem)
    popupButton.menu = menu
    popupButton.imagePosition = .imageOnly
}

Worked perfect, I knew I was missing something easy. Thanks! — Shea Sullivan, Aug 01 '17 at 15:10

NSPopupButton that displays image not text of selected item

1 Answers1