交谈
前段时间,我计划制作一款微信迷你游戏,它当然是独立游戏,只是为了了解迷你游戏的开发过程,我最终选择了一款经典的迷你游戏Tetris作为演示。 。源代码已托管。 Github,当然,这个游戏演示不是用户友好的,但是它使我得以入门小程序并开发XD。
演示地址:
准备
在进行任何开发之前,您需要对要开发的东西有一定的了解和准备;
迷你游戏原理:微信迷你游戏是一种H5游戏,我是这样理解的;在H5中,有一个Canvas(画布),它与计算机画布非常相似。新颜色覆盖旧颜色,并且不记录旧颜色。但是游戏可以具有FPS的概念。例如,我们可以使用该程序每秒绘制50帧Canvas(画布),即FPS为50,然后可以移动游戏的各种屏幕;但是,小型游戏也有一定的限制。例如,最终游戏包(代码+资源)不能超过4M。当然,也可以通过分包加载的方式加载游戏,最大不能超过8M。 ;
帐户:开发微信小程序之前,您需要在微信公共平台上申请开发帐户。如果您只是在学习,那么申请个人帐户完全可以。应用程序完成后,在settings-development设置中会有一个AppID。创建新项目时,需要使用此徽标;此外,该平台还提供了许多文档和API供学习和咨询;
开发工具:对于工具,微信还提供了特殊的开发工具,可以在微信公共平台上下载;
游戏引擎:无论采用哪种开发方式,总会有一些方便的集成工具供所有人使用,人多而功能强大;在这里,我选择了LayaBox游戏引擎,因此在开发开发工具时需要下载LayaIDE,在此处编写并发布游戏,最后在特殊的微信开发工具中进行调试和上传;
语言选择:如果您使用LayaIDE来开发小型游戏,则它支持三种语言:ActionScript,JavaScript和TypeScript。第一个是ActionScript。我从未接触过这种语言,与其余两种语言相比,只有我可以做更多的Flash游戏,而且我不了解Flash游戏,因此我首先通过了它。 JavaScript语言仍然相对熟悉,但是由于它是一种较弱的语言,尽管最近引入了许多补偿措施,但我没有太多时间来做。尝试一下,所以请先保存。最后,TypeScript被称为JavaScript的超集。它还具有一些静态语言功能,例如类和变量。这是我接手的最好的语言。所以我选择使用TypeScript来开发小型游戏;另外,该演示包含一个简单的TypeScript学习文档,您可以首先阅读它,相信会对您有所帮助;
环境设置:
1、前往微信公共平台申请微信公共平台帐户,下载并安装微信网络开发者工具;
2、转到LayaBox下载LayaIDE开发工具,根据该教程配置TypeScript编译环境,在技术文档TypeScript主题的官方网站上有一个教程,但我不会过多介绍在这里;
开始开发
实际上,当使用微信 Web开发人员工具进行开发时,将会有一个模板游戏。当然,您也可以根据其架构和API开发小型游戏。但是,由于我的技能不是最新的,所以我开发了游戏的一个版本(使用JavaScript),可以完成调试和运行,但不必在手机上进行调试,我不必太担心。直接转移到LayaIDE开发。毕竟,官方网站上有更多的案例和API。除非有特殊情况,否则后续开发为LayaIDE。发展;
1、新项目,在这里我们选择2d项目和TypeScript项目,由于小程序游戏包的大小限制,当我能够控制资源大小时,我选择了更简单的2d项目</>
2、项目结构:1是项目的入口文件,等效于Main文件。至于为什么是入口文件,将在下面提到; 2是引用的代码资源,它封装了2d项目所需的打包类; 3项目的场景资源文件,包括音频,视频,图片和游戏所需的其他资源;
3、bin文件夹:此文件夹是编译后运行的文件夹,更重要的是,让我们在下面对其进行详细介绍;
实际上,尽管我们使用TypeScript来开发小型游戏,但最终我们仍将编译为JavaScript文件,并通过执行JavaScript文件来运行小型游戏。但是,使用TypeScript比开发JavaScript更加严格。如果您的JavaScript非常强大,那么您也可以尝试使用JavaScript编写;
里面的js文件是上述项目结构中libs编译的结果,并且将
将每个打包的模块编译成每个文件
里面的js文件是上述项目结构中src编译的结果,并且相应的ts文件被编译为相应的js;
此文件用作微信迷你游戏的执行文件,因此我在这里无需特别注意;
这用于微信小程序在发行后引用了多少个js文件(编译的库和js文件)。如果程序中未使用任何模块,则可以在此处删除它们以减少代码编号
4、项目编写:在项目的总体结构与编译器几乎相同之后,我们开始编写自己的小程序 -Tetris,开发过程有点,反正就是使用api,这是在官方网站上的很多案例和代码;
首先删除以前的代码和资源文件,然后构建自己的项目。发布之前,我注释掉了index.html文件中未使用的js引用
5、发布,选择发布平台,让我们从一个简单的发布开始,不包括版本控制等;发布后,我们会得到一些文件,实际上,libs文件夹不是很有用,尽管它是编译后的一个包文件,但是项目中实际运行的所有代码都会自动压缩到code.js文件中由LayaIDE。因此,可以删除libs文件夹以减小游戏包的大小。有个坏消息,那就是我上面提到的资产文件夹资产尚未发布,我也不清楚发生了什么。我只能手动将其复制出来,并在code.js文件中找到引用路径并正确对其进行修改;
[k39]微信 Web开发人员工具的最终调试,打开开发人员工具,打开项目,输入我们的AppID,然后打开LayaIDE发布的项目;如果模拟器可以正常运行,请单击长时间的预览,您可以在手机上看到它。如果移动设备预览正常,则可以单击“上传”以上传到微信公共平台;
7、到目前为止,只有您可以看到开发情况。如果要其他人玩自己的游戏,则需要最后一步。在微信公共平台开发管理中,您刚刚发布了上载的项目。当然,游戏的真实发行版需要提交审查。有很多东西要准备(各种材料),所以我选择了试用版,只能由我指定的人演奏,但足够了。无论如何,其他人已经玩过它,等到要制作出真正有趣的游戏,然后认真发布;
再次交谈
下一个目标:
1、了解如何使用子程序包加载游戏,较大的游戏程序包可以带来更好的游戏(尽管最多8M);
2、学习使用网络,下一步是制作一个简单的网络游戏;
3、了解如何优化代码,删除不必要的资源并简化游戏包的大小;
最后,可以运行由LayaBox制成的俄罗斯方块。尽管该游戏功能很少,但它只是在微信公共平台上发布的体验版。只能指定几个人玩(顺便说一句,很少有人在玩这个游戏。)但是,除了提交和审查的最后一步之外,其他过程都已经过了,最后是一个微信迷你游戏可以设置为0到1。我很高兴,在这里分享我最近学到的东西,希望有人可以使用它,并且在这里。