CAShapeLayer с UIBezierPath

Question

Мне хотелось отобразить треугольный вид в ячейке UITableView, как это.

мне удалось сделать это с помощью кода удара.

import UIKit 

class TriangleView: UIView { 

    override func drawRect(rect: CGRect) { 
     let width = self.layer.frame.width 
     let height = self.layer.frame.height 

     let path = CGPathCreateMutable() 
     CGPathMoveToPoint(path, nil, 0, 0) 
     CGPathAddLineToPoint(path, nil, width, 0) 
     CGPathAddLineToPoint(path, nil, 0, height) 
     CGPathAddLineToPoint(path, nil, 0, 0) 
     CGPathCloseSubpath(path) 

     let mask = CAShapeLayer() 
     mask.frame = self.layer.bounds 
     mask.path = path 

     self.layer.mask = mask 

     let shape = CAShapeLayer() 
     shape.frame = self.bounds 
     shape.path = path 
     shape.fillColor = UIColor.clearColor().CGColor 

     self.layer.insertSublayer(shape, atIndex: 0) 
    } 
} 

Пока я искал, как создавать формы в UIViews, я обнаружил, что вы могли бы использовать UIBezierPath сделать то же самое. Поэтому я попытался воспроизвести то же самое, используя UIBezierPath.

let path = UIBezierPath() 
path.moveToPoint(CGPoint(x: 0, y: 0)) 
path.moveToPoint(CGPoint(x: width, y: 0)) 
path.moveToPoint(CGPoint(x: 0, y: height)) 
path.moveToPoint(CGPoint(x: 0, y: 0)) 
path.closePath() 

let mask = CAShapeLayer() 
mask.frame = self.bounds 
mask.path = path.CGPath 

self.layer.mask = mask 

let shape = CAShapeLayer() 
shape.frame = self.bounds 
shape.path = path.CGPath 
shape.fillColor = UIColor.clearColor().CGColor 

self.layer.insertSublayer(shape, atIndex: 0) 

Но это просто не работает. Никакая фигура не отображается.

Нужно ли мне что-нибудь делать, чтобы это работало?

Answer 1

Вы делаете это сложнее, чем должно быть. Вам нужно только добавить слой с контуром и установить fillColor этого слоя. Основная причина, по которой ваш код не работает, заключается в том, что вы используете moveToPoint для всех ваших линий вместо addLineToPoint для всех, кроме первого.

class TriangleView: UIView { 

    required init(coder aDecoder: NSCoder) { 
     super.init(coder: aDecoder) 
    } 

    override init(frame: CGRect) { 
     super.init(frame: frame) 
     let path = UIBezierPath() 
     path.moveToPoint(CGPoint(x: 0, y: 0)) 
     path.addLineToPoint(CGPoint(x: frame.size.width, y: 0)) 
     path.addLineToPoint(CGPoint(x: 0, y: frame.size.height)) 
     path.closePath() 

     let shape = CAShapeLayer() 
     shape.frame = self.bounds 
     shape.path = path.CGPath 
     shape.fillColor = UIColor.blueColor().CGColor 
     self.layer.addSublayer(shape) 
    } 
} 

Answer 2

Проблема должна заключаться в маске на слое и цвете формы.
Следующий код работает для меня.

class TriangleView: UIView { 
    override func drawRect(rect: CGRect) { 
     let width:CGFloat = bounds.width/9 
     let height:CGFloat = bounds.width/9 

     let path = UIBezierPath() 
     path.moveToPoint(bounds.origin) 
     path.addLineToPoint(CGPoint(x: width, y: bounds.origin.y)) 
     path.addLineToPoint(CGPoint(x: bounds.origin.x, y: height)) 
     // closePath will connect back to start point 
     path.closePath() 

     let shape = CAShapeLayer() 
     shape.path = path.CGPath 
     shape.fillColor = UIColor.blueColor().CGColor 

     self.layer.insertSublayer(shape, atIndex: 0) 

     // Setting text margin 
     textContainerInset = UIEdgeInsetsMake(8, width, 8, 0) 
    } 
}