ios - 如何创建随机闭合平滑 CGPath？

Question

我正在尝试找到一种方法来创建随机闭合平滑路径(CGPath 或 UIBezierPath)。我读过 De Casteljau's algorithm以及其他关于贝塞尔路径的文章，但它似乎不符合我试图实现的目标。

我想过创建一个圆形的 CGPath。然后我将路径乘以一个函数，该函数会扭曲点的位置，比如正弦或余弦。但是我不知道这是否是正确的方向，因为路径不会有随机形状。

CGMutablePathRef circle = CGPathCreateMutable();
CGPathAddArc(circle, nil, 0.0f, 0.0f, 100.0f, 2 * M_PI, 0.0f, true);
...
CGPathRelease(circle);

如果有人能为我指明正确的方向，如何开始实现它，那就太好了。我尝试生成的路径示例:

Answer 1

你画的看起来像一个扭曲的圆圈。

假设这就是您所追求的，这就是我要做的:

编写代码，以固定的步数步进从 0 到 2pi 的角度。 (尝试 8)让角度以小于 ± pi/steps 的小随机量变化。

选择一个略小于封闭正方形边长 1/2 的基本半径，这样就有空间让您的点进入基本半径的内部或外部，而不会超出您的边界正方形。尝试 3/8 的边界框长度。

对于沿圆的每个稍微随机的角度值，计算一个半径值，即基本半径 ± 从 0 到基本半径/2 的随机值。

使用正弦和余弦将角度和半径值转换为点的 x 和 y 坐标。

将每个点添加到一个数组中。如果您使用这些点来创建闭合路径，则会得到一个 8 边不规则非自相交多边形，它是一个扭曲的圆。

现在使用这些点作为 Catmull-Rom 样条的控制点，将其变成平滑曲线。

编辑:我在 github 上创建了一个名为 RandomBlobs 的项目这就是我上面描述的，以及另一种方法:

将正方形区域分成 3x3 的较小正方形网格。忽略中心广场。顺时针绕过剩下的 8 个方格。对于每个正方形，在正方形内选择一个随机的 x/y 坐标(但要防止它离边缘太近。)创建按顺序连接 8 个点的闭合 UIBezierPath。使用 Catmull-Rom 平滑将不规则的八边形变成平滑的曲线。

第三种方法可能更简单:

使用类似于上述第一种方法的圆形布局。选择随机控制点。但随后不使用 Catmull-Rom 样条，平分扭曲圆上每对端点之间的角度，并为二次贝塞尔曲线添加一个控制点，也使用随机半径值。所以当你绕着圆圈走时，你会有交替的端点和控制点。您可能需要向贝塞尔曲线控制点添加一些约束，这样您的曲线形状就不会出现“扭结”(为了避免扭结，相邻贝塞尔曲线的控制点需要沿着一条通过共享端点的线两条曲线。)

---

以下是来自 RandomBlobs 项目的一些示例图像。我上传的图片被缩小了。该程序可选择显示它用于生成每个图像的控制点，但您无法真正看到缩小图像中的控制点。

首先，一个基于圆的 blob(使用 Josh Caswell 和我建议的第一种方法): 在该图片中，起始圆圈形状以浅灰色显示:

其次，基于我描述的第二种基于正方形的技术的 blob:

在那张图片中，显示了正方形网格以供引用。形状基于网格中每个点中的随机点(不包括中心正方形)。