ios - 如何创建 Sprite 表面，如 "cham cham"

Question

我的问题可能有点太宽泛，但我正在寻找这个概念。我怎样才能像他们在“Cham Cham”应用程序中那样创建表面

https://itunes.apple.com/il/app/cham-cham/id760567889?mt=8 .

我在应用程序中完成了大部分工作，但用户触摸带来的表面变化却截然不同。你可以改变它的高度，它就会变大或缩小。如何使用 Sprite 套件来完成此操作，背后的概念是什么，任何人都可以解释一下。

谢谢

Answer 1

这是 Cham Cham 开发者的答案:)

让我将解释分成不同的部分:

注:由于项目启动时间较长，所以是使用纯OpenGL实现的。 SpiteKit 实现可能有所不同，但您只需将想法映射到它即可。

定义地面

地面由一组点表示，这些点使用Hermite Spline进行插值。 。基本上，游戏使用一堆定义表面的点，以及每个控制点之间的一组点，如下所示:

红点是控制点，其间的所有内容都是使用提到的 Hermite 插值法计算的。中间的绿点与此无关，但使整个事情看起来像胸部:)

您可以选择任意数量的步骤，使您的胸部看起来尽可能光滑，但这更多地与性能有关。

控制形状

您需要做的就是允许用户移动控制点(或其中一些控制点，例如在 Cham Cham 中；您可以定义每个点可以移动的范围等)。重新计算插值将产生改变的形状，该形状始终保持平滑(假设您已经选择了足够的中间点)。

纹理化事物

同样，如何应用纹理取决于您。在 Cham Cham 中，我们使用一个大纹理来保存背景图像，并在每次形状变化时重新计算纹理坐标。您可以尝试更复杂的算法，例如挤压纹理或任何您认为合适的算法。

至于表面纹理(覆盖地面的纹理 - 草、冰、沙子等) - 你可以使用名为 Triangle Strips 的东西。 ，“底部”顶点位于曲面的每个插值点处，而“顶部”顶点则凸起(通过在该点的法线方向上将它们与“底部”顶点偏移)。

渲染

最简单的方法是利用一些曲面分割库，例如 libtess 。它将做什么它将你的边界线(由插值点组成)隐藏成一组三角形。它将保留纹理坐标，以便您可以将这些三角形提供给渲染器。

SpriteKit注释

不幸的是，我对 SpriteKit 引擎不太熟悉，所以不能保证您能够一对一地复制这个想法，但请随意评论实现的挑战性方面，我会尽力帮助。