Sebyddd Sebyddd - 1 year ago 179
iOS Question

Scrolling background - Sprite Kit

So I tried to create an infinite scrolling background by using this post's solution (Sprite kit side scrolling).
However, I would want to make the image repeatable. As you can see in the video below, after the image has finished it's horizontal way, there is some empty gap.. I would like to make the image fill that gap, so repeat it endlessly.
or (password: spritekit)

What I did :

for (int i = 0; i < 2; i++) {
SKSpriteNode * bg = [SKSpriteNode spriteNodeWithImageNamed:@"bgimage"];
bg.anchorPoint = CGPointZero;
bg.position = CGPointMake(CGRectGetMidX(self.frame), self.frame.origin.y); = @"snow1";
[self addChild:bg];

and in update method:

[self enumerateChildNodesWithName:@"snow1" usingBlock: ^(SKNode *node, BOOL *stop) {
SKSpriteNode *bg = (SKSpriteNode *) node;
bg.position = CGPointMake(bg.position.x - 5, bg.position.y);

if (bg.position.x <= -bg.size.width)
bg.position = CGPointMake(bg.position.x + bg.size.width * 2, bg.position.y);

Answer Source

Anyway, I fixed it. Just in case someone else will need it, this is how I did it:

    // Create 2 background sprites
    bg1 = [SKSpriteNode spriteNodeWithImageNamed:@"bg1"];
    bg1.anchorPoint = CGPointZero;
    bg1.position = CGPointMake(0, 0);
    [self addChild:bg1];

    bg2 = [SKSpriteNode spriteNodeWithImageNamed:@"bg2"];
    bg2.anchorPoint = CGPointZero;
    bg2.position = CGPointMake(bg1.size.width-1, 0);
    [self addChild:bg2];

then in the update method:

    bg1.position = CGPointMake(bg1.position.x-4, bg1.position.y);
    bg2.position = CGPointMake(bg2.position.x-4, bg2.position.y);

    if (bg1.position.x < -bg1.size.width)
        bg1.position = CGPointMake(bg2.position.x + bg2.size.width, bg1.position.y);

    if (bg2.position.x < -bg2.size.width) 
        bg2.position = CGPointMake(bg1.position.x + bg1.size.width, bg2.position.y);
Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download