Play Sprite Kit animations in an array forward and reverse

Question

I'm trying to play a set of separate animations that I have each in their own method although I don't know how to do this in Sprite Kit.

I've set up Previous and Next buttons:

 -(void)didMoveToView:(SKView *)view {

   ....

// Add buttons
    SKSpriteNode *previous = [SKSpriteNode   spriteNodeWithImageNamed:@"previous"];
    previous.position = CGPointMake(375, 50);
    previous.zPosition = 1;
    previous.name = @"previousButton";
    [self addChild:previous];

    SKSpriteNode *next = [SKSpriteNode spriteNodeWithImageNamed:@"next"];
    next.position = CGPointMake(670, 50);
    next.zPosition = 1;
    next.name = @"nextButton";
    [self addChild:next];
}

And my set of animations in their own methods (eventually there will be 16):

- (void)testAnimation1 {

    SKSpriteNode *yellowDiver = [SKSpriteNode spriteNodeWithImageNamed:@"yellow"];

    yellowDiver.xScale = .75;
    yellowDiver.yScale = .75;
    yellowDiver.position = CGPointMake(380,200);
    yellowDiver.zRotation = -M_PI / 8;

    SKAction *moveYellowDiverX = [SKAction moveToX:450 duration:1.0];
    SKAction *moveYellowDiverY = [SKAction moveToY:300 duration:1.0];
    SKAction *rotateYellowDiver = [SKAction rotateByAngle:(-M_PI / 4) duration:1.0];

    SKAction *yellowDiverSequence = [SKAction sequence:@[moveYellowDiverX, moveYellowDiverY, rotateYellowDiver]];

    [yellowDiver runAction:yellowDiverSequence];
    [self addChild:yellowDiver];
}

- (void)testAnimation2 {

    SKSpriteNode *blueDiver = [SKSpriteNode spriteNodeWithImageNamed:@"blue"];

    blueDiver.xScale = .75;
    blueDiver.yScale = .75;
    blueDiver.position = CGPointMake(620,200);
    blueDiver.zRotation = M_PI / 8;

    SKAction *moveBlueDiverX = [SKAction moveToX:550 duration:1.0];
    SKAction *moveBlueDiverY = [SKAction moveToY:300 duration:1.0];
    SKAction *rotateBlueDiver = [SKAction rotateByAngle:(M_PI / 4) duration:1.0];

    SKAction *blueDiverSequence = [SKAction sequence:@[moveBlueDiverX, moveBlueDiverY, rotateBlueDiver]];

    [blueDiver runAction:blueDiverSequence];
    [self addChild:blueDiver];
}

- (void)testAnimation3 {

    SKSpriteNode *greenDiver = [SKSpriteNode spriteNodeWithImageNamed:@"green"];

    greenDiver.xScale = .75;
    greenDiver.yScale = .75;
    greenDiver.position = CGPointMake(380,500);
    greenDiver.zRotation = M_PI / 8;

    SKAction *moveGreenDiverX = [SKAction moveToX:500 duration:1.0];
    SKAction *rotateGreenDiver = [SKAction rotateByAngle:(-M_PI) duration:.5];
    SKAction *rotateGreenDiver2 = [SKAction rotateByAngle:(-M_PI/8) duration:.5];
    SKAction *moveGreenDiverY = [SKAction moveToY:385 duration:2.0];

    SKAction *greenDiverSequence = [SKAction sequence:@[moveGreenDiverX, rotateGreenDiver, rotateGreenDiver2, moveGreenDiverY]];

    [greenDiver runAction:greenDiverSequence];
    [self addChild:greenDiver];
}

...

Then in the touchesBegan method I want to call each animation method in an array order so that every time I press "next" it goes to the next animation in the set, while killing and removing the previous animation every time a new animation starts. Very much like a photo album with previous and next buttons.

Of course with the Previous button I'd like to do the same, but in reverse:

-(void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event {
    /* Called when a touch begins */

    for (UITouch *touch in touches) {
    CGPoint pointInSKScene = [self.view convertPoint:[touch locationInView:self.view] toScene:self];
    SKNode *touchedNode = [self nodeAtPoint:pointInSKScene];

    if ([touchedNode.name isEqualToString:@"previousButton"]) {

        // Play Animation Set in Reverse
        [self testAnimation8];
        [self testAnimation7];
        [self testAnimation6];
        [self testAnimation5];

        //Kill First Set then Play new set in Reverse
        [self testAnimation4];
        [self testAnimation3];
        [self testAnimation2];
        [self testAnimation1];

        //Repeat 16 times
    }

    else if ([touchedNode.name isEqualToString:@"nextButton"]) {

        // Play Animation Set
        [self testAnimation1];
        [self testAnimation2];
        [self testAnimation3];
        [self testAnimation4];

        //Kill First Set then Play new set
        [self testAnimation5];
        [self testAnimation6];
        [self testAnimation7];
        [self testAnimation8];

        //Repeat 16 times
      }
    }
  }

Is it possible to store these methods in an array and then increment through them in Sprite Kit with the buttons I created? I don't think I can use the node names because in each method there will be 4 nodes. I need to use the method names. The sample code for the animations is short for brevity.

score 0 · Answer 1 · edited May 23 '17 at 12:12

You can group up your animations or any custom code into SKActions with code blocks and put them into an array:

            NSArray *actions = @[
               [SKAction runBlock:^{
                //action1
               }],
               [SKAction runBlock:^{
                //your code here
               }]  
            ];

Then you can get an action from the array and run it against the scene, for example. Or instead of an array of SKActions you could use an array of blocks (see this question)

Play Sprite Kit animations in an array forward and reverse

1 Answers1