How to fix blurry images on NSButton in cocoa application?

Question

I have a couple of NSButtons which act like player controls (play, pause etc.) When I assign image to them, that image looks blurry.

  let playPauseButton: NSButton = {
    let btn = NSButton(frame: .zero)
    let image = NSImage(named: "pauseIcon")
    btn.imageScaling = NSImageScaling.scaleNone
    btn.image = image
    btn.setAccessibilityLabel("Pause")
    btn.isBordered = false
    return btn
}()

The image can be viewed on: https://www.dropbox.com/s/38tvh49ikc2m4x7/Play.pdf?dl=0

This image is .pdf, but I tried .png with 1x,2x and 3x, and it still looked blurry.

I also checked this question: Images in NSButton and NSImageView Blurred

But it did not help me either.

Answer 1

The solution was very simple.

1. Open the asset catalog.

2. Select all your assets that are blurry.

3. Open the attribute inspector by pressing: command + option + 4.

4. Check the box that says "Preserve vector data".

5. Under that checkbox, look for the "Scale" and set it to "Single scale"

Please note that this only works if your designer exported icons as a PDF file. Also, it wont work if you just convert .png or .jpg to .pdf, the actual vector image must be exported to .pdf.