UIBezierPath 创建三角形、正方形、圆形 Swift

Question

我正在尝试创建三种形状：圆形、方形和三角形。我已经创建了圆形和正方形，但无法创建三角形。我最大的问题是将所有三个形状都保持在屏幕的中心。圆形和方形都很好，但是当我尝试制作三角形时它不起作用。我还试图使三角形看起来像一个“播放按钮”，以便三角形的“尖端”朝向右侧。这是代码。

func trainglePathWithCenter(center: CGPoint, side: CGFloat) -> UIBezierPath {
    let path = UIBezierPath()

    let startX = center.x - side / 2
    let startY = center.y - side / 2

   path.move(to: CGPoint(x: startX, y: startY))
    path.addLine(to: CGPoint(x: startX, y: startY - side))
    path.addLine(to: CGPoint(x: startX + side, y: startY + side/2))
    path.close()

    return path
}


func circlePathWithCenter(center: CGPoint, radius: CGFloat) -> UIBezierPath {
    let circlePath = UIBezierPath()
    circlePath.addArc(withCenter: center, radius: radius, startAngle: -CGFloat(M_PI), endAngle: -CGFloat(M_PI/2), clockwise: true)
    circlePath.addArc(withCenter: center, radius: radius, startAngle: -CGFloat(M_PI/2), endAngle: 0, clockwise: true)
    circlePath.addArc(withCenter: center, radius: radius, startAngle: 0, endAngle: CGFloat(M_PI/2), clockwise: true)
    circlePath.addArc(withCenter: center, radius: radius, startAngle: CGFloat(M_PI/2), endAngle: CGFloat(M_PI), clockwise: true)
    circlePath.close()
    return circlePath
}

func squarePathWithCenter(center: CGPoint, side: CGFloat) -> UIBezierPath {
    let squarePath = UIBezierPath()
    let startX = center.x - side / 2
    let startY = center.y - side / 2

    squarePath.move(to: CGPoint(x: startX, y: startY))

    squarePath.addLine(to: squarePath.currentPoint)
    squarePath.addLine(to: CGPoint(x: startX + side, y: startY))
    squarePath.addLine(to: squarePath.currentPoint)
    squarePath.addLine(to: CGPoint(x: startX + side, y: startY + side))
    squarePath.addLine(to: squarePath.currentPoint)
    squarePath.addLine(to: CGPoint(x: startX, y: startY + side))
    squarePath.addLine(to: squarePath.currentPoint)
    squarePath.close()
    return squarePath

}

三角形的几何形状哪里出错了？

Answer 1

当你需要添加时，你减去了。请记住，+Y 已关闭。

变化：

path.addLine(to: CGPoint(x: startX, y: startY - side))

收件人：

path.addLine(to: CGPoint(x: startX, y: startY + side))

---

它在 Playground 中运行：

---

这是 Playground 演示的完整代码：

class Custom: UIView {
    override func draw(_ rect: CGRect) {
        let path = trainglePathWithCenter(center: self.center, side: self.bounds.width / 2)

        path.stroke()
    }

    func trainglePathWithCenter(center: CGPoint, side: CGFloat) -> UIBezierPath {
        let path = UIBezierPath()

        let startX = center.x - side / 2
        let startY = center.y - side / 2

        path.move(to: CGPoint(x: startX, y: startY))
        path.addLine(to: CGPoint(x: startX, y: startY + side))
        path.addLine(to: CGPoint(x: startX + side, y: startY + side/2))
        path.close()

        return path
    }
}

let custom = Custom(frame: CGRect(x: 0, y: 0, width: 200, height: 200))
custom.backgroundColor = .white

Answer 2

Result triangles

swift5中的代码

//TriangleView

extension UIView {

    func setRightTriangle(targetView:UIView?){
        let heightWidth = targetView!.frame.size.width //you can use triangleView.frame.size.height
        let path = CGMutablePath()

        path.move(to: CGPoint(x: heightWidth/2, y: 0))
        path.addLine(to: CGPoint(x:heightWidth, y: heightWidth/2))
        path.addLine(to: CGPoint(x:heightWidth/2, y:heightWidth))
        path.addLine(to: CGPoint(x:heightWidth/2, y:0))

        let shape = CAShapeLayer()
        shape.path = path
        shape.fillColor = UIColor.blue.cgColor

        targetView!.layer.insertSublayer(shape, at: 0)
    }

    func setLeftTriangle(targetView:UIView?){
        let heightWidth = targetView!.frame.size.width
        let path = CGMutablePath()

        path.move(to: CGPoint(x: heightWidth/2, y: 0))
        path.addLine(to: CGPoint(x:0, y: heightWidth/2))
        path.addLine(to: CGPoint(x:heightWidth/2, y:heightWidth))
        path.addLine(to: CGPoint(x:heightWidth/2, y:0))

        let shape = CAShapeLayer()
        shape.path = path
        shape.fillColor = UIColor.blue.cgColor

        targetView!.layer.insertSublayer(shape, at: 0)
    }

    func setUpTriangle(targetView:UIView?){
     let heightWidth = targetView!.frame.size.width
        let path = CGMutablePath()

        path.move(to: CGPoint(x: 0, y: heightWidth))
        path.addLine(to: CGPoint(x:heightWidth/2, y: heightWidth/2))
        path.addLine(to: CGPoint(x:heightWidth, y:heightWidth))
        path.addLine(to: CGPoint(x:0, y:heightWidth))

        let shape = CAShapeLayer()
        shape.path = path
        shape.fillColor = UIColor.blue.cgColor

        targetView!.layer.insertSublayer(shape, at: 0)
    }

    func setDownTriangle(targetView:UIView?){
        let heightWidth = targetView!.frame.size.width
        let path = CGMutablePath()

        path.move(to: CGPoint(x: 0, y: 0))
        path.addLine(to: CGPoint(x:heightWidth/2, y: heightWidth/2))
        path.addLine(to: CGPoint(x:heightWidth, y:0))
        path.addLine(to: CGPoint(x:0, y:0))

        let shape = CAShapeLayer()
        shape.path = path
        shape.fillColor = UIColor.blue.cgColor

        targetView!.layer.insertSublayer(shape, at: 0)
    }
}