帧动画教程

想做一个简单的像素动画吗？比如走路的小人、飘动的云朵、闪烁的星星……用 Pixel World Canvas 都可以实现！

🎯 什么是帧动画？

帧动画就是由一连串快速播放的"画面"组成的动画。

就像翻书动画一样：

• 第1帧：小人抬左脚
• 第2帧：小人抬右脚
• 第3帧：小人抬左脚
• ……

每秒播放的帧数越多，动画越流畅。Pixel World Canvas 默认播放帧率为 8 fps（即每帧约 125 毫秒），你也可以为单帧单独设置时长。

📍 帧面板在哪里？

画布下方的横向区域就是帧面板，每个小方块代表动画的一帧。面板左侧有播放、新建帧、复制帧等按钮。

[▶ 播放帧] [＋ 新建帧] [⧉ 复制帧]   ┌────┐┌────┐┌────┐   [洋葱皮][设置][展开]
                                    │ 1  ││ 2  ││ 3  │
                                    └────┘└────┘└────┘
                                      ↑ 当前帧（蓝色边框）

每个帧缩略图上：

• 右下角数字：帧的序号
• 左下角数字：该帧的播放时长（点击可修改）
• 左上角：进入多选的勾选区域
• 右上角：更多操作按钮（悬停显示）

🚀 开始制作动画

1. 新建帧

• 点击左侧 新建帧 按钮，在当前帧后面插入一个空白帧
• 或右键某个帧 → 在前面插入 / 在后面插入
• 想要内容相同的帧，点 复制帧 按钮（在当前帧后面复制一份）

2. 绘制内容

选中一帧，用绘图工具在上面绘制。

3. 切换到下一帧

点击下一帧，继续绘制新的画面。

4. 预览动画

点击左侧的 播放帧 按钮预览动画效果，再次点击（此时为 停止播放）即可停止。

播放期间界面会进入只读状态，停止后恢复编辑。

🎮 播放控制

帧面板左侧的播放按钮是一个播放 / 停止切换：

想逐帧查看，直接点击对应的帧缩略图即可切换。

⏱️ 调整帧时长

每帧缩略图左下角的数字是该帧的播放时长（毫秒）。

修改时长：

1. 点击帧左下角的时长数字
2. 在弹出的编辑器中选择预设或输入新的时长
3. 确认后生效

时长与速度：

• 时长越短，这一帧停留越短，播放越快
• 时长越长，停留越久，播放越慢
• 未单独设置时长的帧，使用全局帧率（默认 8 fps ≈ 125ms）

🔧 更多帧操作

帧的操作都在右键菜单或缩略图右上角的更多按钮里。

复制 / 粘贴帧

删除帧

右键帧 → 删除。

注意： 每个动画至少要保留一帧，无法删除最后一帧。

重命名帧

右键帧 → 重命名，比如叫"待机""行走""跳跃"等。

调整顺序

直接拖动帧缩略图可以改变它们的播放顺序。

🔗 合并帧

先多选（见下），再右键 → 合并，被选中的帧会合并成一帧。

📋 批量操作（多选）

多选帧

• Shift + 点击帧：把该帧加入/移出多选
• 点击帧左上角的勾选区域：单独选中该帧
• 点击帧面板空白处：退出多选模式

批量复制 / 删除

选中多个帧后，右键即可对它们执行复制、删除等操作。

🧅 洋葱皮

帧面板右侧的 洋葱皮 按钮可以让你在编辑当前帧时，看到相邻帧的半透明轮廓，方便对齐动作。点击旁边的 设置 按钮可调整洋葱皮的显示范围与透明度。

洋葱皮在只有一帧时不可用。

💡 动画技巧

1. 先规划再画

开始之前先想好动画有几帧、每帧怎么变化。

2. 从关键帧开始

先画几个关键画面（起点、中间、终点），再补中间的过渡帧。

3. 利用复制加速

相似的帧先复制再微调，省时省力。

4. 善用时长差异

不是每帧时长都一样：

• 快动作 → 时长短
• 停顿 / 过渡 → 时长稍长

让动画更自然。

5. 打开洋葱皮对齐动作

对走路、挥手这类连续动作，洋葱皮能帮你保持位置连贯。

🎨 实战例子

闪烁的星星

帧1: 星星亮 ⭐
帧2: 星星亮 ⭐
帧3: 星星暗 ☆
帧4: 星星暗 ☆
→ 循环播放 = 闪烁效果！

走路的小人

帧1: 双脚并拢
帧2: 左脚在前
帧3: 双脚并拢
帧4: 右脚在前
→ 循环播放 = 走路动画！

📌 快速参考