ios - framework - Dando esquinas redondeadas UIView

frameworks para ios

Question

Mi vista de inicio de sesión tiene una subvista que tiene un UIActivityView y un UILabel dice " UILabel ...". Esta subvista tiene esquinas que no están redondeadas. ¿Cómo puedo hacerlos redondos?

¿Hay alguna manera de hacerlo dentro de mi xib?

Answer 1

Rápido

Respuesta corta:

myView.layer.cornerRadius = 8
myView.layer.masksToBounds = true // optional

Respuesta suplementaria

Si ha llegado a esta respuesta, es probable que ya haya visto lo suficiente como para resolver su problema. Estoy agregando esta respuesta para dar un poco más de explicación visual de por qué las cosas hacen lo que hacen.

Si comienzas con una vista normal, tiene esquinas cuadradas.

let blueView = UIView()
blueView.frame = CGRect(x: 100, y: 100, width: 100, height: 50)
blueView.backgroundColor = UIColor.blueColor()
view.addSubview(blueView)

Puedes darle esquinas redondeadas cambiando la propiedad cornerRadius de la layer de la vista.

blueView.layer.cornerRadius = 8

Los valores de radio más grandes dan esquinas más redondeadas

blueView.layer.cornerRadius = 25

Y los valores más pequeños dan esquinas menos redondeadas.

blueView.layer.cornerRadius = 3

Esto podría ser suficiente para resolver su problema allí mismo. Sin embargo, a veces una vista puede tener una subvista o una subcapa que se sale de los límites de la vista. Por ejemplo, si tuviera que añadir una subvista como esta

let mySubView = UIView()
mySubView.frame = CGRect(x: 20, y: 20, width: 100, height: 100)
mySubView.backgroundColor = UIColor.redColor()
blueView.addSubview(mySubView)

o si tuviera que añadir una subcapa como esta

let mySubLayer = CALayer()
mySubLayer.frame = CGRect(x: 20, y: 20, width: 100, height: 100)
mySubLayer.backgroundColor = UIColor.redColor().CGColor
blueView.layer.addSublayer(mySubLayer)

Entonces terminaría con

Ahora, si no quiero que las cosas cuelguen fuera de los límites, puedo hacer esto

blueView.clipsToBounds = true

o esto

blueView.layer.masksToBounds = true

lo que da este resultado:

Ambos clipsToBounds y masksToBounds son equivalent . Es solo que el primero se usa con UIView y el segundo se usa con CALayer .

Ver también

• Como agregar bordes y sombras.
• Caminos bezier
• Transformations

Answer 2

Swift 4 - Utilizando IBDesignable

 @IBDesignable
class DesignableView: UIView {
}
extension UIView
{
@IBInspectable
var cornerRadius: CGFloat {
get {
return layer.cornerRadius
}
set {
layer.cornerRadius = newValue
}
}
}

Answer 3

Ahora puede usar una categoría rápida en UIView (código debajo de la imagen) con @IBInspectable para mostrar el resultado en el guión gráfico (si está usando la categoría, use solo cornerRadius y no layer.cornerRadius como ruta clave).

extension UIView {
@IBInspectable var cornerRadius: CGFloat {
get {
return layer.cornerRadius
}
set {
layer.cornerRadius = newValue
layer.masksToBounds = newValue > 0
}
}
}

Answer 4

Como se describe en esta publicación del blog , aquí hay un método para redondear las esquinas de una UIView:

+(void)roundView:(UIView *)view onCorner:(UIRectCorner)rectCorner radius:(float)radius
{
UIBezierPath *maskPath = [UIBezierPath bezierPathWithRoundedRect:view.bounds
byRoundingCorners:rectCorner
cornerRadii:CGSizeMake(radius, radius)];
CAShapeLayer *maskLayer = [[CAShapeLayer alloc] init];
maskLayer.frame = view.bounds;
maskLayer.path = maskPath.CGPath;
[view.layer setMask:maskLayer];
[maskLayer release];
}

La parte interesante de esto es que puedes seleccionar qué esquinas quieres redondear hacia arriba.

Answer 5

EN Xcode 6 tu intento

 self.layer.layer.cornerRadius = 5.0f;

o

 self.layer.layer.cornerRadius = 5.0f;
self.layer.clipsToBounds = YES;

Answer 6

Establezca la propiedad de la esquina para la vista redonda

el valor booleano set masksToBounds para la imagen aún no se dibujará fuera del límite del radio de la esquina

view.layer.cornerRadius = 5;
view.layer.masksToBounds = YES;

Answer 7

Hacer esto programáticamente en obj c

UIView *view = [[UIView alloc] initWithFrame:CGRectMake(20, 50, 200, 200)];
view.layer.backgroundColor = [UIColor whiteColor].CGColor;
view.layer.cornerRadius = 20.0;
view.layer.frame = CGRectInset(v.layer.frame, 20, 20);
[view.layer.shadowOffset = CGSizeMake(1, 0);
view.layer.shadowColor = [[UIColor blackColor] CGColor];
view.layer.shadowRadius = 5;
view.layer.shadowOpacity = .25;][1]
[self.view addSubview:view];

También podemos hacer esto desde el stoaryboard.

 layer.cornerRadius Number 5

Answer 8

Por favor, importe el Quartzcore framework entonces tiene que establecer setMaskToBounds en TRUE esta es una línea muy importante.

Entonces: [[yourView layer] setCornerRadius:5.0f];

