跳到主要内容

第一章：初识 Dora：游戏开发入门

  在本章中，我们将一起踏上 Dora 游戏引擎的学习之旅。你将了解 Dora 的基本概念，学习如何搭建开发环境，并创建第一个简单的游戏项目，为后续的学习打下基础。

提示

  在本教程中，我们将使用 TSX 语言编写游戏代码。如果你对 TSX 不熟悉，建议先学习一下 Dora 的这篇 TSX 新手教程。如果是希望对编程语言有更加充分和深入的学习准备，可以参考官方的 TypeScript 和 JSX 的基本知识。但是上手这个系列教程实际只用了解 TSX 的基本语法，或是干脆就全凭自己对编程开发的常识和经验大胆试试看吧。

1. Dora 是什么？​

  Dora 是一个跨平台的开源游戏引擎，旨在帮助开发者在多种设备上快速构建游戏。它内置易用的开发工具链，支持在手机、开源掌机等设备上进行游戏开发和编程学习。通过 Dora 引擎，开发者可以使用 Lua、Teal、TypeScript、YueScript 等多种编程语言编写游戏逻辑，极大地降低了开发门槛。

2. 搭建开发环境​

  根据不同的操作系统，Dora 提供了灵活的安装方式。请根据您的设备系统按照以下步骤进行安装。

  1. 在游戏的运行终端上下载并安装 Dora SSR 软件。详细安装步骤请参考这里的安装步骤。
  2. 运行应用程序；若进入 Mobile 界面，先点击 Feed 左上角「传统模式」，查看 Web IDE 服务器地址。
  3. 在同一网络的 PC、平板或其他开发设备上，通过浏览器访问该服务器地址。
  4. 现在，你可以在浏览器中开始游戏开发了。

3. 编写第一个游戏程序​

  安装完成后，你可以通过 Dora 的 Web IDE 编写和运行游戏。以下是创建第一个简单项目的步骤。

第一步：创建新项目​

  1. 打开浏览器，访问前面启动软件时显示的服务器地址，进入 Dora 的 Web IDE。
  2. 在 Web IDE 左侧资源树中右键点击「工作空间」根目录；触屏可长按。
  3. 选择「新建」→「文件夹」，输入 Hello，勾选「创建为项目」，将「项目类型」设为 TSX，点击「确定」。编辑器会自动创建 Hello/init.tsx 并打开「Dora」对话页签。

第二步：编写游戏代码​

  1. 展开资源树中的 Hello 文件夹，打开自动生成的 init.tsx。

  2. 用以下示例代码替换文件的原有内容：

    Hello/init.tsx
    // @preview-file on clear
    import { React, toNode } from 'DoraX';

    // 创建一个显示文本的节点
    const HelloDora = () => (
    	<label fontName='sarasa-mono-sc-regular' fontSize={60} text='Hello, Dora!'/>
    );

    // 将节点添加到游戏界面
    toNode(<HelloDora/>);

  3. 代码编写完成后按 Ctrl + S（macOS 为 ⌘ + S）保存。示例中的 // @preview-file on clear 标记会在保存修改时自动运行当前文件并清空日志；引擎窗口会显示“Hello, Dora!”。没有预览标记的文件需手动运行。

第三步：再次运行游戏​

  1. 保持 Hello/init.tsx 打开，找到工具栏的三角形「运行」按钮。工具栏在桌面宽屏下位于右下角，紧凑布局下位于顶部。
  2. 点击「运行」，或按 Ctrl + R（macOS 为 ⌘ + R），运行整个项目。方形「停止」按钮可结束运行。
  3. 程序会自动重新编译并运行，你可以看到游戏窗口中显示“Hello, Dora!”的文字。

4. 探索 Dora 的开发者工具​

  Dora 的 Web IDE 为开发者提供了代码编辑、资源管理、实时预览等功能：

  • 资源树：在左侧显示项目的文件和文件夹，便于组织项目结构。
  • 代码编辑器：支持 Lua、Teal、TypeScript 和 YueScript 等多种语言的语法高亮和错误提示。
  • 实时预览：启用 @preview-file on 或 @preview-project on 后，保存修改可自动运行当前文件或所属项目，便于查看效果。

  通过这些功能，你可以轻松完成游戏的编写、调试和运行操作。

5. 总结和展望​

  在本章中，你学会了如何在不同平台上安装 Dora 并搭建开发环境，创建了第一个简单的游戏项目，并熟悉了 Dora Web IDE 的基本使用。你已经为接下来的学习打下了基础。

  说到进行游戏开发，我们肯定是缺少不了要对游戏做设计。在这个系列的教程中，我们将会带你一步一步的完成一个名叫 Dodge the Creeps 的游戏。这个游戏的设计思路如下：

  • Dodge the Creeps 是一款简单却富有挑战性的生存游戏，玩家需要不断躲避从四面八方袭来的敌人，尽可能保持存活的时间。设计思路包含以下核心元素：

  • 游戏目标：玩家控制一个角色在屏幕中移动，躲避来自随机方向的敌人。游戏的目标是尽可能长时间地存活，过程中得分会逐步增加，展示玩家的生存技能。

  • 敌人生成和移动：敌人会从屏幕边缘的随机位置生成，并以一定的速度朝向玩家移动。随着游戏进行，敌人的速度或数量会增加，提升游戏难度。

  • 玩家角色控制：玩家可以通过键盘或手柄控制角色的上下左右移动。角色的移动需要足够灵活，帮助玩家躲避敌人的攻击。

  • 碰撞检测与游戏结束：当玩家与敌人碰撞时，游戏结束。此时会显示游戏得分和“Game Over”字样，提供给玩家简单的反馈。

  • 开始界面和得分显示：游戏开始时，有一个简单的启动界面，玩家点击开始按钮即可进入游戏。游戏过程中，得分会实时显示在屏幕上。

  Dodge the Creeps 的核心设计简单明了，但它考验了玩家的反应速度和策略思维，是一款很好的新手练习项目。从下一篇教程开始，我们将一步步实现这些设计，构建完整的游戏，希望你能够跟随我们一起完成这个项目吧。