¡Dibuje la image de medio círculo como el medidor usando UIBezierPath …!

Necesito dibujar la imagen como se muestra en este enlace.

Lo he implementado. Y es como en este enlace.

El código de My View Controller contiene el código siguiente

class ViewController: UIViewController { override func viewDidLoad() { super.viewDidLoad() let width: CGFloat = 240 let height: CGFloat = 240 let demoView = DemoView(frame: CGRect(x: self.view.frame.size.width/2 - width/2, y: self.view.frame.size.height/2 - height/2, width: width, height: height)) let subView = UIView.init(frame: (CGRect(x: demoView.frame.origin.x - width, y: demoView.frame.origin.y, width: width * 2, height: height * 2))) self.view.addSubview(demoView) self.view.addSubview(subView) subView.backgroundColor = UIColor.lightGray.withAlphaComponent(0.5) subView.layer.cornerRadius = subView.frame.size.height / 2 } } import UIKit class DemoView: UIView { var path: UIBezierPath! override init(frame: CGRect) { super.init(frame: frame) self.backgroundColor = UIColor.darkGray } override func draw(_ rect: CGRect) { self.createTriangle() } requinetworking init?(coder aDecoder: NSCoder) { super.init(coder: aDecoder) } func createTriangle() { let count : Int = 9 let gap : CGFloat = 3 let yValue : CGFloat = CGFloat(self.frame.size.width - ((CGFloat(count - 1)) * gap)) / CGFloat(count); for a in 0 ..< count { let i : CGFloat = CGFloat(a) let path1: UIBezierPath! = UIBezierPath() path1.move(to: CGPoint(x: 0.0, y: self.frame.size.height)) path1.addLine(to: CGPoint(x: (yValue * i) > 0 ? (yValue * i) + i*gap : 0, y: (yValue * i) > 0 ? (yValue * i) + i*gap : 0)) path1.addLine(to: CGPoint(x:yValue * (i+1) + i*gap, y: yValue * (i+1) + i*gap)) path1.close() UIColor.orange.setFill() path1.fill() } } } 

¿Alguien puede ayudarme a lograr esto?

Editar image : he actualizado el problema relacionado con la imagen

¿Es este el resultado que quieres?

introduzca la descripción de la imagen aquí

La forma en que lo hice no es con triangularjs sino con Arcs. Agrega createPie() en tu class DemoView y DemoView en draw(:) lugar de createTriangle() .

Este es mi código:

 func createPie() { // 2 vars to configure width of gap/banches var branchAmount = 10 var gapAngle = CGFloat.pi / 100 let startAngle = 3 * CGFloat.pi / 2 let endAngle = 2 * CGFloat.pi let branchAngle = (endAngle - startAngle - (CGFloat(branchAmount) - 1) * gapAngle) / CGFloat(branchAmount) let paths = UIBezierPath() for i in 0..<branchAmount { paths.move(to: CGPoint(x: 0.0, y: self.frame.size.height)) paths.addArc(withCenter: CGPoint(x: 0, y: self.frame.size.height), radius: self.frame.size.height, startAngle: startAngle + CGFloat(i) * (branchAngle + gapAngle), endAngle: startAngle + CGFloat(i) * (branchAngle + gapAngle) + branchAngle, clockwise: true) } paths.close() UIColor.orange.setFill() paths.fill() } 

¡Aclamaciones!

EDITAR : si desea agregar una máscara circular y agregar esto al final de createPie() ( que ya no es realmente un pastel ahora … ):

  // Circular mask let maskLayer = CAShapeLayer() let maskPath = UIBezierPath(rect: bounds) maskLayer.fillRule = kCAFillRuleEvenOdd // Circle will be substracted to the mask thanks to this maskPath.move(to: CGPoint(x: 0.0, y: frame.size.height)) maskPath.addArc(withCenter: CGPoint(x: 0, y: frame.size.height), radius: maskRadius, startAngle: startAngle, endAngle: endAngle, clockwise: true) maskLayer.path = maskPath.cgPath layer.mask = maskLayer 

Simplemente agrega una máscara compuesta por la resta de bounds y the circle of origin (0, height)

introduzca la descripción de la imagen aquí