iOS Simple SpriteKit Animation

Isa Weaver
3 min readMay 10, 2016

I will be the first to tell you, I know near nothing when it comes to programming. And after failing several interviews with various companies around the country they know it too. LOL. However, I decided that I would showcase the various projects and steps along my journey to becoming a better programmer through this blog and my Github account. So we shall dive into creating a simple animation using SpriteKit in iOS.

Creating the Xcode Project

Start by opening your Xcode application and proceed to click Game under iOS application, after which press next.

Select Game and the click the Next button

Then proceed to name your application and continue until you reach the coding screen.

Name the application and continue

Before you begin writing code, you have to add the images to the project which will be referenced later on in your code. You can use the example folder provided here :(https://www.dropbox.com/s/vayznavk0et3ctv/WinImages.zip?dl=0).

The 16 Images and Folder added to the project

Implementing the Animation

In your project folder navigate to GameScene.swift and clear the code written inside the functions didMoveToView, touchesBegan, and update. It’s straight forward from here on. Just add the code snippet thats below.

import SpriteKit
class GameScene: SKScene {
var mainGuy = SKSpriteNode()
var textureAtlas = SKTextureAtlas()
var textureArray = [SKTexture]()
override func didMoveToView(view: SKView) {
textureAtlas = SKTextureAtlas(named: "Images")
for i in 1...textureAtlas.textureNames.count{
var name = "win_\(i).png"
textureArray.append(SKTexture(imageNamed: name))
}
mainGuy = SKSpriteNode(imageNamed: "win_1.png")
mainGuy.size = CGSize(width: 70, height: 140)
mainGuy.position = CGPoint(x: self.size.width / 2, y: self.size.height / 2)
self.addChild(mainGuy)
}
override func touchesBegan(touches: Set<UITouch>, withEvent event: UIEvent?) {
mainGuy.runAction(SKAction.repeatActionForever(SKAction.animateWithTextures(textureArray,timePerFrame: 0.1)))
}
override func update(currentTime: CFTimeInterval) {
}
}

Then all you have to do is run the code by pressing the play button. And watch.

Congratulations!! Your animation works!

The images were provided by AppCoda please check look at their other work. If you would like to download or look at the project source code please click the link to my Github Repository.

Also, if you have any questions, thoughts, or recommendations please let me know. Or if you think this was useful, recommend this post to others.

--

--

Isa Weaver

Software Engineer @LockheedMartin Space, Previously VC Intern @Intel Capital. Opinions are my own.