How to add multiple bezier paths into same view swift 3 - ios

Question

I have added a triangle in this way
// draw the line graph
UIColor.white.setFill()
UIColor.white.setStroke()
///--------SETUP FIRST TRIANGLE-----------------------------------------------
//set up the points line
let graphPath = UIBezierPath()
//go to start of line
graphPath.move(to: CGPoint.init(x: rect.minX, y: rect.minY))
graphPath.addLine(to: CGPoint.init(x: (rect.maxX/2.0), y: (rect.maxY/2.0)))
graphPath.addLine(to: CGPoint.init(x: rect.minX, y: rect.maxY))
graphPath.stroke()
//2 - make a copy of the path
let clippingPath = graphPath.copy() as! UIBezierPath
//3 - add lines to the copied path to complete the clip area
clippingPath.addLine(to: CGPoint.init(x: rect.minX, y: rect.minY))
clippingPath.close()
//4 - add the clipping path to the context
clippingPath.addClip()
let startPoint = CGPoint(x:(rect.maxX/2.0), y: (rect.maxY/2.0))
let endPoint = CGPoint(x:rect.minX, y:(rect.maxY/2.0))
let gradient=self.getGradient(tiangleNo: 1)
let context = UIGraphicsGetCurrentContext()
context!.drawLinearGradient(gradient, start: startPoint, end: endPoint, options: CGGradientDrawingOptions(rawValue: 0))
This is drawing a triangle that I wanted. Now I want to draw another triangle. So I did like this.
///------------SECOND TRIANGLE -----------------------------------------------
let graphPath2 = UIBezierPath()
graphPath2.move(to: CGPoint.init(x: rect.minX, y: rect.minY))
graphPath2.addLine(to: CGPoint.init(x: rect.maxX, y: rect.minY))
graphPath2.addLine(to: CGPoint.init(x: (rect.maxX/2.0), y: (rect.minY/2.0)))
graphPath2.stroke()
let oldPath1=clippingPath.copy() as! UIBezierPath
oldPath1.append(graphPath2)
let startPoint2 = CGPoint(x:(rect.maxX/2.0), y: (rect.maxY/2.0))
let endPoint2 = CGPoint(x:(rect.maxX/2.0), y:rect.minY)
let gradient2=self.getGradient(tiangleNo: 2)
let context2 = UIGraphicsGetCurrentContext()
context2!.drawLinearGradient(gradient2, start: startPoint2, end: endPoint2, options: CGGradientDrawingOptions(rawValue: 0))
But this just adding a triangle inside the previous one.rectis the my UIScreen rectangle

Answer 1

Simple Solution
You can write a function like this
func drawTriangle(point1:CGPoint, point2:CGPoint, point3:CGPoint) {
let path = UIBezierPath()
path.move(to: point1)
path.addLine(to: point2)
path.addLine(to: point3)
path.close()
path.lineWidth = 2.0
UIColor.red.setFill()
path.fill()
}
Draw triagles by calling the function
//Triagle 1
let pointA = CGPoint(x: 0, y: 0)
let pointB = CGPoint(x: 100, y: 0)
let pointC = CGPoint(x: 0, y: 100)
drawTriangle(point1: pointA, point2: pointB, point3: pointC)
//Triagle 2
let pointD = CGPoint(x: 120, y: 0)
let pointE = CGPoint(x: 220, y: 0)
let pointF = CGPoint(x: 220, y: 100)
drawTriangle(point1: pointD, point2: pointE, point3: pointF)
You will get something like this,