Search code examples
iosobjective-csprite-kitjstilemap

Scrolling a Tilemap in Sprite-Kit (JSTileMap glitch)


Since JSTileMap extends SKNode, you can use the API to move and animate your tilemap like any other node. However, I keep getting this weird effect/glitch...

Code:

_tiledMap = [JSTileMap mapNamed:@"Cloud.tmx"];
if (_tiledMap) {
    [self addChild:_tiledMap];
}
_tiledMap.position = CGPointMake(800, 0);

SKAction *scrollLeft = [SKAction moveTo:CGPointMake(600, 0) duration:4];
SKAction *scrollRight = [SKAction moveTo:CGPointMake(700, 0) duration:4];
SKAction *sequence = [SKAction sequence:@[scrollLeft, scrollRight]];
SKAction *repeat   = [SKAction repeatActionForever:sequence];
[_tiledMap runAction:repeat];

Results:

enter image description here

enter image description here

As you can see, whenever the JSTileMap changes direction, depending if its left or right, the image gets cropped or something, I can't explain it. This doesn't happen if the node itself is a SKSpriteNode. I added numbers to the background image for visual reference.


EDIT

Further tests reveal that moving the JSTileMap's position manually (_tiledMap.position.x = x+1) in the update loop, has the same effect. It crops the image/tile when it animates left, and returns to normal when it animates to the right.


Solution

  • It seems I was using an old/unmaintained version of JSTileMap. Slycrel's version of JSTileMap addresses this issue.

    https://github.com/slycrel/JSTileMap