cocos2d-js 新手入门 4.界面创建

前端之家收集整理的这篇文章主要介绍了cocos2d-js 新手入门 4.界面创建前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

上一节 主要讲一个项目,我们所要关心的是哪些文件。这一节我要讲讲 Scene和Layer这两个容器,弄清楚这两个,就能明白一个游戏该怎么去布局和做效果

记住两点:
1.一个游戏至少要有一个Scene对象(因为main.js需要打开一个游戏场景),scene大小可以理解为全屏大小,这个无需设置坐标;
2.Layer可以理解为层容器,不同的界面采用不同的层来实现,很方便管理。比如说一个游戏的开始界面,规则界面,游戏界面,结束界面,都可以做成单独的StartLayer,RuleLayer, GameLayer, GameOverLayer,然后通过事件来跳转显示

微信里面的小游戏是典型的例子,几乎都可以把这些小游戏界面拆分为

startlayer为默认显示界面。互相调用流程为

想清楚了一个游戏需要哪些界面,然后清楚界面之间怎么跳转。然后在自己新建的工程里面,修改app.js。把所需要的layer层都先写出来。

  1. var StartLayer = cc.Layer.extend({
  2. ctor:function () {
  3. this._super();
  4. }
  5. });
  6. var RuleLayer = cc.Layer.extend({
  7. ctor:function () {
  8. this._super();
  9. }
  10. });
  11. var GameLayer = cc.Layer.extend({
  12. ctor:function () {
  13. this._super();
  14. }
  15. });
  16. var GameOverLayer = cc.Layer.extend({
  17. ctor:function () {
  18. this._super();
  19. }
  20. });
  21. var GameScene = cc.Scene.extend({
  22. onEnter:function () {
  23. this._super();
  24. var layer = new StartLayer();
  25. this.addChild(layer);
  26. }
  27. });

到这一步,一个小游戏所用到的界面,算是创建好了。

猜你在找的Cocos2d-x相关文章