NSButton с круглыми углами и цветом фона

Мне нужна простая кнопка (одна с круглыми углами) и добавление к ней фона. Я пробовал 2 вещи:

1 - используя круглое изображение кнопки: это работает хорошо, пока мне не нужно масштабировать кнопку, из-за которой круглые части выглядят уродливо.

2 - расширение кнопки и добавление цвета к ней - но тогда у меня возникают проблемы, когда я нажимаю кнопку - я хочу, чтобы состояние "нажатие" было того же цвета, что и "обычное" состояние, но это не так.

это код, который я использую для продления кнопки:

 override func drawRect(dirtyRect: NSRect)
    {
        if let bgColor = bgColor {
            self.layer?.cornerRadius = 4
            self.layer?.masksToBounds = true
            self.layer?.backgroundColor = bgColor.CGColor
            bgColor.setFill()

            NSRectFill(dirtyRect)
        }

        super.drawRect(dirtyRect)
    }

Во всяком случае, ни подход 1, ни 2 не работал, так как я могу это достичь? Просто простая кнопка.: (

EDIT: Я спрашиваю о OSX

Ответы

Ответ 1

Переопределить метод NSWuttonCell drawWithFrame:

func drawWithFrame(cellFrame: NSRect, inView controlView: NSView) {
    var border = NSBezierPath(roundedRect: NSInsetRect(cellFrame, 0.5, 0.5), xRadius: 3, yRadius: 3)
    NSColor.greenColor().set()
    border.fill()

    var style = NSParagraphStyle.defaultParagraphStyle()
    style.alignment = NSCenterTextAlignment
    var attr = [NSParagraphStyleAttributeName : style, NSForegroundColorAttributeName : NSColor.whiteColor()]

    self.title.drawInRect(cellFrame, withAttributes: attr)
}

Ответ 2

Вам нужно переопределить функцию layoutSubviews, т.е.

override func layoutSubviews() {
        self.layer.cornerRadius = self.frame.height/2
        self.layer.borderColor = UIColor.blue.cgColor
        self.layer.borderWidth = 2
    }

Я выполнил образец проекта здесь. Весь ваш связанный код был написан в button.swift, и он находится в быстрой 3. Кроме того, я не задал фоновое изображение для кнопки, я оставляю эту задачу до вас.

P.S.: Ответ ниже для UIButton, а не NSButton. Вероятно, некоторые из них будут действительны, возможно, не все...

Ответ 3

Я сделал кнопку и добился успеха. Это выглядит так:

код:

override func draw(_ dirtyRect: NSRect) {
    super.draw(dirtyRect)
    // Drawing code here.
    if let bgColor = bgColor {
        self.layer?.cornerRadius = 4
        self.layer?.masksToBounds = true
        self.layer?.backgroundColor = bgColor.cgColor
        bgColor.setFill()
        NSRectFill(dirtyRect)
    }
}

drawRect заменяется на draw, а CGColor заменяется на cgColor. Разница между твоей и моей - это порядок. Вы назвали super.draw(dirtyRect) последним, и я назвал его первым. Возможно, ваша кнопка выглядит так:

Я надеюсь, что это может решить вашу проблему.

Ответ 4

Если вы хотите, чтобы кнопка была закруглена, откройте свою основную страницу, нажмите кнопку и нажмите "Показать инспектор по идентификации". В разделе "Пользовательские атрибуты времени выполнения дважды щелкните значок" + "и измените код таким образом:

Ответ 5

OBJECTIVE-C (может помочь некоторым парням наткнуться на этот поток)

Эта подслоя расширяет IB - так что вы можете управлять IB:

Цвет фона
Цвет фона при наведении курсора
Цвет заголовка
Цвет заголовка при наведении указателя мыши
Угловой радиус

Он также включает небольшую альфа-анимацию при зависании.

Новые элементы управления в IB (щелкните, чтобы увидеть скриншот)

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

#import <Cocoa/Cocoa.h>

@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

И реализация...

//
//  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: кнопка ДОЛЖНА отключить границу!

Ответ 6

Простая 3-строчная функция.

@IBOutlet weak var button: UIButton!

func setButton(color: UIColor, title: String)  {
    button.backgroundColor = color
    button.setTitle(title, forState: .Normal)
    button.layer.cornerRadius = 8.0
}

и назовите его таким образом

 setButton(UIColor.redColor(), title: "Hello")

Ответ 7

просто попробуйте добавить эти две строки кода в свою функцию. Я думаю, что вы получаете проблемы с шириной границы.

переопределить func drawRect (dirtyRect: NSRect)

{
    if let bgColor = bgColor {
        self.layer?.cornerRadius = 4
        self.layer?.masksToBounds = true
        self.layer?.backgroundColor = bgColor.CGColor
        self.layer?.borderColor = UIColor.blackcolor()
        self.layer?.borderWidth = 2.0

        bgColor.setFill()

        NSRectFill(dirtyRect)
    }

    super.drawRect(dirtyRect)
}