color ios uiview interface-builder border

ios - color - shadow view swift 4



¿Es posible establecer propiedades de borde UIView desde el constructor de interfaz? (8)

En realidad, puede establecer algunas propiedades de la capa de una vista a través del constructor de interfaz. Sé que puedo establecer borderWidth y cornerRadius de una capa a través de xcode. borderColor no funciona, probablemente porque la capa quiere un CGColor en lugar de un UIColor.

Puede que tenga que usar cadenas en lugar de números, ¡pero funciona!

layer.cornerRadius layer.borderWidth layer.borderColor

Actualización: seleccione el Tipo apropiado para Keypath:

¿Es posible controlar las propiedades del borde de UIView (color, grosor, etc.) directamente desde el constructor de interfaz o solo puedo hacerlo programáticamente?


La respuesta de Rich86Man es correcta, pero puede usar categorías para propiedades de proxy como layer.borderColor. (Del ConventionalC CocoaPod)

CALayer + XibConfiguration.h:

#import <QuartzCore/QuartzCore.h> #import <UIKit/UIKit.h> @interface CALayer(XibConfiguration) // This assigns a CGColor to borderColor. @property(nonatomic, assign) UIColor* borderUIColor; @end

CALayer + XibConfiguration.m:

#import "CALayer+XibConfiguration.h" @implementation CALayer(XibConfiguration) -(void)setBorderUIColor:(UIColor*)color { self.borderColor = color.CGColor; } -(UIColor*)borderUIColor { return [UIColor colorWithCGColor:self.borderColor]; } @end

layer.borderUIColor

El resultado será evidente durante el tiempo de ejecución, no en Xcode.

Editar : también necesita establecer layer.borderWidth en al menos 1 para ver el borde con el color elegido.

En Swift 2.0:

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

En Swift 3.0:

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


Para Swift 3 y 4 , si está dispuesto a usar s de IBInspectable , hay esto:

@IBDesignable extension UIView { @IBInspectable var borderColor:UIColor? { set { layer.borderColor = newValue!.cgColor } get { if let color = layer.borderColor { return UIColor(cgColor: color) } else { return nil } } } @IBInspectable var borderWidth:CGFloat { set { layer.borderWidth = newValue } get { return layer.borderWidth } } @IBInspectable var cornerRadius:CGFloat { set { layer.cornerRadius = newValue clipsToBounds = newValue > 0 } get { return layer.cornerRadius } } }


Por favor agrega estas 2 líneas simples de código:

self.YourViewName.layer.cornerRadius = 15 self.YourViewName.layer.masksToBounds = true

Funcionará bien.


Puede crear una categoría de UIView y agregarla en el archivo .h de la categoría

@property (nonatomic) IBInspectable UIColor *borderColor; @property (nonatomic) IBInspectable CGFloat borderWidth; @property (nonatomic) IBInspectable CGFloat cornerRadius;

Ahora agrega esto en el archivo .m

@dynamic borderColor,borderWidth,cornerRadius;

y esto también en. m archivo

-(void)setBorderColor:(UIColor *)borderColor{ [self.layer setBorderColor:borderColor.CGColor]; } -(void)setBorderWidth:(CGFloat)borderWidth{ [self.layer setBorderWidth:borderWidth]; } -(void)setCornerRadius:(CGFloat)cornerRadius{ [self.layer setCornerRadius:cornerRadius]; }

ahora verá esto en su guión gráfico para todas las subclases de UIView (UILabel, UITextField, UIImageView, etc.)

Eso es ... No es necesario importar categoría en ningún lado, simplemente agregue los archivos de la categoría en el proyecto y vea estas propiedades en el guión gráfico.


Si desea ahorrar tiempo, simplemente use dos UIViews uno encima del otro, el que está en la parte posterior es el color del borde, y el que está en el frente más pequeño, dando el efecto bordeado. No creo que esta sea una solución elegante tampoco, pero si a Apple le importa un poco más, entonces no deberías tener que hacer esto.


aunque esto podría establecer las propiedades, en realidad no se refleja en IB. Entonces, si esencialmente escribes código en IB, también podrías hacerlo en tu código fuente


Respuesta similar a la de iHulk, pero en Swift

Agregue un archivo llamado UIView.swift en su proyecto (o simplemente péguelo en cualquier archivo):

import UIKit @IBDesignable extension UIView { @IBInspectable var borderColor: UIColor? { set { layer.borderColor = newValue?.cgColor } get { guard let color = layer.borderColor else { return nil } return UIColor(cgColor: color) } } @IBInspectable var borderWidth: CGFloat { set { layer.borderWidth = newValue } get { return layer.borderWidth } } @IBInspectable var cornerRadius: CGFloat { set { layer.cornerRadius = newValue clipsToBounds = newValue > 0 } get { return layer.cornerRadius } } }

Luego, estará disponible en Interface Builder para cada botón, imageView, etiqueta, etc. en el Panel de utilidades> Atributo Inspector:

Nota: el borde solo aparecerá en tiempo de ejecución.