CODEWITHSUNDEEP
swiftcocoaappkitnsimagensbutton
adincebic
adincebic

Reputation: 91

How to fix blurry images on NSButton in cocoa application?

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.

Upvotes: 2

Views: 490

Answers (2)

adincebic
adincebic

Reputation: 91

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.

Upvotes: 3

Keith Knauber
Keith Knauber

Reputation: 802

Here are a number of to try that have fixed blurry edges for me in the past.

  1. Assuming you're running in Mojave and/or using layer backed views, be sure that the NSButton draws its own background color ( setDrawsBackground YES ). Otherwise what can happen with CoreAnimation CALayer is that the blending operation of the NSImage background alpha is substandard/wrong.
  2. This shouldn't apply to an NSImage, but maybe its worth a shot: http://stackoverflow.com/questions/5722085/nsbezierpath-rounded-rectangle-has-bad-corners
  3. [nsImage setScalesWhenResized:NO];
  4. try different NSCompositingOperation NSCompositeCopy vs. NSCompositeSourceOver

Upvotes: 0

Related Questions