cocos2d-x萌新指南(六)——制作弹窗

DinS          Written on 2016/4/22

第六话 劲敌

“那个苦恼国的大王,上半身透出冰外。我的身材和巨人相比,正合巨人和他的臂膀相比。”

——《神曲》地狱篇34:28-31

继续制作弹窗效果,对那些初次接触编程的童鞋来说,本话中的编程方法有一个思维的提升,做好准备。(其实不难,而且会有详细的分析 )

上一话已经获取了lv1的层和按钮。现在来具体实现弹窗效果。我们的思路是lv1的弹窗一开始设置为不可见,当点击相应按钮后变为可见,这样在玩家看来是弹出了一个窗口。这个效果就要在lvpop_Callback函数中实现。具体代码如下:

这段代码写在init()之后,看起来有些复杂,但是细致分析的话结构很简单。

整个函数就是一个switch-case结构。这个结构的功能是根据switch后面变量的数值,执行相应的case里面的语句。具体来说这里的switch后面的变量是type,虽然我们不知道type具体是什么,但是根据case的表述可知这里对应的是触屏操作,当手指碰到屏幕时是BEGAN,在屏幕上移动时是MOVED,手指离开屏幕时是ENDED,意外情况是CANCELED。跟case并列的default表示当type变量没有一个符合case条件时,执行default后面的语句,这里就是什么都不做。Break表示执行完某个case内的语句之后不执行接下来的语句。

当理解了这些后情况就比较明显了,按下按钮后真正执行效果的时机是手指离开按钮的时候,因此我们的代码应该放到ENDED里面,其他情况全部空着。在ENDED里面我们要让lv1的弹窗显示,于是就使用setVisible(true)这句代码,一句就够了。->前面的内容可以理解为让某个对象执行该语句,这里就是让Panel_lv1执行。

根据同样的原理可以写出关闭弹窗的代码,如下:

这里我们使用了简略手法,既然只有ENDED内部才有实质性代码,那么其他的情况都可以归为default里面。

总结一下,我们获取了lv1相关的层和按钮,并为按钮绑定了弹窗和关闭函数,在这两个函数中实现了具体的效果,即setVisible(true/false)。现在是来检验成果的时候了。F5调试,点击lv1按钮效果如下:

恭喜,你已经掌握了cocosstudio和弹窗的相关技术了。 这并不难吧。


我们的教程一直都很基础,但现在是时候该来点儿提升了,要开始向程序员的思维迈进。并不难,要有信心。

现在我们来思考一个问题,如何完成全部5关的弹窗效果。你可能会想,既然我们已经解决了第一关的弹窗效果,那么剩下的就如法炮制,写5个弹窗函数,5个关闭弹窗函数,分别将这些函数绑定给不同的按钮。这个思路再自然不过,而且可以解决问题,而且当初我就是这么写的 。但是that’s not good enough。如果有100关呢?写200个函数?显然不现实。现在来具体地思考一下,不管是弹窗还是关闭,实质性的代码都是XXX->setVisible(),区别只在于XXX不同,对于第一关来讲XXX是Panel_lv1,对第二关来讲XXX是Panel_lv2,那么可不可以把这些抽象出来,使用一个函数来处理相同问题,具体的对象在执行的时候再具体确定呢?当然可以,有了这种思路就说明开始上道了。

为了实现这种思路,再次进入.h文件,获取必要的控件,并在两个函数中增加一个参数,如下所示:(忘记写Button*  btn_lv2了 )

两个函数的变动仅仅在于增加了Layout* panel这个参数。在此有必要再次复习一下函数的知识,函数接受若干参数,使用这些参数经过一些运算,得出结果。在这里我们传入了一个panel参数,该参数的类型是Layout*。这样改有什么意义呢?进入.cpp做出如下修改:

增加了参数,跟.h中保持一致,之前的Panel_lv1改为了panel,注意这里的panel是灰色的,跟参数中的panel一样。没错,这里的意思就是作为参数传入的那个panel去执行setVisible()语句。如果你在调用该函数时给出的参数是Panel_lv1,那就是Panel_lv1执行;如果是Panel_lv2就是Panel_lv2执行。于是通过这样修改我们使用了相同的函数实现了不同的功能。

之后进入init()函数中获取控件,并绑定修改后的函数,注意顺序和写法。

两点解释。一是注意顺序,由于函数中传入了Panel_lv1和Panel_lv2参数,所以要先获取这两个控件,不然报错给你看。 二是具体的写法,传入的参数在this之后。以btn_lv1为例,这里代码的意思是给btn_lv1绑定了函数lvpop_Callback,当该按钮被按下时调用该函数,同时panel参数被替换为Panel_lv1.

赶快测试一下,你会发现成功实现了效果。 (不贴图了)更为重要的,你已经掌握了一种思维方式,这种抽象思考的能力对编程极为重要。

最后分析一下还能不能进一步优化。你可能会思考,既然函数可以精简为2个,一个负责弹出一个负责关闭,那么按钮能不能够精简?在目前cocosstudio的框架下至少每个关卡的按钮都需要获取并绑定函数,所以这些按钮不可能精简。其次每个弹窗上的进入和关闭按钮能否精简呢?直觉上应该是可以的,不过这样就需要调整大的结构,这里就不展开了。感兴趣的读者可以自己思考,找出自己认为最优的算法。

下一话正式开始制作游戏内容,见《cocos2d-x萌新指南(七)——布置游戏场景、拖动图片》。