如何以编程方式在UIview中制作圆角和边?

如何使用youtube以编程方式在UIview中制作圆角和边: 在此处输入图像描述

我知道如何制作圆角但不知道如何制作圆角。 我需要以编程方式进行(不只是设置先前设计的图像掩码)

您可以创建UIBezierPath 。 如果您想要绕过拐角,可以使用bezierPathWithRoundedRect 。 如果你想要更复杂的东西,比如YouTube徽标,你可以使用moveToPoint和一系列addCurveToPointaddQuadCurveToPoint

例如,这是一个近似值:

在此处输入图像描述

这产生于:

 - (void)viewDidLoad { [super viewDidLoad]; CGFloat width = MIN(self.view.bounds.size.width, self.view.bounds.size.width) * 0.7; CGFloat height = width * 3.0 / 4.0; CGSize size = CGSizeMake(width, height); CGFloat corner = width / 9.0; CGPoint center = CGPointMake(self.view.bounds.size.width / 2.0, self.view.bounds.size.height / 2.0); CAShapeLayer *layer = [CAShapeLayer layer]; layer.path = [self roundedPathAtCenter:center size:size corner:corner].CGPath; layer.fillColor = [UIColor redColor].CGColor; layer.strokeColor = [UIColor clearColor].CGColor; [self.view.layer addSublayer:layer]; } - (UIBezierPath *)roundedPathAtCenter:(CGPoint)center size:(CGSize)size corner:(CGFloat)corner { CGFloat width = size.width; CGFloat height = size.height; UIBezierPath *path = [UIBezierPath bezierPath]; // upper left corner [path moveToPoint: CGPointMake(center.x - width / 2.0 + corner / 2.0, center.y - height / 2.0 + corner / 2.0)]; // path to top center [path addQuadCurveToPoint: CGPointMake(center.x, center.y - height / 2.0) controlPoint: CGPointMake(center.x - width / 2.0 + corner, center.y - height / 2.0)]; // path to upper right [path addQuadCurveToPoint: CGPointMake(center.x + width / 2.0 - corner / 2.0, center.y - height / 2.0 + corner / 2.0) controlPoint: CGPointMake(center.x + width / 2.0 - corner, center.y - height / 2.0)]; // path to mid right [path addQuadCurveToPoint: CGPointMake(center.x + width / 2.0, center.y) controlPoint: CGPointMake(center.x + width / 2.0, center.y - height / 2.0 + corner)]; // path to lower right [path addQuadCurveToPoint: CGPointMake(center.x + width / 2.0 - corner / 2.0, center.y + height / 2.0 - corner / 2.0) controlPoint: CGPointMake(center.x + width / 2.0, center.y + height / 2.0 - corner)]; // path to center bottom [path addQuadCurveToPoint: CGPointMake(center.x, center.y + height / 2.0) controlPoint: CGPointMake(center.x + width / 2.0 - corner, center.y + height / 2.0)]; // path to lower left [path addQuadCurveToPoint: CGPointMake(center.x - width / 2.0 + corner / 2.0, center.y + height / 2.0 - corner / 2.0) controlPoint: CGPointMake(center.x - width / 2.0 + corner, center.y + height / 2.0)]; // path to mid left [path addQuadCurveToPoint: CGPointMake(center.x - width / 2.0, center.y) controlPoint: CGPointMake(center.x - width / 2.0, center.y + height / 2.0 - corner)]; // path to top left [path addQuadCurveToPoint: CGPointMake(center.x - width / 2.0 + corner / 2.0, center.y - height / 2.0 + corner / 2.0) controlPoint: CGPointMake(center.x - width / 2.0, center.y - height / 2.0 + corner)]; [path closePath]; return path; } 

您可以使用这些控制点来获得您正在寻找的效果。 关键是您希望第一个控制点与前一个弧的第二个控制点一致。

在这个例子中,我只是创建一个CAShapeLayer并将其添加为子层。 或者,您也可以使用此CAShapeLayer并将其作为mask添加到其他视图的layer中。 关键是你只需要创建一个绘制所需轮廓的UIBezierPath ,然后绘制它,将其添加为子图层,或者将其用作蒙版。

任何UIView圆角都必须经过它的层。 将其粘贴到新的Xcode Playground中:

 import Foundation import UIKit let view = UIView(frame: CGRect(x: 0, y: 0, width: 100, height: 100)) view.backgroundColor = UIColor.redColor() view.layer.cornerRadius = 20.0 view