UIView上swift 3中的uibezierPath，只需要曲线

Posted 2023-03-10

【中文标题】UIView上swift 3中的uibezierPath，只需要曲线

【英文标题】：bezierPath in swift 3 on UIView, only curved line needed

【发布时间】：2017-09-28 16:02:20

【问题描述】：

当我在 UIView 上快速绘制 bezierPath 时。我得到了直线。我只需要曲线就可以去掉直线。

我可以通过以下方式移除灰色填充： line.fillColor = UIColor.clear.cgColor

不知道如何删除直线

代码：

    let line = CAShapeLayer()
    let linePath = UIBezierPath()
    linePath.move(to: start)
    linePath.addLine(to: end)
    var dis = (end.x - start.x)/3.0
    linePath.addCurve(to: start,
                  controlPoint1: CGPoint(x: start.x + dis, y: start.y + dis),
                  controlPoint2: CGPoint(x: end.x - dis, y: end.y - dis))

    line.path = linePath.cgPath
    line.strokeColor = UIColor.red.cgColor
    //line.fillColor = UIColor.clear.cgColor
    line.lineWidth = 4.0
    line.opacity = 0.6
    self.view.layer.addSublayer(line)

【参考方案1】：

不要关闭路径。当您关闭贝塞尔路径时，它会在路径的开始和结束之间添加一条直线。如果您不关闭路径，那么它不应该这样做。 （但是你不能填充非封闭路径，只需描边即可。）

如果这对您没有帮助，您需要编辑您的问题以显示创建和绘制路径的代码。

【讨论】：

嗨@Duncan，我已经更新了代码。即使在关闭后它仍然绘制直线

你的代码有一个明确的命令来画一条从起点到终点的线：linePath.addLine(to: end) 它被写成从终点到起点画一条曲线。摆脱那个addLine命令，先移动到端点，然后调用添加一条从终点到起点的曲线（或移动到曲线的开头，然后重写你的linePath.addCurve添加从起点到终点的曲线。）

【参考方案2】：

请尝试以下代码。指定起点和终点，用三角函数的 pi 来表示圆曲线。如果你想通过这些来使用动画，请将以下代码添加到 UIView

import UIKit

class ViewController: UIViewController 

    override func viewDidLoad() 
        super.viewDidLoad()
        let pi = CGFloat(Float.pi)
        let start:CGFloat = 0.0
        let end :CGFloat = pi
        
        // circlecurve
        let path: UIBezierPath = UIBezierPath();
        path.addArc(
            withCenter: CGPoint(x:self.view.frame.width/4, y:self.view.frame.height/4),
            radius: 300,
            startAngle: start,
            endAngle: end,
            clockwise: true
        )
        let layer = CAShapeLayer()
        layer.fillColor = UIColor.clear.cgColor
        layer.strokeColor = UIColor.orange.cgColor
        layer.path = path.cgPath
        self.view.layer.addSublayer(layer)   
    

    override func didReceiveMemoryWarning() 
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.