基于移动平台的记忆类游戏的开发
作者:***
来源:《青年时代》2020年第25期
摘 要:随着手机、平板电脑等移动设备的普及,基于移动平台的电子游戏逐渐成为人们生活中一种常见的娱乐方式。如何高效地开发适用于各平台的游戏,并尽可能地挖掘其中的益智元素,就显得尤为重要。本文将利用Cocos Creator引擎实现一款翻牌类记忆游戏,该游戏能对玩家的记忆能力进行锻炼,并能基于Cocos Creator发布为适用于多种移动平台的APP,具有较强的跨平台性。
关键词:移动平台;游戏开发;记忆游戏;Cocos Creator
一、引言
随着移动终端技术的发展,手机、平板电脑等便携式设备日益普及,人们可以随时随地利用碎片时间进行学习或是娱乐。在移动APP蓬勃发展的背景下,基于移动平台的游戏开发逐渐呈现出上升的发展势头。
事实上,自文明诞生之日,游戏就一直伴随着人类的成长,它通常以一种娱乐的方式传递知识或是对智力进行锻炼。因此,当今的电子游戏,特别是移动游戏APP,也应体现出寓教于乐的价值。另外,移动终端不同于传统PC,不同的手机或是平板在平台及分辨率上存在较大的差异。如何高效地开发游戏APP,并使其能以较为统一的方式呈现给用户,就成为进行移动游戏开发时不可回避的问题。
为了对益智类移动游戏APP的开发进行尝试,也为了对解决上述问题的技术选型进行探索,本文研发一款基于Cocos Creator引擎的记忆类游戏。该游戏能通过娱乐竞技的方式对玩家的记忆力进行锻炼,并能基于Cocos Creator引擎发布到不同的移动平台上,实现一次开发、处处使用。
二、Cocos Creator引擎
Cocos Creator是以Cocos2D-X为核心的游戏引擎,主要面向2D游戏开发。除拥有Cocos2D-X强大的游戏开发功能外,Cocos Creator还具有脚本化的特点,支持JavaScript、Typescript脚本编程,能实现组件化以及数据驱动的项目开发。Cocos Creator提供了便捷的可视化组件架构方式,在编辑界面中能够以所见即所得的方式快速设计游戏场景以及精灵对
象等。在Cocos Creator中,脚本以组件的概念对应到节点,具有典型的面向对象的特点,便于开发者理解游戏逻辑。
实现的项目除了可以编译为桌面程序外,Cocos Creator最为显著的优势是能够非常便捷地将游戏工程发布为Android、IOS、等移动应用。与其他原生平台的开发方式不同,在利用Cocos Creator进行游戏编程时,无需针对各平台分别编写游戏代码。仅需使用JavaScript或Typescript进行一次开发,即可通过Cocos Creator发布为各平台对应的APP,真正實现了跨平台。在移动终端日益普及的背景下,这种对移动环境的支持使之具有极强的生命力。
三、游戏逻辑及系统结构
(一)游戏逻辑
本文所实现的是一款经典的翻牌类记忆游戏,界面中有16张卡片,每一张卡片对应一个水果,正面为水果图案,反面为卡片背面。默认情况下卡片均显示背面图案,当用户点击卡片时,卡片短暂显示水果的一面,用户需要在该段时间内记住水果图案类别。当连续两次点
击的水果类别相同时,消除掉这两张卡片,直至所有卡片均消完。完成游戏所用的时间越短,则说明成绩越好,通过记住卡片的操作来实现对记忆力的锻炼。
(二)系统结构
在游戏操作及运行过程中,由Cocos Creator引擎负责与用户的交互以及界面的渲染。而对于游戏的逻辑则有开发人员基于Cocos Creator引擎采用JavaScript语言实现,对应的需要完成相应的数据结构以及程序流程的开发。
根据游戏逻辑,最为重要的数据结构是针对每一张卡片所设置的若干状态位。各卡片对应的状态包括记录是否消牌成功的标志ClearState,以及卡片对应的水果类别标志等FruitType。
游戏中设置8个水果类别,每个类别对应两张卡片。初始时,对于每一张卡片随机设置不同的水果标志。对于游戏进行过程中玩家的翻牌操作,第奇数次翻牌设置为翻牌状态A,第偶数次设置为翻牌状态B。当状态A和B对应的水果类别相同时,这两次翻牌的卡片即可设置为消牌状态。当所有的卡片的消牌状态均被记录为成功时,游戏结束。游戏过程中设置计时器,计时的秒数即代表玩家的成绩,时间越短成绩越高。
在逻辑层面,整个游戏系统可以分为以下三个部分:
第一,UI以及界面渲染层。对于开发人员设计的游戏元素,由Cocos Creator引擎负责相关内容的纹理渲染和显示,并对用户UI操作事件提供响应处理函数入口。
第二,逻辑运行层。在Cocos Creator引擎提供的事件响应处理入口函数中,完成对用户UI操作的处理,并编码实现游戏的运行逻辑。
第三,数据层。对游戏的相关运行及状态数据进行设计和管理,为逻辑运行层提供必要的数据支持。
(三)程序流程
按照程序的运行机制,以及相应的数据结构,程序流程可设计如下。
步骤1:初始化ClearState数组每一位为false;初始化FruitType数组中的元素为八种水果类别中的一个,且每一类水果仅且出现两次;初始化翻牌动作ActionA和ActionB为null。
步骤2:处理奇数次翻牌动作,翻牌动作仅对ClearState为false的卡片有效。设置Action
A指向当前卡片,并将当前卡片做短暂的翻牌显示操作。
步骤3:处理偶数次翻牌动作,翻牌动作仅对ClearState为false,以及ActionA所指向卡片不同于当前卡片的卡片对象有效。设置ActionB指向当前卡片,并将当前卡片做短暂的翻牌显示操作。
步骤4:如果ActionA和ActionB所指向卡片对应的水果类型相同,则ClearState对应标志位设置为true,表示成功消除这两张卡片;否则ClearState不做任何改变。ActionA和ActionB重新置为null。
步骤5:如果ClearState的所有状态位均为true,则转到步骤6,否则转到步骤2等待下一轮翻牌动作。
步骤6:游戏结束。
四、相关技术实现
(一)游戏的界面元素
本文实现的是翻牌记忆游戏,游戏中的主要界面元素是16张卡片。对于这些卡片,在Cocos Creator中是根据“节点”来表现的。这里将卡片理解为节点,节点所需要的功能通过为其添加相应的组件来实现。例如:如果需要处理显示和基本操作相关的功能,则可添加“精灵”组件;如果需要动画功能,则可添加“动画”组件。在游戏中,由于涉及卡牌的显示和翻转,需要为其设置“精灵”和“动画”组件。
此外,对于背景图片对应的节点,也设置“精灵”组件。为便于背景显示的方面,设置其“精灵”组件的Type显示类型为SLICED即“九宫格”模式,该模式按九个区域的方式对图片进行划分,以便于图片以边界不变形的方式进行拉伸,比较适合作为大小可能调整的背景。
而对于“Play”按钮,则可使用内置的UI元素Button来实现。当点击该按钮时,可以开始新一局游戏。在Cocos Creator中,指定按钮下“Background”节点的精灵组件中的Sprite Frame为我们设置的图片。然后设置Button的“Transition”属性为“COLOR”,这样按钮图片的颜深度就會随着按钮按下划过等状态的改变而改变。按钮的事件响应函数,则对应着脚本中的编写的OnBtnPlay()函数,相关操作逻辑写在该函数中。
(二)翻牌动画的实现
Cocos Creator引擎中暂时还未提供图片翻转的动画功能,但可通过两张图片交替显示的方式变通实现。
设置16个正面卡片和16个背面卡片,分别置于下层和上层,默认背面卡片遮住正面卡片。初始时背面卡片Opacity透明参数为255,即完全显示;正面卡片Opacity参数为0,即完全不显示。当玩家点击背面卡片时,正面卡片运行Opacity渐变动画逐渐显示,而背面卡片则反之,这样就形成了一个由背面向正面的翻转动画。
在这个过程中,Opacity渐变动画是通过Cocos Creator操作界面中的“动画编辑器”实现完成,在Animation Clip中添加Opacity属性,在时间线上的两个关键帧中设置透明度变化的起始值。
(三)游戏的脚本挂载
通过以上的界面以及动画设计,可以实现游戏的部分功能,这种所见即所得的实现方式也是Cocos Creator引擎提高游戏开发效率的关键所在,但游戏的内在逻辑还是避免不了需要编程实现。
本文所述游戏项目使用JavaScript脚本进行程序开发,每一个JS文件对应一个脚本。对于脚本而言,需要挂载到一个节点上,也就是为该节点添加脚本组件。为了在脚本中能对游戏的全局进行操控,本文将脚本挂载到所有游戏界面元素的顶层节点上,即挂载到了默认最顶端的Canvas节点元素上。
(四)事件的相应
在于界面中的“Play”按钮,Click Events事件数设置为1,对应的响应函数则设置为脚本中的OnBtnPlay()函数。而对于正面卡片和背面卡片,在脚本中分别声明大小为16的数组,数组元素的类型为cc.Sprite。在Cocos Creator操作界面中,将对应卡牌拖到数据源窗口中,实现数据的绑定。
而对于点击翻牌的卡片,则用()函数注册事件,并指定响应函数。在这里,事件的类型使用系统内置的cc.Node.EventType.TOUCH_START。该事件既能响应桌面系统的鼠标点击操作,又能关联到手机或平板电脑上的触摸操作,具有较强的平台通用性。
(五)针对移动平台的游戏发布
学编程的游戏app Cocos Creator支持将游戏项目发布成Android、IOS、等移动平台上的APP形式。以Android为例,在环境设置中设置好NDK、Android SDK、JavaScript引擎以及Cocos2D-X引擎的路径后,即可通过项目的“构建→编译”步骤实现目标程序的生成。对于开发人员而言,可以做到移动平台差异性的透明性。
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论