Question

我是Windows Phone 7的新手。我正在编写一个示例游戏，我想随机移动图像。

在与我的一位朋友讨论时，他告诉我要使用Bezier路径。我在网上搜索了解Bezier路径概念。看起来它适合我的解决方案。但我没有找到任何可以执行此操作的示例代码。

请帮我找样品。

Answer 1

Bezier路径是您问题的有效解决方案，但我建议您使用 Catmull-Rom样条线。它实现起来远远不够，尤其是因为XNA 已经包含用于生成这样的样条函数的函数。它也更容易使用（每个控制点也是样条曲线上的一个点）。

有问题的函数是Vector2.CatmullRom（还有Vector3的版本和MathHelper中的浮点数。你指定了四个点。其中两个对您的样条曲线有效。如果您需要两个以上的点，只需在移动时循环输入（第二个变为第一个，第三个变为第二个，依此类推）。 amount参数沿着路径种类所需的位置。

Catmull-Rom spline is described here on Wikipedia。

here is an interactive demo showing how the spline works。

Answer 2

对于贝塞尔曲线的简单绘制，您可以使用此（对于cubic Bezier curve）：

private Vector2 Bezier(int t, Vector2 p0, Vector2 p1, Vector2 p2, Vector2 p3)
{
    var x = OrdinateX((float)t / 100, p0, p1, p2, p3);
    var y = OrdinateY((float)t / 100, p0, p1, p2, p3);

    return new Vector2(x, y);
}

private float OrdinateX(float t, Vector2 p0, Vector2 p1, Vector2 p2, Vector2 p3)
{
    return (float)((Math.Pow((double)(1 - t), 3) * p0.Y) + (3 * Math.Pow((double)(1 - t), 2) * t * p1.X) + (3 * (1 - t) * (t * t) * p2.X) + ((t * t * t) * p3.X));
}

private float OrdinateY(float t, Vector2 p0, Vector2 p1, Vector2 p2, Vector2 p3)
{
    return (float)((Math.Pow((double)(1 - t), 3) * p0.Y) + (3 * Math.Pow((double)(1 - t), 2) * t * p1.Y) + (3 * (1 - t) * (t * t) * p2.Y) + ((t * t * t) * p3.Y));
}

所以，在Update中你必须把它放在：

for (int t = 0; t <= 100; t++)
    object.position = Bezier(t, new Vector(0, 0), new Vector(100, 100), new Vector(300,300), new Vector(0, 300));

但我认为，获得曲线的更简单方法是使用Catmull-Rom spline，Andrew Russell如何写。

在XNA for Windows Phone 7中绘制Bezier路径

2 个答案: