Wonder if anyone has experienced this. When generating png image icons for macos. its recommended at 19x19 pixels. However, based on that, the icon (shield) that is generated is pixellated compared with the next in line. I have tried using 38x38, which effectively doubles the pixels. It looks much finer in preview but when attached, it because a large icon cropped off the bottom. Are there are specifics to generating a retina compatible icon for mac status bar?

screenshot of menu bar

  • 1
    $\begingroup$ Sounds like a UI programming question $\endgroup$ – Simon F Oct 30 '18 at 8:23
  • $\begingroup$ hmm I did think it was but the issue is more on resolution of the image? $\endgroup$ – Jimmy M.G. Lim Oct 30 '18 at 17:21

The issue is the difference between pixel and point sizes. On macOS and other Apple platforms, the user interface is measured in points, which don’t necessarily map one-to-one to pixels; on a Retina screen like the one you’re using, 1 point is 2 pixels. Since there’s no way for the system to know whether your image’s scale is the same as the screen’s, it’s assuming that each pixel in your larger image is meant to be one point.

One way to resolve this would be to explicitly set the size property on your NSImage to the point size your image is supposed to be drawn at, i.e. 19×19; you’d have to handle loading different images for 1x and 2x screens on your own, though, which is inconvenient. A better way would be to use an asset catalog in your project, which will let you specify assets for 1x and 2x screens and allow you to load the appropriate image by name.

As Simon F pointed out, future questions in this vein probably belong on Stack Overflow—it’s more about API usage than graphics concepts.

  • $\begingroup$ thats a good note and clear explanation, Noah. thanks for this. $\endgroup$ – Jimmy M.G. Lim Nov 2 '18 at 14:56

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.