跨平台开发Flutter游戏引擎Flame初探

本文包含了用Flutter Flame框架开发小游戏的源码，源码的具体获取方式见文末说明。‍‍‍‍‍‍‍

周末参加了Google组织的Devfest亲子活动，带娃参加了主题为《亲子AI编程星际之旅》的编程活动。本次活动给大家介绍了基于Flutter平台的Flame引擎的基础知识，结合游戏实践，利用Google Bard来实现AI编程。‍‍‍‍‍

在这之前，虽然接触Flutter也有数年时间了，但是Flame引擎还真是第一次接触，参加了本次活动之后，对这个引擎充满了好奇，于是决定来探究一下，这到底是个什么东西。

什么是Flame?‍‍‍‍‍‍‍‍‍‍

FlutterFlame是一个专注于2D游戏开发的框架，它提供了一系列易于使用的组件和工具，如精灵、动画、碰撞检测等，帮助开发者构建各种类型的游戏，包括平台游戏、射击游戏、益智游戏等。Flame框架还支持使用纯Flutter代码进行游戏开发，无需依赖其他引擎或库，使得开发者可以更加灵活地控制游戏的逻辑和渲染。此外，Flame还提供了丰富的文档和示例，以及一个活跃的社区，为开发者提供了学习和交流的平台。总的来说，FlutterFlame是一个强大而灵活的工具，适用于开发各种类型的2D游戏，并且在Flutter游戏开发领域具有广泛的应用和影响力。

Flame的官方文档地址为：。

在 Flmae 中，提供了一个简单而有效的游戏循环实现，以及您在游戏中可能需要的必要功能。包括 输入（Input）、图像（Images）、精灵（Sprites）、精灵表（Sprite Sheets）、动画（Animations）、碰撞检测（Collision Detection）以及“火焰组件系统”（Flame Component System，FCS）。

Flame的特点‍‍‍

FlutterFlame是一个基于Flutter的2D游戏开发框架，具有以下特点：

1.简单易用：FlutterFlame提供了简洁而强大的API，使得游戏开发变得简单而直观。

2.灵活性：开发者可以根据自己的需求自由地定制游戏逻辑和界面，而不受限于框架的约束。

3. 渲染性能优越：根据官方的介绍和开发者的反馈，Flame的表现优越，可在大多数设备上达到满格的FPS（每秒帧数）。

4.支持游戏循环：Flame提供了游戏循环的支持，使得开发者可以轻松地控制游戏的更新和渲染逻辑。

5.动画和碰撞检测：Flame内置了丰富的动画和碰撞检测功能，使得开发者可以轻松实现游戏中的动态效果和交互逻辑。

6.跨平台开发：由于基于Flutter，Flame可以实现跨平台的游戏开发，游戏可以运行在多个平台上，包括iOS、Android和Web。

总的来说，FlutterFlame是一个简单、灵活且功能丰富的游戏开发框架，适用于开发各种类型的2D游戏。

Flame官方提供的独立软件包

模块

描述

主页

flame_audio

它使用Audioplayers包提供音频功能。

如果你想播放背景音乐、环境声音、音效等，请将其作为依赖项添加到您的 Flame 游戏中。

flame_forge2d

它使用Flame自己的名为Forge2D的Box2D端口提供物理功能。

flame_tiled

该模块提供了与Tiled模块封装的集成。

flame_svg

该模块提供了与flutter_svg模块的集成。

Flame的安装

安装Flame非常简单，下面我们来看看如何安装。‍‍‍‍‍

步骤一：安装Flutter

如果你的电脑还没有安装Flutter，需要先安装Flutter环境，建议安装Flutter最新版本，详细的安装方法参考Flutter官网（）安装页面，按照步骤安装即可。‍‍‍‍‍‍‍‍‍‍‍‍‍

步骤二：下载安装Android Studio

Android Studio是Flutter开发的主要工具，通过Android Studio可以很方面地调试Android、IOS、Web甚至桌面应用。Android Studio的下载地址（）,安装完成后，打开Android Studio，点击Android Studio -> Preferences... ，在弹出的窗口中左侧输入“flutter“进行筛选，找到flutter配置选项卡，配置Flutter路径。‍‍‍

步骤三：

创建flutter demo工程，可以通过点击Android Studio菜单栏的File -> New -> New Flutter Project...，打开新建工程对话框。

在弹出的对话框中，左侧选择"Flutter"，确认右侧的Flutter SDK path，如果为空，选择自己本地的flutter路径，点击”Next"，‍‍‍‍

在本步骤中设置项目名称（Project Name），代码存放的路径（Project Location），以及项目描述（Description），Project type选择"Application"，Organization为组织名称，通常为应用包名的前缀。接下来选择Android平台和IOS平台使用的开发语言，最后选择需要打包的目标平台，这里我们选择Android、IOS和Web。设置完成后，点击Finish。这样我们的工程就创建完成了。

当然，你也可以通过flutter命令来创建工程。‍

flutter create my_game

步骤四：在项目中添加Flame依赖

进入flutter项目中，打开pubspec.yaml文件，在dependencies节点下添加Flame的依赖‍

dependencies:  flutter:    sdk: flutter
  flame: ^1.12.0

添加完成后，点击Android Studio页面右上角的 "pub get"按钮更新依赖，或者通过以下命令来更新。‍‍‍

flutter pub get

经过以上步骤，Flame已经成功安装在项目中。接下来就可以开始使用Flame来构建你的游戏了。

Flame核心组件介绍

