优点:CCSpriteBatchNode 中的所有CCSprite只会被渲染1次,因此可以提高游戏的FPS。
限制:加入到 CCSpriteBatchNode 中的CCSprite必须使用同一张纹理图。
问:什么时候应该用CCSpriteBatchNode?
答:比如游戏中的子弹 就很适合用它,因为子弹都是一个样子。
答:通过TexturePacker生成的纹理图也适合使用它。
看一个简单的Demo:
- CCSpriteBatchNode *batch = [CCSpriteBatchNode batchNodeWithFile:@"shopAmber.png"];//初始化时给一张纹理图
- [self addChild:batch];//加入到当前Layer
- CCSprite *spr = [CCSprite spriteWithFile:@"shopAmber.png"];//切记! 这里的纹理图必须和上面相同,否则会崩溃~
- spr.position = ccp(10,10);
- [batch addChild:spr z:2];
- CCSprite *spr2 = [CCSprite spriteWithFile:@"shopAmber.png"];
- spr2.position = ccp(10,40);
- [batch addChild:spr2 z:1];//可以指定z坐标。
下面看看它的细节:
- //创建CCSpriteBatchNode
- CCSpriteBatchNode *batch = [CCSpriteBatchNode batchNodeWithFile:@"shopAmber.png"];
看看 batchNodeWithFile的实现:
- +(id)batchNodeWithFile:(NSString*) imageFile
- {
- return [[[self alloc] initWithFile:imageFile capacity:defaultCapacity] autorelease];//defaultCapacity==29默认可以addChild29个精灵,应该会自动扩充<pre name="code" class="java">}
- </pre>
- <pre></pre>
- <p></p>
- <pre></pre>
- <p></p>
- <p>再看看 initWithFile的实现:</p>
- <p></p>
- <pre name="code" class="java">-(id)initWithFile:(NSString *)fileImage capacity:(NSUInteger)capacity
- {
- //看看其实就是被加载成了一张2d纹理图。
- CCTexture2D *tex = [[CCTextureCache sharedTextureCache] addImage:fileImage];
- return [self initWithTexture:tex capacity:capacity];
- }</pre>
- <p></p>
- <p></p>
- <pre name="code" class="java">[self addChild:batch];//把CCSpriteBatchNode加入当前Layer,batch就相当于一个Layer</pre><br>
- 之后你向CCSpriteBatchNode里加精灵 就相当于向一个层里加精灵:
- <p></p>
- <p></p>
- <pre name="code" class="java">[batch addChild:spr z:2];</pre><br>
- <p>可以使用 CCSpriteFrameCache配合CCSpriteBatchNode一起使用,效率会更高:</p>
- <p></p><pre name="code" class="java">[[CCSpriteFrameCache sharedSpriteFrameCache] addSpriteFramesWithFile:@"Resources.plist"];
- CCSprite *spr = [CCSprite spriteWithSpriteFrameName:@"Icon.png"];
- spr.position = ccp(10,10);
- [batch addChild:spr z:2];
- CCSprite *spr2 = [CCSprite spriteWithSpriteFrameName:@"shopAmber.png"];
- spr2.position = ccp(10,40);
- [batch addChild:spr2 z:1];
- </pre>这样看上去使用了2张不同的图片,但是它们是在同一张纹理图里的。<br>