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.
grid_ccbatchnode.png (206.6 KB)
grid_layersprites.png (225.6 KB)