Day 45 - 100 Days of Swift

3 minute read

Project 11 (part 1)

Day 45 is the first part of the eleventh project. It is a game similar to Pachinko or “Peggle”, where you drop a ball in a slot and it bounces off of pegs on the way down. It is also the first game project you use SpriteKit for. Today you just cover some basics of SpriteKit, get a background set up and add a ball that gets added when you tap on the screen and a bouncer that you make five of to act as the dividers for the slots at the bottom.

First, you make a new SpriteKit game, clear out most of the stuff that comes with the template, and then add a background to the scene:

1
2
3
4
5
6
// Inside didMove(to:)
let background = SKSpriteNode(imageNamed: "background.jpg")
background.position = CGPoint(x: 512, y: 384)
background.blendMode = .replace
background.zPosition = -1
addChild(background)

This adds the background image, in the center of the screen, behind everything else.

Then you add some code that generates a ball whenever the user touches the screen:

1
2
3
4
5
6
7
8
9
10
// Inside touchesBegan(_:with:)
if let touch = touches.first {
    let location = touch.location(in: self)

    let ball = SKSpriteNode(imageNamed: "ballRed")
    ball.physicsBody = SKPhysicsBody(circleOfRadius: ball.size.width / 2)
    ball.physicsBody?.restitution = 0.4
    ball.position = location
    addChild(ball)
}

This gets the location of the touch, makes a ball, gives it a SKPhysicsBody that is a little bouncy, and then puts it at the location of the test.

You also need to add a SKPhysicsBody to the scene itself, so that the ball will stay on screen when it gets to the “floor”:

1
2
// Inside didMove(to:)
physicsBody = SKPhysicsBody(edgeLoopFrom: frame)

At this point, you can tap the screen and add as many balls as you want, until you hit some limit where the hardware can’t keep up.

The next step is to add the dividers for the the section at the bottom. You write a helper function to add them:

1
2
3
4
5
6
7
func makeBouncer(at position: CGPoint) {
    let bouncer = SKSpriteNode(imageNamed: "bouncer")
    bouncer.position = position
    bouncer.physicsBody = SKPhysicsBody(circleOfRadius: bouncer.size.width / 2)
    bouncer.physicsBody?.isDynamic = false
    addChild(bouncer)
}

And then add five of them in didMove(to:):

1
2
3
4
for i in 0..<5 {
    let x = i*256
    makeBouncer(at: CGPoint(x: x, y: 0))
}

And that’s it for today. So far it looks like this:

Screenshot of working app

You can find my version of this project at the end of day 45 on Github here.

Reflections

I missed the last couple of days because I was taking part in a Hackathon and working on my submission for that pretty much all day everyday. A friend of mine and I built an app that helps you study for technical interviews with a flashcard swiping interface. It is pending app store review right now, but I plan on writing a blog post about it soon and linking to it there.

I’m glad to be back in the 100 Days of Swift though. SpriteKit has always seemed like fun to me and I’m glad to have an excuse to play around with it. I already learned something as I’ve never used a physics body before, so that is pretty cool. It is crazy how simple it is to get some interesting interactions happening with just a few lines of code.