起因是一直在关注「極客死亡計劃」最近写的几篇博客，前几天他终于发布他的游戏大作为战斗献上心脏！，看的心痒痒，又想写游戏了，为什么要说有又？因为以前懵懵的编写过一些小游戏，但是大多都是按着实际的案例照抄，主要是学习游戏的编写，具体自己完整的构思和制作并没有体验过，所以就有了这篇Phaser3的学习笔记。

为什么是Phaser3？

很早以前，我曾使用Java编写过一个弹球小游戏，甚至是复刻了一个简单的俄罗斯方块，后来我又转到了python，自然就会用到pygame，但是pygame的使用并没有想象中那么顺利，曾经还想再pygame的基础上封装一个游戏引擎，但是后来还是放弃了。昨天把，问了Gemini，推荐一些JavaScript的2D游戏引擎，Gemini推荐了Phaser3，我去了官方网站看了下他的API，发现这不就是我当初要封装pygame的引擎吗？有些API看到后竟然有一种似曾相识的感觉，所以我就选择了Phaser3。

Phaser3学习资源

Phaser3 官方网站

官方网站上的学习资料非常的充足，可以满足任何层次的学习。

Phaser3基础概念

这些概念是Gemini总结的：

在开始编写代码之前，了解 Phaser 的一些核心概念非常重要。

• Phaser 框架概述: Phaser 是一个开源的 HTML5 游戏框架，它提供了丰富的功能来帮助您创建基于浏览器的 2D 游戏。
• WebGL 和 Canvas 渲染: Phaser 默认使用 WebGL 进行渲染，如果浏览器不支持 WebGL，它会自动回退到 Canvas 渲染。WebGL 利用 GPU 加速，通常能提供更好的性能。
• 场景（Scene）: 场景是游戏的基本构建块。每个场景代表游戏中的一个独立部分，例如主菜单、游戏关卡、结束界面等。您可以在不同的场景之间切换。
• 游戏对象（Game Objects）: 游戏对象是您在游戏中看到和操作的元素，例如图片、精灵、文本、形状等。
• 精灵（Sprite）: 精灵是一种特殊的游戏对象，通常用于表示动画角色或移动的物体。它可以包含纹理和动画。
• 游戏循环（Game Loop）: 游戏循环是游戏的核心，它不断地执行一系列操作来更新游戏的状态和渲染画面。Phaser 的游戏循环包含三个主要的函数：
• preload(): 在场景启动之前调用，用于加载游戏所需的资源（图片、音频等）。
• create(): 在 preload() 完成后调用一次，用于创建游戏对象、设置初始状态等。
• update(): 在游戏循环中每帧都会被调用，用于更新游戏逻辑、处理用户输入、移动游戏对象等。
• config 游戏配置对象: 在创建 Phaser 游戏实例时，您需要提供一个配置对象来定义游戏的属性，例如宽度、高度、渲染模式、场景等。

这些内容可以指导你如何开始学习 Phaser 3。

后续会继续在这个博文中继续补充记录一些重要的学习笔记。

当然，建议从官方的第一个教程开始学习：

Making your first Phaser 3 game

在游戏开发中，常见的图集（Atlas）类型主要有以下几种：

1. 纹理图集（Texture Atlas）

   • 将多个独立的图片打包成一张大图
   • 适用于角色、UI、道具等独立精灵
   • 在 Phaser 中使用 this.load.atlas() 加载

2. 瓦片图集（Tileset Atlas）

   • 用于构建游戏地图的重复性图块集合
   • 通常配合瓦片地图编辑器（如 Tiled）使用
   • 在 Phaser 中使用 this.load.tilemapTiledJSON() 加载

3. 精灵表（Sprite Sheet）

   • 将动画帧按固定大小排列的图集
   • 每帧大小相同，规则排列
   • 在 Phaser 中使用 this.load.spritesheet() 加载

4. 字体图集（Font Atlas/Bitmap Font）

   • 包含字体字形的特殊图集
   • 用于高性能文本渲染
   • 在 Phaser 中使用 this.load.bitmapFont() 加载

5. 粒子图集（Particle Atlas）

   • 专门用于粒子系统的图集
   • 包含粒子效果所需的各种状态图像
   • 可以使用普通的 atlas 加载方式

6. 九宫格图集（Nine-Slice Atlas）

   • 用于可伸缩UI元素的特殊图集
   • 将图像分为9个区域，支持不同方向的拉伸
   • 在很多UI系统中都有支持

未完待续。