NSTextField mit abgerundeten Ecken?

Question

Ich versuche, abgerundete Ecken um ein NSTextField zu zeichnen.

Ich habe NSTextField, versucht, den Code unten, aber ohne Erfolg ...

Irgendwelche Ideen

subclassed?

- (void)drawRect:(NSRect)dirtyRect 
{ 

    // black outline 
    NSRect blackOutlineFrame = NSMakeRect(0.0, 0.0, [self bounds].size.width, [self bounds].size.height-1.0); 
    NSGradient *gradient = nil; 
    if ([NSApp isActive]) { 
     gradient = [[NSGradient alloc] initWithStartingColor:[NSColor colorWithCalibratedWhite:0.24 alpha:1.0] endingColor:[NSColor colorWithCalibratedWhite:0.374 alpha:1.0]]; 
    } 
    else { 
     gradient = [[NSGradient alloc] initWithStartingColor:[NSColor colorWithCalibratedWhite:0.55 alpha:1.0] endingColor:[NSColor colorWithCalibratedWhite:0.558 alpha:1.0]]; 
    } 
    [gradient drawInBezierPath:[NSBezierPath bezierPathWithRoundedRect:blackOutlineFrame xRadius:5 yRadius:5] angle:90]; 

} 

Answer 1

Sie tun fast alles richtig. Sie müssen nur die Zelle und den Radius des textField ändern, die übereinstimmen. Werfen Sie einen Blick auf diese:

-(void)awakeFromNib { 

    [[self cell] setBezelStyle: NSTextFieldRoundedBezel]; 
} 


- (void)drawRect:(NSRect)dirtyRect 
{ 

    NSRect blackOutlineFrame = NSMakeRect(0.0, 0.0, [self bounds].size.width, [self bounds].size.height-1.0); 
    NSGradient *gradient = nil; 
    if ([NSApp isActive]) { 
     gradient = [[NSGradient alloc] initWithStartingColor:[NSColor colorWithCalibratedWhite:0.24 alpha:1.0] endingColor:[NSColor colorWithCalibratedWhite:0.374 alpha:1.0]]; 
    } 
    else { 
     gradient = [[NSGradient alloc] initWithStartingColor:[NSColor colorWithCalibratedWhite:0.55 alpha:1.0] endingColor:[NSColor colorWithCalibratedWhite:0.558 alpha:1.0]]; 
    } 

    [gradient drawInBezierPath:[NSBezierPath bezierPathWithRoundedRect:blackOutlineFrame xRadius:10 yRadius:10] angle:90]; 

} 

Dies funktioniert für mich schön.

Answer 2

Fügen Sie das QuartzCore-Framework in Ihr Projekt ein. Importieren <QuartzCore/QuartzCore.h> und verwenden Sie so etwas wie den folgenden Code (nur aus der Spitze von meinem Kopf):

UITextField *textField = [[UITextField alloc] initWithFrame:CGRectMake(0.0f, 0.0f, 100.0f, 20.0f)]; 
textField.layer.cornerRadius = 5.0f; 
textField.layer.masksToBounds = YES; 

Voilà, ein Textfeld mit abgerundeten Ecken :)

bearbeiten: gerade realisiert diese Frage zusammenhängt Mac OS X. überprüfen Sie bitte den folgenden Link: http://cocoatricks.com/2010/06/a-better-looking-text-field/

Edit 2: ein Beispielprojekt mit dem gerundeten Textfeld erstellt: http://dl.dropbox.com/u/6487838/RoundedTextField.zip

Answer 3

Es ist besser, NSTextFieldCell Unterklasse abgerundete Ecken zu zeichnen NSTextField Funktionalität zu erhalten, zum Beispiel:

- (void)drawWithFrame:(NSRect)cellFrame inView:(NSView *)controlView { 
    NSBezierPath *betterBounds = [NSBezierPath bezierPathWithRoundedRect:cellFrame xRadius:CORNER_RADIUS yRadius:CORNER_RADIUS]; 
    [betterBounds addClip]; 
    [super drawWithFrame:cellFrame inView:controlView]; 
    if (self.isBezeled) { 
     [betterBounds setLineWidth:2]; 
     [[NSColor colorWithCalibratedRed:0.510 green:0.643 blue:0.804 alpha:1] setStroke]; 
     [betterBounds stroke]; 
    } 
} 

ergibt ein schönes rundes Textfeld, das perfekt funktioniert (wenn Sie es gesetzt hatten ein Rechteck Lünette in denen zeichnen den ersten Platz, zumindest):

Answer 4

Die einfachste ist mit Interface Builder zu tun, wenn Sie die Ecken wollen von einigen Einheiten gerundet:

Wählen Sie einfach die Grenze als eine runde Sache:

Answer 5

Swift 3-Version von @Verious Codes, mit Eigenschaften editierbar im Interface Builder:

class RoundedTextFieldCell: NSTextFieldCell { 

    @IBInspectable var borderColor: NSColor = .clear 
    @IBInspectable var cornerRadius: CGFloat = 3 

    override func draw(withFrame cellFrame: NSRect, in controlView: NSView) { 
     let bounds = NSBezierPath(roundedRect: cellFrame, xRadius: cornerRadius, yRadius: cornerRadius) 
     bounds.addClip() 
     super.draw(withFrame: cellFrame, in: controlView) 
     if borderColor != .clear { 
      bounds.lineWidth = 2 
      borderColor.setStroke() 
      bounds.stroke() 
     } 
    } 
}