Search code examples
iosswiftswift5uibezierpath

How to make a shape in swift


How to make a shape like this

enter image description here

func createShape() {
        bezierPath = UIBezierPath()
        bezierPath.move(to: .zero)
        bezierPath.addLine(to: CGPoint(x:self.frame.width , y: self.frame.origin.y))
        bezierPath.addLine(to: CGPoint(x: self.frame.width, y: self.frame.height / 2))
        bezierPath.addCurve(to: CGPoint(x:self.frame.width/2 , y: self.frame.height), controlPoint1: CGPoint(x: self.frame.width, y: self.frame.height / 2), controlPoint2: CGPoint(x:self.frame.width/2  + 33 , y: self.frame.height))
        bezierPath.addCurve(to: CGPoint(x: 0, y: self.frame.height / 2), controlPoint1: CGPoint(x:  self.frame.width/2 - 33, y:self.frame.height), controlPoint2: CGPoint(x: 0, y: self.frame.height / 2))
        bezierPath.addLine(to: .zero)
        bezierPath.close()
    }

and as a result i got

enter image description here

Can you help me?


Solution

  • read how a curve work here

    let bezierPath = UIBezierPath()
            bezierPath.move(to: .zero)
            bezierPath.addLine(to: CGPoint(x: 0 , y: self.frame.height/2))
            bezierPath.addCurve(to:  CGPoint(x:self.frame.width , y: self.frame.height / 2), controlPoint1: CGPoint(x: 0, y: (self.frame.height+self.frame.width)/2), controlPoint2: CGPoint(x: self.frame.width, y: (self.frame.height+self.frame.width)/2))
            bezierPath.addLine(to: CGPoint(x: self.frame.width, y: 0))
            bezierPath.addLine(to: .zero)
    

    enter image description here