SwiftUI生成随机波浪线出现尖锐点问题求助

API 探路者

2026-7-21

SwiftUI随机波浪线出现尖锐点的原因及修复

你的代码里出现尖锐点的核心问题是**addCurve方法的参数完全传反了**，导致贝塞尔曲线的控制点和目标点错位，直接破坏了曲线的平滑衔接逻辑。

错误根源

SwiftUI中Path.addCurve(to:control1:control2:)的参数定义很明确：

to: 曲线的终点
control1: 起点侧的第一个控制点
control2: 终点侧的第二个控制点

但你在代码里把这些参数彻底搞混了：

let to = CGPoint(x: cp1x, y: cp1y)
let control1 = CGPoint(x: cp2x, y: cp2y)
let control2 = CGPoint(x: xs[i], y: ys[i])
path.addCurve(to: control1, control1: to, control2: control1)

这里不仅把终点和控制点的顺序弄反，甚至control2还重复使用了control1的值，直接导致曲线的走向完全偏离平滑轨迹，出现尖锐转折。

修复后的代码

把addCurve的参数修正为正确顺序即可，替换循环部分的代码：

path.move(to: CGPoint(x: xs[0], y: ys[0]))

for i in 1...Int(npts) {
    let cp1x = xs[i - 1] + tension * vxs[i - 1]
    let cp1y = ys[i - 1] + tension * vys[i - 1]
    let cp2x = xs[i] - tension * vxs[i]
    let cp2y = ys[i] - tension * vys[i]
    
    // 正确参数：终点是xs[i]，control1是前一个点的外推控制点，control2是当前点的内推控制点
    path.addCurve(
        to: CGPoint(x: xs[i], y: ys[i]),
        control1: CGPoint(x: cp1x, y: cp1y),
        control2: CGPoint(x: cp2x, y: cp2y)
    )
}