Mighty Editor 基础教程之开发环境
发布于 4 年前 作者 MngYou 3707 次浏览 来自 分享

首先,在谷歌浏览器的地址栏输入: 黑马在线编辑器进入游戏开发环境。 欢迎界面如下: image.png 登录 一般只用作赞助和学习编辑器案例,此处略过 image.png 最近工程 如有需要对已有工程进行编辑,直接单击工程,若是不需要该工程,可按垃圾桶图标进行删除。 image.png 创建新工程 欲创建新工程,直接单击进入开发环境。 编辑器相关 对编辑器的一些说明,包括编辑器的特性。 再来,单击创建新工程进入游戏开发环境。 IDE界面如下: image.png 菜单栏选项分别为工程、导出、运行、帮助与支持, 最右边从上到下三个栏目分别为Assets(资源管理)、Objects(对象管理)、Settings(属性设置), 中间为地图编辑器(画布)、代码编辑器、左边即地图编辑器的工具栏, 下方assetPreview、timeline分别为资源预览和时间线(动画编辑器)。 image.png 工程下的选项可以保存游戏工程和导入游戏工程。 image.png 导出下的选项, 第一个是按照Phaser.io格式导出(正常写法); 第二个WebApp是按照MightyEditor格式导出(编辑器代码格式); 第三个是导出为安卓apk,需要对开发商进行赞助; 最后两种没用过,不清楚,略过。 image.png 资源管理, 首先是上传素材,直接在资源管理界面的工具栏选择上传方式:单文件上传、文件夹上传,也可以直接将素材(目录)拖拽到编辑器界面内。 如有不需要的素材,先将其选中,再按工具栏上的垃圾桶图标进行删除。 那我们现在就先导入素材(直接将素材拖进编辑器) image.png 如此,素材便已经被加载到了编辑器资源管理器中。 编辑地图,只需要将素材从资源管理器中拖到地图画布放置: image.png 要查看当前素材的属性,或是对其进行属性设置,先选中该对象: image.png 直接在对象管理器中单击对象选中,亦或是单击画布上的素材,继而单击资源预览中的素材图像。 image.png image.png 我们在画布上创建素材之后要记得在代码中进行对象的创建,不然在画布上虽然已经创建好了,但是我们却没有办法对其进行控制(如角色移动,动画特效)。 代码界面如下: image.png mt.data.js文件是我们在画布上创建的地图的信息,不可或缺! image.png 我们一般只对场景文件中的demo.js文件进行代码编辑。 image.png create函数中的原有代码,其功能为将画布上的元素显示出来,但是这边的动画不执行,如果有用到动画编辑器的,需要自己开启动画对象的动画播放。 个人建议将原有代码删掉,因为这边我们需要对元素进行控制,创建出对象是从data数据里面,所以创建好之后就会显示。留着反正bug不断,看个人取舍。 删掉原有代码后,写上如下代码: this.block = mt.create(‘block’);//创建对象并在游戏中显示该元素。 block即对象管理器中该对象的名称: image.png 这节对Phaser开发环境的讲解到此结束,冗余过头了。。。

2 回复

吕老师,辛苦了

回到顶部