Marco Chiang Marco Chiang - 1 year ago 144
Swift Question

Custom NSToolbarItem with Badge Counter

I'm trying to add a custom badge counter circle on a NSButton inside of a Custom NSToolbarItem.

It's supposed to look like this (with the red circle and a number inside):

enter image description here

I've tried doing it in the storyboard by adding a inline button but I don't have too much control over it's positioning and also having trouble setting a solid color to the badge.

Failed attempts:

enter image description here
enter image description here

Then I tried implementing this guys technique (I converted to swift3):

But the problem with this technique is that it subclasses the NSToolbarItem directly so I can't draw it outside the bounds of the NSButton. Here's the result:

enter image description here

I feel like I need to draw a custom view behind the NSButton so that it has space to draw the badge in the upper right without getting clipped. Any other ideas?

Answer Source

One option is to subclass either the toolbar item or the button and add a subview which draws the badge. Here's a forked version of your project which does this:

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download