ios - radius - Cambiar UIButton BorderColor en Storyboard

view border radius swift

Question

Configuré CornerRadius y BorderWidth para el botón UI en los atributos de tiempo de ejecución definidos por el usuario. Sin agregar layer.borderColor funciona bien y muestra el borde en color negro. Pero cuando agregar layer.borderColor no funciona (no muestra borde).

Answer 1

¡Hay una manera mucho mejor de hacer esto! Deberías usar @IBInspectable. Echa un vistazo a la entrada del blog de Mike Woelmer aquí: https://spin.atomicobject.com/2017/07/18/swift-interface-builder/

¡Realmente agrega la función a IB en Xcode! Algunas de las capturas de pantalla en otras respuestas hacen que parezca que los campos existen en IB, pero al menos en Xcode 9 no. Pero siguiendo su publicación los agregaré.

Answer 2

En el caso de Swift, la función no funciona. Necesitará una propiedad calculada para lograr el resultado deseado:

extension CALayer {
var borderColorFromUIColor: UIColor {
get {
return UIColor(CGColor: self.borderColor!)
} set {
self.borderColor = newValue.CGColor
}
}
}

Answer 3

Esto funciona para mi.

Swift 3, Xcode 8.3

Extensión CALayer:

extension CALayer {
var borderWidthIB: NSNumber {
get {
return NSNumber(value: Float(borderWidth))
}
set {
borderWidth = CGFloat(newValue.floatValue)
}
}
var borderColorIB: UIColor? {
get {
return borderColor != nil ? UIColor(cgColor: borderColor!) : nil
}
set {
borderColor = newValue?.cgColor
}
}
var cornerRadiusIB: NSNumber {
get {
return NSNumber(value: Float(cornerRadius))
}
set {
cornerRadius = CGFloat(newValue.floatValue)
}
}

}

Answer 4

La explicación, tal vez perderse en algunas de las otras respuestas aquí:

La razón por la que no se establece esta propiedad es que layer.borderColor necesita un valor con el tipo CGColor .

¡Pero solo los tipos UIColor se pueden configurar a través de los atributos de tiempo de ejecución definidos por el usuario de Interface Builder!

Por lo tanto, debe establecer un UIColor en una propiedad proxy a través de Interface Builder, luego interceptar esa llamada para establecer el CGColor equivalente en la propiedad layer.borderColor .

Esto se puede lograr creando una Categoría en CALayer, configurando la Ruta de la Clave a una nueva "propiedad" borderColorFromUIColor ( borderColorFromUIColor ), y en la categoría anulando el setter correspondiente ( setBorderColorFromUIColor: .

Answer 5

Tengo Respuesta Cambiar layer.borderColor a layer.borderColorFromUIColor

y agregue el código en el archivo .m

#import <QuartzCore/QuartzCore.h>
@implementation CALayer (Additions)
- (void)setBorderColorFromUIColor:(UIColor *)color
{
self.borderColor = color.CGColor;
}
@end

Marque las propiedades en el Inspector de atributos

Answer 6

Para Swift:

Swift 3:

extension UIView {
@IBInspectable var cornerRadius: CGFloat {
get {
return layer.cornerRadius
}
set {
layer.cornerRadius = newValue
layer.masksToBounds = newValue > 0
}
}
@IBInspectable var borderWidth: CGFloat {
get {
return layer.borderWidth
}
set {
layer.borderWidth = newValue
}
}
@IBInspectable var borderColor: UIColor? {
get {
return UIColor(cgColor: layer.borderColor!)
}
set {
layer.borderColor = newValue?.cgColor
}
}
}

Swift 2.2:

extension UIView {
@IBInspectable var cornerRadius: CGFloat {
get {
return layer.cornerRadius
}
set {
layer.cornerRadius = newValue
layer.masksToBounds = newValue > 0
}
}
@IBInspectable var borderWidth: CGFloat {
get {
return layer.borderWidth
}
set {
layer.borderWidth = newValue
}
}
@IBInspectable var borderColor: UIColor? {
get {
return UIColor(CGColor: layer.borderColor!)
}
set {
layer.borderColor = newValue?.CGColor
}
}
}

Answer 7

Swift 4, Xcode 9.2 : utilice IBDesignable e IBInspectable para crear controles personalizados y previsualizar en vivo el diseño en Interface Builder.

Aquí hay un código de muestra en Swift, colóquelo justo debajo del UIKit en ViewController.swift:

@IBDesignable extension UIButton {
@IBInspectable var borderWidth: CGFloat {
set {
layer.borderWidth = newValue
}
get {
return layer.borderWidth
}
}
@IBInspectable var cornerRadius: CGFloat {
set {
layer.cornerRadius = newValue
}
get {
return layer.cornerRadius
}
}
@IBInspectable var borderColor: UIColor? {
set {
guard let uiColor = newValue else { return }
layer.borderColor = uiColor.cgColor
}
get {
guard let color = layer.borderColor else { return nil }
return UIColor(cgColor: color)
}
}
}

Si va a los Atributos inspeccionables de la vista, debe encontrar estas propiedades visualmente, edite las propiedades:

Los cambios también se reflejan en los atributos de tiempo de ejecución definidos por el usuario:

Corre en tiempo de construcción y ¡Voila! verá su botón redondeado claro con borde.