对于一个只在大学期间学习了JavaScript,实习期间学习了点HTML、CSS的菜鸟,做游戏对我而言是一件想都不敢想的事情,后有幸被公司安排参与一款HTML5游戏的开发,才使我真正第一次与游戏来了次亲密接触。
这次开发的游戏,界面布局比较复杂,子界面也比较多,在开发的时候并没有考虑太多,只是想着快些把游戏效果做出来,快些看到游戏效果,结果踩了很多坑,当然也有不少收获:
1、图集的妙用:图集是将一些零散的图片资源整合到一张大的图片中,方便在项目中管理图片资源。
比如,如果在游戏中,有两个UIImage节点,并且两个节点的图片资源是分散的,这时候要通过代码来设置两个节点的图片资源的话,就必须通过game.assets.load()方法来一部加载图片,载到图片后在设置到对应的节点上;但是如果将图片资源打包成图集的话,要用到图片资源的节点都引用这个图集资源,需要改变显示图片的话,就只需要image.frame = ‘imageName.png’就可以了,这样即减少了服务器请求次数,也缩短了新资源的显示时间。
图集还有一个一个妙处就是可以增强游戏绘制性能,在WebGL渲染方式下,图集的使用可以减少绘制时图集的频繁切换,形成批量绘制,让游戏表现更流畅。但是要达到批量绘制的效果的话,UIImage节点就需要尽可能的排布在一起,为什么这么说呢,在游戏中少不了有文字的存在,如果在一堆的UIImage节点中添加了一个UIText节点的话,批量绘制就会被中断,所以节点找对组织很重要,找错了,性能就有可能大大的受影响。
上面提到的批量绘制也就在WebGL渲染方式下起效,但是目前移动端设备上的浏览器对WebGL的支持参差不齐,手机游戏购买存在不少的问题,因此游戏发布并不建议使用WebGL的渲染方式。建议使用Canvas的渲染方式发布,我使用的青瓷引擎目前对Canvas的支持做了不少的优化,在浏览器适配上花了很大的功夫。
2、页面缓存:部分节点由很多部分组合而成,而且每个组合部分,很少变动。如果将节点缓存为一张图片,那么可以减少绘制,提升性能。有鉴于此,提供了qc.CacheAsBitmap功能,将节点缓存为图片。
页面的缓存并不是用的越多越好,因为缓存是占内存的,用多了,内存有可能会hold不住;还有一点是变化比较频繁的节点也不适合使用缓存机制。
3、屏幕自适应:在游戏开发中,分辨率适配问题是一个比较头疼的问题,青瓷引擎提供了一套成熟的解决方案,让你不再为分辨率适配问题头疼。由于比较复杂,我在这里就不详细介绍了。
屏幕自适应的好处在于,设置了适合自己游戏的显示类型后,整个游戏就可以根据选择的类型做一些绝对坐标的布局 ,比如,manualType选择了Expend,referenceResolution设置了960*640的分辨率,那么整个游戏界面的坐标布局设计都可以根据960*640来设计,即使你在游戏布局中节点偏移值设置死了,界面的布局也不会存在错位问题。
以上就是我的心得,当然,作为一个菜鸟肯定有些地方说的不够全面或者不对的地方,希望大家可以提一些意见,多多交流一下,后续我也会继续分享我的游戏开发心得,让后来的学弟学妹少踩坑,也是自我的不断学习。