在深入了解Flame组件如何开发游戏之前，我们需要先熟悉一下Flame中的一些基本概念和核心组件。本节总结了Flame框架中的六个概念，分别是游戏循环、组件、层、输入处理、资源管理、碰撞检测。‍

1. 游戏循环（Game Loop）

游戏循环（GameLoop）是指游戏引擎中用于控制游戏逻辑和渲染的主要循环结构。在Flame中，游戏循环由引擎自动管理，它包括以下几个关键步骤：

1. 处理输入：检测玩家的输入，如触摸、点击或键盘输入。

2. 更新游戏状态：根据输入和当前状态更新游戏中的对象位置、属性等。

3. 渲染画面：将更新后的游戏状态渲染到屏幕上，包括绘制背景、角色、动画等。

Flame的GameLoop会以每秒60次的频率运行，确保游戏画面的流畅性和响应性。开发者可以通过重写游戏类中的update和render方法来自定义游戏逻辑和渲染效果，从而实现各种类型的游戏。

2. 组件（Compoments）

Components是指游戏中的可重用的基本构建块，用于表示游戏中的各种元素，如角色、道具、背景等。每个Component都可以拥有自己的逻辑和渲染行为，并可以被添加到游戏场景中进行交互和显示。

Flame提供了一些内置的Components，如Sprite、Animation、Text等，同时也允许开发者自定义自己的Components来构建游戏。通过组合和使用不同的Components，开发者可以轻松地创建各种类型的游戏元素，并在游戏循环中更新和渲染它们。

总之，Components是Flame中用于构建游戏元素的模块化单元，它们可以帮助开发者更高效地创建和管理游戏中的各种对象和效果。

3. 层（Layer）‍‍‍‍

Layer是用于管理游戏场景中不同元素的可见性和渲染顺序的概念。每个Layer可以包含一组游戏对象（如角色、道具、背景等），并控制它们在屏幕上的显示顺序和叠加关系。

通过使用Layer，开发者可以将游戏场景分为不同的层级，每个层级可以包含特定类型的游戏元素，如背景层、角色层、UI层等。这样可以更好地控制游戏中各个元素的显示效果，实现更丰富的视觉效果和交互体验。

在Flame中，开发者可以通过创建和管理不同的Layer来实现游戏中的层叠效果、深度排序和透明度控制，从而更好地呈现游戏画面和用户界面。Layer的使用使得游戏开发者能够更灵活地组织和管理游戏中的各种元素，提升游戏的视觉吸引力和交互性。

4. 输入处理(Input Handling)

Handling是指处理用户输入和交互的机制。通过Handling，开发者可以捕获用户的触摸、点击、拖拽等操作，并对这些操作做出相应的响应和处理。

Flame提供了丰富的手势识别和输入处理功能，开发者可以轻松地实现游戏中的交互操作，如点击按钮、拖动角色、放大缩小画面等。通过Handling，开发者可以为游戏添加更多的交互性和可玩性，提升用户体验。

总之，Handling是Flame中用于处理用户输入和交互操作的机制，它使得开发者能够更加灵活地响应用户的操作，并实现更丰富的游戏交互效果。

5. 资源管理(Assets Management)

AssetsManagement指的是管理游戏中所需资源（如图片、音频、字体等）的机制。通过AssetsManagement，开发者可以加载、缓存和使用游戏所需的各种资源，以便在游戏中进行渲染、播放音频、显示文字等操作。

Flame提供了方便的资源管理功能，开发者可以通过简单的接口加载和管理游戏中所需的各种资源文件。这包括加载图片、音频文件、字体文件等，以及对这些资源进行缓存和释放，以提高游戏的性能和效率。

通过AssetsManagement，开发者可以轻松地在游戏中使用各种资源，而无需过多关注资源加载和释放的细节。这使得开发者能够更专注于游戏的逻辑和交互，同时保证游戏在不同平台上的资源管理和使用的一致性和可靠性。

总之，AssetsManagement是Flame中用于管理游戏资源的机制，它使得开发者能够更便捷地加载、缓存和使用游戏中所需的各种资源，从而提高游戏的性能和开发效率。

6. 碰撞检测(Collision Detection)

CollisionDetection指的是检测游戏中物体之间是否发生碰撞的机制。通过CollisionDetection，开发者可以实现游戏中物体之间的碰撞检测，从而触发相应的游戏逻辑和交互效果。

Flame提供了丰富的碰撞检测功能，开发者可以轻松地检测游戏中不同物体之间的碰撞，如角色与障碍物的碰撞、子弹与敌人的碰撞等。通过CollisionDetection，开发者可以实现游戏中的物理交互效果，如碰撞反馈、碰撞后的动作变化等。

Flame还支持多种碰撞检测算法和技术，包括基本的包围盒碰撞检测、像素级碰撞检测等，以满足不同类型游戏的碰撞检测需求。

总之，CollisionDetection是Flame中用于检测游戏中物体碰撞的机制，它使得开发者能够实现游戏中的物理交互效果，提升游戏的可玩性和视效。‍‍‍‍‍

Flame游戏示例效果‍‍‍‍‍‍‍‍

在Google DevFest大会上，主讲者给我们演示了通过Flutter开发星际战争的游戏，游戏的效果大概如下。‍‍‍‍‍‍

由于Flame还有很多概念需要学习，这里就不展示源码了，待我慢慢研究之后，后续有机会的话再来分享。‍‍‍

如果需要游戏源码的小伙伴，可以后台回复“游戏源码”获取本游戏的源码。