Hello Cocos2dx forum,
I’ve been stuck for hours attempting to figure out my mistake. I am attempting to do a simple testing case drawing a grid of 32x32 terrain tiles.
A quick run down of my test environment:
- Chrome Version 32.0.1700.76 m
- Cocos2dx HTML 5 version 2.2.2
- WEBGL Rendering mode
I have included 2 screen shots. The first screen shot shows my problem, which is the Sprite tiles do not appear to be lining up/drawing correctly when added as children of a cc.SpriteBatchNode. When I use the same grid offset logic for a cc.Layer containing the same set of sprites, they appear to line up just fine.
Code snippet in my code for rendering with cc.SpriteBatchNode:
// Get my resource object
var tilesetRes = mc.ResourceLibrary.get("img_tileset_test");
// Get the plist for the resource and add it to the frame cache
cc.SpriteFrameCache.getInstance().addSpriteFrames(tilesetRes.getPlist());
// Create a batch node with the resource image and space for children nodes
this.tileLayer = cc.SpriteBatchNode.create(tilesetRes.getImg(), 128 * 128);
// Add SpriteBatchNode to parent cc.Layer
this.addChild(this.tileLayer);
//... Loop through grid
// Create and add next sprite
nextSprite = cc.Sprite.createWithSpriteFrameName("grass32.png");
nextSprite.setAnchorPoint(anchorBottomLeft);
nextSprite.setPosition(this.getTileOffsetWorld(new cc.Point(c, r)));
this.tileLayer.addChild(nextSprite);
//... End loop
Any suggestions? I appreciate any responses. I also want to note I am aware of Tiled/TMX but am not looking to solve this using those APIs at the moment for project-specifc reasons.
Thank you.
grid_ccbatchnode.png (206.6 KB)
grid_layersprites.png (225.6 KB)