Code a Snake Game With Button Controls Using SwiftUI

A look at what it takes to build another classic game

The snake game in SwiftUI

The other week I published an article about my journey to build the Tetris game a challenge. You can read about it here. Another similar but different game that predated Tetris; another classic a more straightforward implementation is the snake game. Join me in this short paper to build your copy of the snake game using pure SwiftUI.

The Game

At its most straightforward, the snake game is nothing more than a square. You must navigate the screen to “eat” single squares that appear randomly on it. As you eat the singles, the snake absorbs them and becomes just that little bit longer.

The challenge is that the snake, as it becomes longer, must not hit the sides or itself self; a game that gets progressively harder as the snake gets longer, and the case of this implementation gets faster as well.

The Components

To start, I need a loop since the snake moves continuously, so a timer like this is the obvious choice.

var timer = Timer.publish(every: 0.5, on: .main, in: .common).autoconnect()

Beyond that, I need a view representing each segment of the snake. A view that needs to remember its position.

Within the main loop of the game, I need to draw a slice of the snake’s segments as it progresses; the snake itself growing in size only if you manage to consume singles.

Note the code defining the first entry into this array is identical to the snake body struct. But I could not use the struct since the struct had not been initialised before the compiler wanted to initialise the @State variable…