Move Sprites with Actions with Sprite Kit and Swift

The mechanism to animate sprites with Sprite Kit is to make use of actions. You can apply a type of action to a node and Sprite Kit automatically updates the postion until the action completes. Better yet, you can also chain actions together to create movement combinations easily. In this tutorial we will add some actions to a sprite. This tutorial is written in Swift so you will need Xcode 6. It can be downloaded at Apple's developer portal.

Update: Apr 18, 2017. The rewritten version in Swift for iOS 10.3 and Xcode 8.3 is available here.

Open Xcode and choose iOS->Application->Game. 

For product name, use SpriteKitSwiftSpriteActionsTutorial and then fill out the Organization Name and Organization Identifier with your customary values. Enter Swift as Language and make sure only iPhone is selected in Devices.

We need a sprite for this tutorial so download our image and add it to the project. Make sure you select the "Copy items if needed" option

Go to the Storyboard and change the width to compact. This will change the view to a iPhone portrait mode. 

Go to the GameScene.swift file. Here is the GameScene class defined. In the didMoveToView method the custom code is done. Delete the code after the "Setup your scene here" comment line and add the following lines

let cup = SKSpriteNode(imageNamed: "coffeecup.png")
cup.position = CGPointMake(self.size.width/2, self.size.height/2)


The apple image is assigned to the apple variable, it is centered to the screen and added to the current scene. Build and Run the project, the apple is centered to the screen.

To make this sprite move we need to create a move action and run this action on our sprite. Add the following lines to the didMoveToView method

var moveBottomLeft = SKAction.moveTo(CGPointMake(400,100), duration:2.0)

Build and Run, the sprite will move to the bottom-left with a duration of two seconds.

The moveTo:duration method make use of absolute positions. To move the sprite relative of the current posistion you can use the moveBy variant. Change the previous two lines into

let moveRight = SKAction.moveByX(50, y:0, duration:1.0)

This will move the sprite 50 points to the right. It is also possible to chain actions together using a sequence. Delete the runAction line and add the following lines.

let moveBottom = SKAction.moveByX(0, y:-100, duration:3.0)
let sequence = SKAction.sequence([moveRight, moveBottom]);


Build and Run, and you will see the sequence action will run one action after another.

Some actions can be reversed by calling reversedAction so the new actions is the opposite of the older action. Remove the sequence line and add this two lines.

let reversedMoveBottom = moveBottom.reversedAction()
let sequence = SKAction.sequence([moveRight, moveBottom, reversedMoveBottom])

Build and Run, you will see the moveBottom action is followed by the reversed action. It is also possible to repeat actions a number of times or even unlimited. Remove the runAction line and add the following lines

let endlessAction = SKAction.repeatActionForever(sequence)

Build and Run, the action will repeat endlessly.

You can download the source code of the SpriteKitSwiftSpriteActionsTutorial at the ioscreator repository on github.