NSButton with round corners and background color

Question

I want a simple push button (the one with the round corners), and to add background to it. I\'ve tried 2 things:

1 - using a round button image: this is working good, un

Answer 1

OBJECTIVE-C solution (might help some guys stumble upon this thread)

This sublass extends IB - so you can IB control either:

• Background Color
• Background Color on Hover
• Title Color
• Title Color on Hover
• Corner Radius

It also includes a little alpha animation on hover.

New controls in IB (click to see screenshot)

//
//  SHFlatButton.h
//
//  Created by SH on 03.12.16.
//  Copyright © 2016 SH. All rights reserved.
//

#import 

@interface SHFlatButton : NSButton

@property (nonatomic, strong) IBInspectable NSColor *BGColor;
@property (nonatomic, strong) IBInspectable NSColor *TextColor;
@property (nonatomic, strong) IBInspectable NSColor *BGColorHover;
@property (nonatomic, strong) IBInspectable NSColor *TextColorHover;
@property (nonatomic) IBInspectable CGFloat CornerRadius;
@property (strong) NSCursor *cursor;

@end

And the implementation...

//
//  SHFlatButton.m
//
//  Created by SH on 03.12.16.
//  Copyright © 2016 SH. All rights reserved.
//

#import "SHFlatButton.h"

@implementation SHFlatButton

- (void)awakeFromNib
{
    if (self.TextColor)
        [self setAttributedTitle:[self textColor:self.TextColor]];

    if (self.CornerRadius)
    {
        [self setWantsLayer:YES];
        self.layer.masksToBounds = TRUE;
        self.layer.cornerRadius = self.CornerRadius;
    }
}


- (void)drawRect:(NSRect)dirtyRect
{
    if (self.BGColor)
    {
        [self.BGColor setFill];
        NSRectFill(dirtyRect);
    }

    [super drawRect:dirtyRect];
}


- (void)resetCursorRects
{
    if (self.cursor) {
        [self addCursorRect:[self bounds] cursor: self.cursor];
    } else {
        [super resetCursorRects];
    }
}


- (void)updateTrackingAreas {

    NSTrackingArea* trackingArea = [[NSTrackingArea alloc]
                                    initWithRect:[self bounds]
                                    options:NSTrackingMouseEnteredAndExited | NSTrackingActiveAlways
                                    owner:self userInfo:nil];
    [self addTrackingArea:trackingArea];
}


- (void)mouseEntered:(NSEvent *)theEvent{
    if ([self isEnabled]) {

        [[self animator]setAlphaValue:0.9];
        if (self.BGColorHover)
            [[self cell] setBackgroundColor:self.BGColorHover];
        if (self.TextColorHover)
            [self setAttributedTitle:[self textColor:self.TextColorHover]];
    }


}

- (void)mouseExited:(NSEvent *)theEvent{
    if ([self isEnabled]) {
        [[self animator]setAlphaValue:1];
        if (self.BGColor)
            [[self cell] setBackgroundColor:self.BGColor];
        if (self.TextColor)
            [self setAttributedTitle:[self textColor:self.TextColor]];
    }
}

- (NSAttributedString*)textColor:(NSColor*)color
{
    NSMutableParagraphStyle *style = [[NSMutableParagraphStyle alloc] init];
    [style setAlignment:NSCenterTextAlignment];
    NSDictionary *attrsDictionary  = [NSDictionary dictionaryWithObjectsAndKeys:
                                      color, NSForegroundColorAttributeName,
                                      self.font, NSFontAttributeName,
                                      style, NSParagraphStyleAttributeName, nil];
    NSAttributedString *attrString = [[NSAttributedString alloc]initWithString:self.title attributes:attrsDictionary];
    return attrString;
}

EDIT: Button MUST have border disabled!