在 raylib 中创建精灵动画的最佳方法是什么？

Question

我不确定在

raylib

中创建动画最有效的方法。

我想到的基本上有两种选择：

1. 我可以根据帧延迟更新帧。

2. 我可以根据计时器更新帧。

第一种方法似乎不太好，因为它不独立于 FPS。它可能在我的计算机上运行得很好，但在另一台计算机上运行得非常慢或非常快。

第二种方法涉及用于计时器实现的繁琐的样板代码。

在 raylib 示例页面上，他们在各处广泛使用

framedelay

并更新了几帧。尽管这是一个非常基本的问题，但我根本不清楚更好的选择是什么。我对此也没有遇到任何好的建议。有没有达成一致的共识？至于我会使用的可能是计时器，因为它不依赖于 FPS。 （函数

GetFrameTime()

计算前一帧之后的增量。

一个简单的计时器实现如下所示：

typedef struct {
    float Lifetime; 
} Timer;

void startTimer(Timer *timer, float Lifetime) {
    if (timer != nullptr && Lifetime > 0) {
        timer->Lifetime = Lifetime;
    }
}

void updateTimer(Timer *timer) {
    if (timer != nullptr && timer->Lifetime > 0) {
        timer->Lifetime -= GetFrameTime();
    }
}

bool timerFinished(Timer *timer) {
    if (timer != nullptr) {
        return timer->Lifetime <= 0;
    }
    return false;
}

我认为这很简单，但正如我所说..这不是世界上最漂亮的东西。

Answer 1

那么，您渴望在 raylib 中创建精灵动画吗？太棒了，让我们一步步分解吧。

首先，准备好你的精灵表。这是包含所有动画帧的一张大图像。您可能有网格布局或其他一些安排 - 只要它们都在那里就没关系。

接下来，您需要使用 LoadTexture 加载 spritesheet。就这么简单：

Texture2D spritesheet = LoadTexture("your_spritesheet.png");

现在，我们来谈谈您的动画帧。你需要定义它们。将每个帧视为精灵表的一小部分。我们将使用矩形来指定 spritesheet 的哪个部分代表每个帧。创建一个矩形数组来执行此操作：

Rectangle frames[] = {
    { 0, 0, frameWidth, frameHeight }, // Frame 1
    { frameWidth, 0, frameWidth, frameHeight }, // Frame 2
    // Add more frames as needed
};

明白了吗？太棒了。

接下来，设置一些变量来控制动画 - currentFrame、frameRate 和 frameTimer。 currentFrame 跟踪您在动画中的位置，frameRate 是每个帧应显示的时间，frameTimer 帮助管理帧切换。设置方法如下：

int currentFrame = 0;
float frameRate = 0.1f; // Time in seconds for each frame
float frameTimer = 0.0f; // Timer to control frame switching

现在，有趣的部分！在游戏循环中，您需要通过根据时间更改当前帧来更新动画。这就像翻阅翻页书的框架一样。这是一个可以帮助您做到这一点的片段：

frameTimer += GetFrameTime();
if (frameTimer >= frameRate) {
    frameTimer = 0.0f;
    currentFrame++;
    if (currentFrame >= numFrames) {
        currentFrame = 0;
    }

最后，要查看正在运行的动画，您必须使用 DrawTextureRec 绘制当前帧。这就像显示活页簿中的幻灯片一样。具体方法如下：

DrawTextureRec(spritesheet, frames[currentFrame], position, WHITE); 

该位置是您要将精灵放置在屏幕上的位置。

别忘了自己清理干净。完成后，卸载资源以防止任何内存泄漏。将 UnloadTexture 用于您的 spritesheet。

这是在 raylib 中创建精灵动画的基本流程。请记住，您可以利用它并根据您的特定游戏需求进行构建。享受动画！