Cocos开发中的埂（一）

接触Cocos-JS开发10多天以来，渐渐熟悉了Cocos的一些东西，当然也遇到了一些埂，官方的文档还是挺详细的，但是作为完全的门外汉通过阅读文档来解决问题，可以解决50%，另外的需要通过Cocos官方社区以及StackOverFlow之内的技术论坛解决。

1、先得理解Cocos中的各种节点（Node），组件（Component）的意义。我的理解，Cocos中的任一UI块都是一个Node，比如展示图片的精灵（Sprite），展示文字的标签（Label），但是Sprite和Label他们都是附着在Node上的Component，所以当你想操作图片和文本的时候，拿到Sprite和Label对象需要调用node.getComponent(cc.Sprite)或者node.getComponent(cc.Label)来进行。

当然，JS在Cocos中也是作为Component附着在Node中的，在代码中取出某个Node上的JS使用node.getComponent('JS名称')。

2、Sprite精灵设置图片。使用node.getComponent(cc.Sprite).spriteFrame = newSpriteFrame;实现，之前查文档使用node.getComponent(cc.Sprite).setTexture(cc.url.raw('resources/xxx.png')))不顶用。

newSpriteFrame在代码中构造麻烦，可以在ccClass中设置属性Properties，然后在属性检查器中直接将图片拖拽到属性中生成SpriteFrame，然后在代码中直接使用属性即可。

3、Node节点设置事件监听和取消事件监听。一般使用node.on(cc.Node.EventType.TOUCH_START,function(event){}.bind(this));或者node.on(cc.Node.EventType.TOUCH_END,function(event){}.bind(this));之类的形式注册点击事件。问题来了，我们在事件中使用了event参数，那么在取消事件中我们必须和注册事件一样的参数，不能将上述代码再这样写一遍吧：node.off(cc.Node.EventType.TOUCH_START,function(event){}.bind(this));而且这种情况下，function函数指针也不一样，也不会生效。文档中告诉我们，可以在类中定义属性function，比如this.callback。但这样的话，event就不work了。后来查到文档node.on()方法返回的就是这个function的指针，这样就方便多了。于是注册和取消事件变得异常简单。

var callback = node.on(cc.Node.EventType.TOUCH_START,function(event){}.bind(this));

node.off(cc.Node.EventType.TOUCH_START,callback);至于callback如何存取使用视具体情况。

4、Node的属性参数attr。在Android开发中，每个View都有一个属性叫Tag，类型是Object，基本上可以存储任意类型的数据。那么需求就来了，在Cocos开发中，有些数据需要和对应的Node进行绑定，可以使用node的attr()方法将数据绑定进去。比如，在上一个事件绑定的埂中，可以将callback绑定到node上，这样可以在任意位置取出并取消绑定。

var callback = node.on(cc.Node.EventType.TOUCH_START,function(event){}.bind(this));

node.attr('callback',callback);

node.off(cc.Node.EventType.TOUCH_START,node['callback']);

attr是以key-value进行存取的，有很大的扩展性，使用时特别方便。

5、使用纯色Sprite。在实际开发中，Sprite精灵基本上是使用图片渲染，但对于一些纯色的Sprite，我们可以使用Color来代替图片，好处就不言而喻了。具体使用如下：

Sprite.setColor(cc.color(255,255,255));

设置透明度：Sprite.setOpacity(128);