在这个三级树形结点图示中，“开始界面”即为场景，“界面层”即为层，再下面的四个结点可以算为界面层下的精灵，当然，菜单其实也可以分为几个精灵构成。

第二类场景就是关卡了。如图：

这是熟悉的第一关，我们仍以三级树形结点来表示这个场景。

在这里，“第一关”即为场景，为了区分具有不同排序分类的精灵集合。我将游戏中的层由远及近观看，由先及后绘制，划分为“远景层”，“近景层”，“人物层”，“效果层”，“界面层”等五个层，再将各种精灵分布到这些层中。

继续这样子分析，我们可以得出所有的关卡树：

在这里“Root”代表了游戏程序。它共种有十棵树。分别为“开始界面”，“第一关”…“通关界面”，每完成一个关卡，就将进行场景的切换，也就是显示一棵新树。

到这里，精灵，层与场景的结点关系原理已经讲解完成。我们现在来看一下Cocos2d-x中是如何具体实现和应用的。

以开始界面为例，咱们接着上一节中所讲的节点类来进行扩展，为了更好的讲述理论，这部分内容完全不涉及任何渲染引擎的使用，我们只使用VS创建一个简单的WIN32窗口程序，并使用GDI来进行绘制。

我们将创建的工程命名为ShowNodeTree，编译运行只有一个空白窗口，它工作的很好。OK，现在我们创建一个工程筛选目录NodoTree,并将之前创建的Node放入其中，并依次创建好Scene,Layer,Spriet及Director等类。

顾名思义，上面这些文件分别为：

Director.h/cpp:win32绘制管理类CDirector，绘图用。

Node.h/cpp:结点基类CNode，用于构建结点树。

Layer.h/cpp: 层类CLayer。

Scene.h/cpp:场景类CScene。

Sprite.h/cpp:精灵类CSprite。

我们来看一下具体实现：

首先是win32绘制管理类CDirector：

Director.h:

可以看到，CDirector类是一个单例，我们为其创建了两个函数来进行绘制指定色的矩形和绘制位图的功能。没错，足够用了。

Director.cpp:

都是最基本的GDI绘制操作，这样我们的设备就建立好了。下面我们来创建场景。

Scene.h:

其对应的CPP：

没什么可解释的，就是一个结点类。然后是层：

Layer.h:

可以看到，层有了宽高和颜色的设置，对应的Layer.cpp:

层已经可以显示了，通过取得设备并调用FillRect来显示一个色块矩形。最后我们来看一下精灵：

Sprite.h:

我们为精灵增加了位图句柄，以使它可以绘制相应的位图。

Sprite.cpp:

OK,就这样，我们就建立了一套可以进行场景，层，精灵管理和绘制的类。现在我们来具体的实现一下开始界面。我将开始界面分为

这里共有一个层和八个精灵。层嘛，就是一纯黑背景色块，八个精灵嘛，就如上图所示分别用来显示不同的位图：

我们现在打开程序的主源文件ShowNodeTree.cpp，在文件顶部加入：

并在InitInstance函数的尾部加入：

看，经过上面的代码之后，我们就创建了相应的层，精灵和场景。最后创建一个定时器来进行屏幕重绘，FPS嘛，就设为50好了。

我们在窗口消息处理函数中加入：

这样我们的开始界面就算完成了，编译运行一下吧：

怎么样？不错吧。一个开始界面层展现在我们面前，所有精灵做为层的子结点而随着层保持运动。虽然这种方式还有一些闪屏，但，那并不是重点，关键是你彻彻底底的理解了结点系统对于引擎架构的作用和设计思想。好了，喝口水歇一会儿开始进入到Cocos2d-x中去看看。

2.1.2 Cocos2d-x中的精灵，层，场景与结点：

在Cocos2d-x中，结点的基类是CCNode，它的实现远远超越了上面结点代码的复杂度，不过没关系，随着后面相关代码接触的加深，你可以很明白它的全部接口函义，但现在，你所需要的只是明白它就不过是个结点，它不过是咱们上面结点类的演变，说的通俗点：不要以为你穿个马甲哥就认不出你了！

在CCNode中，有一个指针容器成员m_pChildren ，它存放了当前结点下的所有子结点，我们通过addChild来增加子结点到其中。我们并没有发现所谓的兄弟结点，为什么呢？那时因为兄弟结点被“扁平化”处理了。为了提升效率，减少递归调用的次数，可以将所有子结点的指针都存放在当前结点的容器中，所以子结点的兄弟结点就不必出现了。

有了结点CCNode，我们来看一下精灵CCSprite，它在libcocos2d的sprite_nodes分类下。

打开CCSprite.h：

CCSprite :publicCCNode,public CCTextureProtocol,public CCRGBAProtocol

很明显，精灵是由结点CCNode派生出来的子类。它的主要功能就是显示图形。在其函数中，涉及纹理加载和OpenGL相关的顶点和颜色，纹理寻址的操作。

层CCLayer和场景CCScene是被存放在libcocos2d的layers_scenes_transitions_nodes分类下。

打开CCLayer.h:

CC_DLLCCLayer : public CCNode,public CCTouchDelegate,publicCCAccelerometerDelegate,publicCCKeypadDelegate

可以看到，CCLayer除了由结点CCNode派生外，还增加了用户输入事件的响应接口。如CCTouchDelegate是触屏事件响应接口类，CCAccelerometerDelegate是加速键消息事件响应接口类，CCKeypadDelegate是软键盘消息事件响应接口类。

打开CCScene.h:

class CC_DLL CCScene :publicCCNode

好吧，真是简单明了，场景就是专门管理子结点的，或者说就是专门管理层结点的。

现在我们来看一些它们的具体应用。

打开HelloCpp工程。在Classes下我们看到有两个类:

1 . AppDelegate:由CCApplication派生，即Cocos2d-x的程序类。可以把它当作上面图示中的”Root”。它的作用就是启动一个程序，创建主窗口并初始化游戏引擎并进入消息循环。

2 . HelloWorld：由CCLayer派生,即Cocos2d-x的层。对应上面图示中“开始界面”场景中的“界面层”。它的作用是显示背景图和菜单及退出按钮等精灵。在这个类里有一个静态函数HelloWorld::scene()创建了所用到的场景并创建HelloWorld这个层放入到场景中。

在程序的main函数中创建了AppDelegate类的实例对象并调用run运行。 之后会在AppDelegate的函数applicationDidFinishLaunching（代表程序启动时的处理）中结尾处调用HelloWorld::scene()创建了场景。

游戏运行起来是个什么样子呢？没错，我看跟魂斗罗的“开始界面”也差不到哪去嘛。当然，只是指组织关系。