2016-01-28 3 views
3

Я разбил прямоугольник с добавлением точки UIBezierPath, теперь я хочу округлить углы этого прямоугольника, но кажется, что нет никакого способа сделать это. Может кто-нибудь мне помочь ?Как закруглить углы, когда я рисую прямоугольник, используя точки UIBezierPath

class RectangleLayer: CAShapeLayer { 

    let animationDuration: CFTimeInterval = 0.5 

    override init() { 
     super.init() 
     fillColor = Colors.clear.CGColor 
     lineWidth = 5.0 
     path = rectanglePathStart.CGPath 
    } 

    required init?(coder aDecoder: NSCoder) { 
     fatalError("init(coder:) has not been implemented") 
    } 
var rectanglePathStart: UIBezierPath { 
     let rectanglePath = UIBezierPath() 
     rectanglePath.moveToPoint(CGPoint(x: 0.0, y: 100.0)) 
     rectanglePath.addLineToPoint(CGPoint(x: 0.0, y: -lineWidth)) 
     rectanglePath.addLineToPoint(CGPoint(x: 100.0, y: -lineWidth)) 
     rectanglePath.addLineToPoint(CGPoint(x: 100.0, y: 100.0)) 
     rectanglePath.addLineToPoint(CGPoint(x: -lineWidth/2, y: 100.0)) 

     rectanglePath.closePath() 

//  fillColor = Colors.red.CGColor 
     return rectanglePath 
    } 
} 
+0

Вы можете использовать 'bezierPathWithArcCenter: radius: startAngle: endAng le: по часовой стрелке: 'для каждого угла, который вы хотите округлить. – Larme

ответ

9

Если все, что вы хотите сделать, это создать прямоугольник с закругленными углами, то вы можете просто использовать

let rectangle = CGRect(x: 0, y: 0, width: 100, height: 100) 
let path = UIBezierPath(roundedRect: rectangle, cornerRadius: 20) 

enter image description here

Если вы хотите округлить некоторые из углов, а не другие, то вы можете использовать

let rectangle = CGRect(x: 0, y: 0, width: 100, height: 100) 
let path = UIBezierPath(roundedRect: rectangle, byRoundingCorners: [.TopLeft, .BottomRight], cornerRadii: CGSize(width: 35, height: 35)) 

enter image description here

Если вы хотите иметь другой угловой радиус для каждого угла, вам нужно будет добавить дугу для каждого круга индивидуально. Это сводится к вычислению центра и угла начала и конца каждой дуги. Вы обнаружите, что центр каждой дуги вставляет радиус угла из соответствующего угла прямоугольника. Так, например, центр верхнего левого угла

CGPoint(x: rectangle.minX + upperLeftRadius, y: rectangle.minY + upperLeftRadius) 

в начале и в конце угол для каждой дуги будет либо прямой левой, вверх, вниз или вправо. Углы, соответствующие этим направлениям, можно увидеть в документации UIBezierPath.

enter image description here

Если вам нужно создать много прямоугольников, как это, вы можете создать удобство инициализатору ибо она

extension UIBezierPath { 
    convenience init(roundedRect rect: CGRect, topLeftRadius r1: CGFloat, topRightRadius r2: CGFloat, bottomRightRadius r3: CGFloat, bottomLeftRadius r4: CGFloat) { 
     let left = CGFloat(M_PI) 
     let up = CGFloat(1.5*M_PI) 
     let down = CGFloat(M_PI_2) 
     let right = CGFloat(0.0) 
     self.init() 
     addArcWithCenter(CGPoint(x: rect.minX + r1, y: rect.minY + r1), radius: r1, startAngle: left, endAngle: up, clockwise: true) 
     addArcWithCenter(CGPoint(x: rect.maxX - r2, y: rect.minY + r2), radius: r2, startAngle: up, endAngle: right, clockwise: true) 
     addArcWithCenter(CGPoint(x: rect.maxX - r3, y: rect.maxY - r3), radius: r3, startAngle: right, endAngle: down, clockwise: true) 
     addArcWithCenter(CGPoint(x: rect.minX + r4, y: rect.maxY - r4), radius: r4, startAngle: down, endAngle: left, clockwise: true) 
     closePath() 
    } 
} 

И использовать его как этот

let path = UIBezierPath(roundedRect: rectangle, topLeftRadius: 30, topRightRadius: 10, bottomRightRadius: 15, bottomLeftRadius: 5) 

enter image description here