Answer 9

Primero debe importar el archivo de encabezado <QuartzCore/QuartzCore.h>

 #import QuartzCore/QuartzCore.h>
[yourView.layer setCornerRadius:8.0f];
yourView.layer.borderColor = [UIColor redColor].CGColor;
yourView.layer.borderWidth = 2.0f;
[yourView.layer setMasksToBounds:YES];

No deje de usar - setMasksToBounds , de lo contrario, es posible que no se muestre el efecto.

Answer 10

Prueba esto

#import <QuartzCore/QuartzCore.h> // not necessary for 10 years now :)

...

view.layer.cornerRadius = 5;
view.layer.masksToBounds = true;

Nota: Si está intentando aplicar esquinas redondeadas a la vista de un UIViewController , no debe aplicarse en el constructor del controlador de la vista, sino en -viewDidLoad , después de que la view esté realmente instanciada.

Answer 11

Puede usar la siguiente clase UIView personalizada que también puede cambiar el color y el ancho del borde. Como se trata de IBDesignalbe , también puede cambiar los atributos en el constructor de interfaces.

import UIKit
@IBDesignable public class RoundedView: UIView {
@IBInspectable var borderColor: UIColor = UIColor.white {
didSet {
layer.borderColor = borderColor.cgColor
}
}
@IBInspectable var borderWidth: CGFloat = 2.0 {
didSet {
layer.borderWidth = borderWidth
}
}
@IBInspectable var cornerRadius: CGFloat = 0.0 {
didSet {
layer.cornerRadius = cornerRadius
}
}
}

Answer 12

También puede usar la característica Atributos de tiempo de ejecución definidos por el usuario del generador de interfaz para establecer la ruta de acceso layer.cornerRadius en un valor. Asegúrate de incluir la biblioteca QuartzCore .

Este truco también funciona para configurar layer.borderWidth, sin embargo, no funcionará para layer.borderColor ya que se espera un CGColor no un UIColor .

No podrá ver los efectos en el guión gráfico porque estos parámetros se evalúan en tiempo de ejecución.

Answer 13

También puedes usar una imagen:

UIImage *maskingImage = [UIImage imageNamed:@"bannerBarBottomMask.png"];
CALayer *maskingLayer = [CALayer layer];
maskingLayer.frame = CGRectMake(-(self.yourView.frame.size.width - self.yourView.frame.size.width) / 2
, 0
, maskingImage.size.width
, maskingImage.size.height);
[maskingLayer setContents:(id)[maskingImage CGImage]];
[self.yourView.layer setMask:maskingLayer];

Answer 14

Un enfoque diferente al que hizo Ed Marty:

#import <QuartzCore/QuartzCore.h>
[v.layer setCornerRadius:25.0f];
[v.layer setMasksToBounds:YES];

Necesitas setMasksToBounds para cargar todos los objetos de IB ... Tengo un problema donde mi vista se redondea, pero no tiene los objetos de IB: /

esto lo arregló = D espero que ayude!

Answer 15

Usando la extensión UIView:

extension UIView {
func addRoundedCornerToView(targetView : UIView?)
{
//UIView Corner Radius
targetView!.layer.cornerRadius = 5.0;
targetView!.layer.masksToBounds = true
//UIView Set up boarder
targetView!.layer.borderColor = UIColor.yellowColor().CGColor;
targetView!.layer.borderWidth = 3.0;
//UIView Drop shadow
targetView!.layer.shadowColor = UIColor.darkGrayColor().CGColor;
targetView!.layer.shadowOffset = CGSizeMake(2.0, 2.0)
targetView!.layer.shadowOpacity = 1.0
}
}

Uso:

override func viewWillAppear(animated: Bool) {
sampleView.addRoundedCornerToView(statusBarView)
}

Answer 16

si la esquina redonda no funciona en viewDidload () es mejor escribir código en viewDidLayoutSubview ()

-(void)viewDidLayoutSubviews
{
viewTextfield.layer.cornerRadius = 10.0 ;
viewTextfield.layer.borderWidth = 1.0f;
viewTextfield.layer.masksToBounds = YES;
viewTextfield.layer.shadowRadius = 5;
viewTextfield.layer.shadowOpacity = 0.3;
viewTextfield.clipsToBounds = NO;
viewTextfield.layer.shadowOffset = CGSizeMake(0.0f, 0.0f);
}

¡Espero que esto ayude!

Answer 17

UIView *view = [[UIView alloc] initWithFrame:CGRectMake(20, 50, 200, 200)];
view.layer.backgroundColor = [UIColor whiteColor].CGColor;
view.layer.cornerRadius = 20.0;
view.layer.frame = CGRectInset(v.layer.frame, 20, 20);
view.layer.shadowOffset = CGSizeMake(1, 0);
view.layer.shadowColor = [[UIColor blackColor] CGColor];
view.layer.shadowRadius = 5;
view.layer.shadowOpacity = .25;
[self.view addSubview:view];
[view release];

Answer 18

UIView* viewWithRoundedCornersSize(float cornerRadius,UIView * original)
{
// Create a white border with defined width
original.layer.borderColor = [UIColor yellowColor].CGColor;
original.layer.borderWidth = 1.5;
// Set image corner radius
original.layer.cornerRadius =cornerRadius;
// To enable corners to be "clipped"
[original setClipsToBounds:YES];
return original;
}

Answer 19

view.layer.cornerRadius = 25
view.layer.masksToBounds = true