1.菜鸟教程 | 微信小游戏好友排行榜教程
2.EGRET白鹭引擎游戏开发exml的码分创建及使用教程(第六期)
3.VSCode技术揭秘(一)
4.白鹭引擎开发猜拳游戏
菜鸟教程 | 微信小游戏好友排行榜教程
菜鸟教程分享微信小游戏好友排行榜制作过程,涵盖创建项目与发布、码分添加小游戏、码分开启开放域功能、码分主域与开放域通讯以及ShareCanvas与原生Canvas布局。码分
创建项目并发布:启动Egret项目,码分疲劳驾驶检测源码 gui通过Launcher发布,码分使用个人AppID(测试用的码分id限制功能,如分享)。码分
添加小游戏:设置中添加小程序(通过审核即可)。码分
开放域功能:利用微信开发者工具或终端运行egret run --target wxgame,码分修改game.json配置,码分打开开放域功能。码分
ShareCanvas介绍:使用离屏画布绘制排行榜,码分ShareCanvas允许主域与开放域共享访问权限。码分
渲染效果:index.js文件提供简单排行榜demo,显示效果可见。
主域与开放域通讯:通过共享数据接口进行单向数据交换,主域请求,开放域响应。themebetter源码
布局建议:使用舞台宽高作为基数调整样式,避免不同手机适配问题,注意安卓显示BUG。
源码链接:深入理解本文代码,参考源码链接:/shenysun/FriendsList
EGRET白鹭引擎游戏开发exml的创建及使用教程(第六期)
本文为《EGRET白鹭引擎游戏开发》系列教程的第六期,旨在指导零基础开发者如何自研一款H5游戏并上线。本期教程将重点介绍EGRET引擎中EXML的创建与使用方法,以及如何实现EXML的适配,帮助开发者更好地进行游戏界面设计与布局。
在使用EXML时,设计师首先需要了解EXML界面中各种控件的功能,通常通过询问程序员或查阅资料即可在1-2小时内掌握基本操作。特别值得注意的是约束功能,它对游戏的适配具有重要影响。合理配置约束,可以实现界面的拉伸、居中对齐等效果,提升游戏的视觉体验。
使用EXML进行界面设计时,DNFwpes源码有几个关键点需要注意:
1. **默认TWEEN动画**:如果动画不是装载在GROUP里,避免直接修改XY属性。确保每个帧都设置好属性,以实现流畅的动画效果。
2. **自定义参数**:有些参数可能在EXML的常规属性中找不到,这时可以在源代码文件中自行添加。例如,BitmapLabel的Offset(锚点)可以直接在EXML文件中进行设置。
3. **分组与模块化**:对于内容较多的界面,建议使用组或GROUP进行封装,以便于后续的代码控制和管理。
4. **新增BITMAPLABE**:在新增BITMAPLABE时,记得重启编辑器,以确保新增组件生效。
在TS(TypeScript)中,通过简单的代码调用即可使用EXML,示例代码如下:
actionscript3
public constructor() {
super();
this.addEventListener(eui.UIEvent.COMPLETE, this.WarinitUI, this);
this.skinName = "resource/egamexml/War.exml";
}
对于EXML的适配,推荐一种简单且效果良好的方法,即在配置类中直接编写代码,wrappersimpleapp源码实现界面自适应。示例代码如下:
actionscript3
export function setScreenAuto(_target) {
_target.left = 0;
_target.right = 0;
_target.top = 0;
_target.bottom = 0;
}
加载完EXML文件后,只需调用`setScreenAuto(this)`即可完成适配。默认的数据缩放模式设置为`SHOW_ALL`,通常无需额外调整。设计师通过合理配置EXML的约束,可以轻松实现界面布局的调整,提高开发效率。
接下来的教程将涵盖JSON格式的使用与配置档的介绍,敬请期待!所有内容将在知乎平台持续更新,欢迎关注!
VSCode技术揭秘(一)
Visual Studio Code(VSCode)是一个轻量且功能强大的开源代码编辑器,基于Electron框架,使用TypeScript开发,内置Monaco编辑器,且拥有丰富的插件市场。它允许开发者扩展功能,如语法高亮、变身源码API提示等,但为保证UI稳定,不支持直接定制底层DOM。对于希望基于现有基础定制专用IDE的开发者,VSCode是一个理想选择,如Weex Studio、Egret Wing等IDE都基于其扩展。
深入学习VSCode源码,首先需要具备Node.js和JavaScript的基础知识,尤其是对Electron有基本理解。Electron是基于Chromium和Node.js的跨平台技术,允许创建能在Mac、Windows和Linux上运行的桌面应用。它包含主进程和渲染进程,主进程负责核心功能,渲染进程负责UI交互,两者通过IPC模块进行通信。
Monaco Editor是VSCode的重要组件,它与VSCode在代码编辑和UI上保持一致,但因为平台不同,VSCode提供了更全面的功能和性能。TypeScript的使用使得VSCode源码编写更为清晰,学习时需对其有基本了解。
VSCode的架构包括独立的扩展Host进程,以及后台进程、编辑器窗口进程等。主进程负责文件读写、异步I/O,插件进程独立运行以避免阻塞UI,Debug进程和搜索进程则处理特殊任务。在开发环境中,需要正确安装和配置,包括科学上网可能的网络需求。
源码下载和编译过程涉及逐步安装依赖和构建工作,最终产生可运行的VSCode应用。代码结构上,VSCode的核心功能和扩展分别位于src/vs和extensions文件夹,源码的运行环境和定制可以通过product.json和资源文件夹进行调整。
白鹭引擎开发猜拳游戏
本文介绍如何利用白鹭引擎(Egret)开发一款猜拳游戏。白鹭引擎是一款基于HTML5的高性能游戏开发框架,适用于跨平台游戏开发。
游戏功能包括四个页面:开始页面、游戏页面、结束页面以及试玩榜页面。在开始页面,通过创建bitmap对象,实现背景和位图绘制。此外,需要添加两个按钮的事件监听,如开始游戏按钮和试玩榜按钮。
在游戏页面,用户进行游戏操作。结束后页面展示游戏结果,而试玩榜页面可能包含用户排行榜或其他相关数据。
发布游戏时,主要涉及H5方面。使用命令行发布项目,参数包括项目名称、版本、目标运行环境(HTML5或原生)等。打包完成后,将生成的bin-release文件夹中的内容上传至服务器。在本地测试时,启动一个简易的http服务器,通过手机或浏览器访问服务器即可查看游戏。
在代码优化方面,应尽量抽取重复或通用代码,利用ES6语法简化代码。对于复杂的逻辑,如多重嵌套for循环,可以采用更高效的方式进行优化。此外,了解并熟练使用Egret提供的核心类,如DisplObject、DisplayObjectContainer、Bitmap、Shape、TextField、BitmapText、Sprite以及Stage,能有效提升开发效率。
Egret中事件处理机制提供了一套标准的架构,允许开发者专注于数据传输和事件实例化。在游戏开发中,实现按钮交互效果,如点击开始游戏或查看排行榜,都涉及事件监听和处理。
为了确保代码优雅且高效,需要在编写过程中不断优化,考虑多种实现方法并选择最优解。在Egret中支持ES6,但默认配置可能限制了部分ES6特性,因此需要调整tsconfig.json文件以启用ES6语法。
若遇到配置或构建问题,如本地与远程库冲突,应仔细排查并解决,确保项目顺利运行。最后,源代码中包含详细注释,易于理解,未在此赘述。
综上所述,使用白鹭引擎开发猜拳游戏是一个涉及多个页面、事件处理、性能优化和发布流程的综合项目。通过遵循上述步骤和实践,开发者可以高效地构建出功能丰富、用户友好的HTML5游戏。