快速体验

D5-Howard edited this page Jul 19, 2018 · 5 revisions

欢迎访问D5Power游戏框架项目的Wiki。我们建议您在体验前安装好D5Power编辑器。

编辑器Windows版(ver 3.0 beta):点击下载

编辑器Mac版(ver 3.0 beta):点击下载

下载并安装Egret EngineEgret Wing,如果需要了解更多关于Egret引擎开发的相关知识,请移步Egret开发者中心

创建项目

您可以通过以下两种方法创建新的目录

运行下载好的编辑器,将提示您是否建立新的项目。选择建立新项目,选择一个空目录。编辑器将会自动向空目录中复制项目所需的文件,并将项目目录设置为当前新建的项目。

如果您想获取到最新的代码,可以从GitHub中D5Power项目页面中获取源代码,我们为各位准备好了模板文件。请从源码目录中找到D5PowerTemplate,并复制至电脑的任意位置。然后运行刚才下载好的D5Power编辑器,选择“设置项目路径”,会弹出项目设置框。请选择至刚才复制好的模板目录中的GameTemplate目录。

在您以后运行编辑器时,依然可以通过菜单栏的“项目”一栏,选择“设置项目路径”来进行新建项目或重设项目路径。

从资源中心获取界面风格

我们在资源中心中,为大家准备了各种游戏素材。在快速体验中,我们将获取一个界面风格,以方便大家进行界面制作。 在D5Power编辑器中,点击顶部菜单的“资源”菜单,在下拉菜单中,选择共享资源库。 在右侧的资源分类中,选择界面。 选择一个界面风格,点击下载。并在下载完成后,输入一个界面风格名(建议使用数字或字母),并在提示“是否启用该风格”时,点击确认按钮。确认启用该风格。编辑器将自动在刚才的项目源码中添加风格加载代码。

制作界面

如果您没有将风格名设置为“default”,编辑器在每次启动时不会自动加载。请在编辑器顶部菜单的“项目”菜单中,选择“加载子素材库”,在弹出的文件选择界面中,选择"assets/ui/您刚刚输入的风格名"目录中的PNG图片,编辑器将自动加载该界面风格素材。

点击编辑器左侧的"九宫窗"按钮,选择一个自己喜欢的窗口,拖拽到工作区。

点击保存按钮,将当前界面存在模板项目的resource目录下。建议使用英文或数字进行保存。

保存完成后,通过编辑器顶部菜单的"文件"菜单中,"生成代码"功能,为当前的界面生成TypeScript代码。默认将生成类名为NewUI的类。文件路径为com.d5power.ui。

在代码中显示设计好的界面

打开Egret Wing,通过"文件"菜单中的"打开文件夹"功能,选择刚才复制出来的GameTemplate目录,这时,Egret Wing的左侧文件列表中,会显示出该目录下的全部文件。请在src/目录中,找到Main.ts,双击打开。

找到uiReady方法,并在一堆大括号中写入以下代码:

this.addChild(new d5power.NewUI());

其中,NewUI是您刚才生成代码时输入的类名。

运行程序

点击Egret Wing的调试图标,即可运行程序,看到您刚才创建好的界面。

如果需要导出微信小程序,请查看微信小游戏导出步骤。

如果需要查看本文的视频教程,请点击这里

You can’t perform that action at this time.
You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session.
Press h to open a hovercard with more details.