插值

插值是图形编程中一个非常基本的操作。作为一名图形开发人员,熟悉它有助于扩展您的视野。

基本思想是从A转换到B。“t”值是介于两者之间的状态。

举个例子,如果 t 值为0,那么状态是A。如果 t 值是1,状态是B。任何介于两者之间的都是*插值*。

Between two real (floating-point) numbers, a simple interpolation is usually described as:

GDScript

  1. interpolation = A * (1 - t) + B * t

通常简化为:

GDScript

  1. interpolation = A + (B - A) * t

这类型的插值名字,将一个值以*恒定速度*转换成另一个值*“线性”*。当你听说线性插值时,就知道他们是指这个简单的公式。

还有其他类型的插值,这里将不做讨论。建议之后阅读:参考:`贝塞尔<文档_贝塞尔_及_曲线>`页面。

Vector interpolation

向量类型(:参考:`二维向量<类_二维向量>`:参考:`三维向量<类_三维向量>`)也可以插值,它们提供了方便的函数来实现这一点:参考:二维向量.线性_插值() <类_二维向量_方法_线性_插值> 和:参考:三维向量.线性_插值() <类_三维向量_方法_线性_插值>。

以及立方插值,请参见:参考:二维向量.立方_插值() <类_二维向量_方法_线性_插值>`和:参考:`三维向量.立方_插值() <类_三维向量_方法_线性_插值>,使用:参考:`贝塞尔<文档_贝塞尔_及_曲线>`制作风格插值。

下面是使用插值从A点到B点的简单伪代码:

GDScript

  1. func _physics_process(delta):
  2. t += delta * 0.4
  3. $Sprite.position = $A.position.linear_interpolate($B.position, t)

It will produce the following motion:

../../_images/interpolation_vector.gif

Transform interpolation

也可以插值整个变换(确保它们要么具有统一的刻度,要么至少具有相同的非均匀刻度)。为此,可以使用这个函数:参考:变换.插值_与() <类_变换_方法_插值_与>。

下面是将猴子从位置1转换为位置2的例子:

../../_images/interpolation_positions.png

Using the following pseudocode:

GDScript

  1. var t = 0.0
  2. func _physics_process(delta):
  3. t += delta
  4. $Monkey.transform = $Position1.transform.interpolate_with($Position2.transform, t)

And again, it will produce the following motion:

../../_images/interpolation_monkey.gif

Smoothing motion

插值可用于平滑运动、旋转等。下面是使用平滑运动跟随鼠标的圆圈的例子:

GDScript

  1. const FOLLOW_SPEED = 4.0
  2. func _physics_process(delta):
  3. var mouse_pos = get_local_mouse_position()
  4. $Sprite.position = $Sprite.position.linear_interpolate(mouse_pos, delta * FOLLOW_SPEED)

Here is how it looks:

../../_images/interpolation_follow.gif

这对平滑相机运动很有用,队友在跟随你(确保他们保持在一定范围内),以及许多其他常见的游戏模式。