Home Game Development iOS Game Programming Cookbook

iOS Game Programming Cookbook

books-svg-icon Book
eBook $43.99 $29.99
Print $54.99
Subscription $15.99 $10 p/m for three months
$10 p/m for first 3 months. $15.99 p/m after that. Cancel Anytime!
What do you get with a Packt Subscription?
This book & 7000+ ebooks & video courses on 1000+ technologies
60+ curated reading lists for various learning paths
50+ new titles added every month on new and emerging tech
Early Access to eBooks as they are being written
Personalised content suggestions
Customised display settings for better reading experience
50+ new titles added every month on new and emerging tech
Playlists, Notes and Bookmarks to easily manage your learning
Mobile App with offline access
What do you get with a Packt Subscription?
This book & 6500+ ebooks & video courses on 1000+ technologies
60+ curated reading lists for various learning paths
50+ new titles added every month on new and emerging tech
Early Access to eBooks as they are being written
Personalised content suggestions
Customised display settings for better reading experience
50+ new titles added every month on new and emerging tech
Playlists, Notes and Bookmarks to easily manage your learning
Mobile App with offline access
What do you get with eBook + Subscription?
Download this book in EPUB and PDF formats, plus a monthly download credit
This book & 6500+ ebooks & video courses on 1000+ technologies
60+ curated reading lists for various learning paths
50+ new titles added every month on new and emerging tech
Early Access to eBooks as they are being written
Personalised content suggestions
Customised display settings for better reading experience
50+ new titles added every month on new and emerging tech
Playlists, Notes and Bookmarks to easily manage your learning
Mobile App with offline access
What do you get with a Packt Subscription?
This book & 6500+ ebooks & video courses on 1000+ technologies
60+ curated reading lists for various learning paths
50+ new titles added every month on new and emerging tech
Early Access to eBooks as they are being written
Personalised content suggestions
Customised display settings for better reading experience
50+ new titles added every month on new and emerging tech
Playlists, Notes and Bookmarks to easily manage your learning
Mobile App with offline access
What do you get with eBook?
Download this book in EPUB and PDF formats
Access this title in our online reader
DRM FREE - Read whenever, wherever and however you want
Online reader with customised display settings for better reading experience
What do you get with video?
Download this video in MP4 format
Access this title in our online reader
DRM FREE - Watch whenever, wherever and however you want
Online reader with customised display settings for better learning experience
What do you get with video?
Stream this video
Access this title in our online reader
DRM FREE - Watch whenever, wherever and however you want
Online reader with customised display settings for better learning experience
What do you get with Audiobook?
Download a zip folder consisting of audio files (in MP3 Format) along with supplementary PDF
What do you get with Exam Trainer?
Flashcards, Mock exams, Exam Tips, Practice Questions
Access these resources with our interactive certification platform
Mobile compatible-Practice whenever, wherever, however you want
BUY NOW $10 p/m for first 3 months. $15.99 p/m after that. Cancel Anytime!
eBook $43.99 $29.99
Print $54.99
Subscription $15.99 $10 p/m for three months
What do you get with a Packt Subscription?
This book & 7000+ ebooks & video courses on 1000+ technologies
60+ curated reading lists for various learning paths
50+ new titles added every month on new and emerging tech
Early Access to eBooks as they are being written
Personalised content suggestions
Customised display settings for better reading experience
50+ new titles added every month on new and emerging tech
Playlists, Notes and Bookmarks to easily manage your learning
Mobile App with offline access
What do you get with a Packt Subscription?
This book & 6500+ ebooks & video courses on 1000+ technologies
60+ curated reading lists for various learning paths
50+ new titles added every month on new and emerging tech
Early Access to eBooks as they are being written
Personalised content suggestions
Customised display settings for better reading experience
50+ new titles added every month on new and emerging tech
Playlists, Notes and Bookmarks to easily manage your learning
Mobile App with offline access
What do you get with eBook + Subscription?
Download this book in EPUB and PDF formats, plus a monthly download credit
This book & 6500+ ebooks & video courses on 1000+ technologies
60+ curated reading lists for various learning paths
50+ new titles added every month on new and emerging tech
Early Access to eBooks as they are being written
Personalised content suggestions
Customised display settings for better reading experience
50+ new titles added every month on new and emerging tech
Playlists, Notes and Bookmarks to easily manage your learning
Mobile App with offline access
What do you get with a Packt Subscription?
This book & 6500+ ebooks & video courses on 1000+ technologies
60+ curated reading lists for various learning paths
50+ new titles added every month on new and emerging tech
Early Access to eBooks as they are being written
Personalised content suggestions
Customised display settings for better reading experience
50+ new titles added every month on new and emerging tech
Playlists, Notes and Bookmarks to easily manage your learning
Mobile App with offline access
What do you get with eBook?
Download this book in EPUB and PDF formats
Access this title in our online reader
DRM FREE - Read whenever, wherever and however you want
Online reader with customised display settings for better reading experience
What do you get with video?
Download this video in MP4 format
Access this title in our online reader
DRM FREE - Watch whenever, wherever and however you want
Online reader with customised display settings for better learning experience
What do you get with video?
Stream this video
Access this title in our online reader
DRM FREE - Watch whenever, wherever and however you want
Online reader with customised display settings for better learning experience
What do you get with Audiobook?
Download a zip folder consisting of audio files (in MP3 Format) along with supplementary PDF
What do you get with Exam Trainer?
Flashcards, Mock exams, Exam Tips, Practice Questions
Access these resources with our interactive certification platform
Mobile compatible-Practice whenever, wherever, however you want
  1. Free Chapter
    iOS Game Development
About this book
Publication date:
March 2015
Publisher
Packt
Pages
300
ISBN
9781784398255

 

Chapter 1. iOS Game Development

Since the launch of iOS devices, game development has always attracted developers in ever-increasing numbers. There are various game engines available in the market, which allow developers to start developing their games for iOS devices.

In this chapter, we will be focusing on the following topics:

  • Getting started with the SpriteKit game framework

  • Developing a mini game using SpriteKit

 

Introduction


Apple has launched its first game engine that allows you to create games for iOS without being dependent on the third-party game libraries. It is a very powerful framework similar to other iOS frameworks and is similar to other frameworks when it comes to its usage. It's also very easy to adopt and learn. It also supports lots of features such as physics simulations, texture atlas, gravity, restitution, animations, particle emitters, game center support, and many more. Moreover, it comes with very rich developer documentation for SpriteKit at the Apple development center. It's very useful and very well written. You might need to understand the anatomy of game development first to get started with game development in SpriteKit. There are two basic and most important terms here; one is scenes and the other is sprites. Scenes can be considered as the layers in the games. Therefore, in any game there are various layers such as the score layer, hud layer, and gameplay layer that can act as different scenes. However, any object in the scene such as a player or an enemy can be considered as a sprite.

 

Getting started with the SpriteKit game framework


With the release of iOS 7.0, Apple has introduced its own native 2D game framework called SpriteKit. SpriteKit is a great 2D game engine, which has support for sprite, animations, filters, masking, and most important is the physics engine to provide a real-world simulation for the game.

Apple provides a sample game to get started with the SpriteKit called Adventure Game. The download URL for this example project is http://bit.ly/Rqaeda.

This sample project provides a glimpse of the capability of this framework. However, the project is complicated to understand and for learning you just want to make something simple. To have a deeper understanding of SpriteKit-based games, we will be building a bunch of mini games in this book. To understand the basics of the SpriteKit game programming, we will build a mini AntKilling game in this chapter.

Getting ready

To get started with iOS game development, you have the following prerequisites for SpriteKit:

  • You will need the Xcode 5.x

  • The targeted device family should be iOS 7.0+

  • You should be running OS X 10.8.X or later

If all the above requisites are fulfilled, then you are ready to go with the iOS game development. So let's start with game development using iOS native game framework. We will be building a mini game in the chapter and will be taking it forward in every chapter to add more and more features and enhancements.

How to do it...

Let's start building the AntKilling game. Perform the following steps to create your new SpriteKit project:

  1. Start your Xcode. Navigate to File | New | Project....

  2. Then from the prompt window, navigate to iOS | Application | SpriteKit Game and click on Next.

  3. Fill all the project details in the prompt window and provide AntKilling as the project name with your Organization Name, device as iPhone, and Class Prefix as AK. Click on Next.

  4. Select a location on the drive to save the project and click on Create.

  5. Then build the sample project to check the output of the sample project. Once you build and run the project with the play button, you should see the following on your device:

How it works...

The following are the observations of the starter project:

  1. As you have seen, the sample project of SpriteKit plays a label with a background color.

  2. SpriteKit works on the concept of scenes, which can be understood as the layers or the screens of the game. There can be multiple scenes working at the same time; for example, there can be a gameplay scene, hud scene, and the score scene running at the same time in the game.

Now we can look into the project for more detail arrangements of the starter project. The following are the observations:

  1. In the main directory, you already have one scene created by default called AKMyScene.

  2. Now click on AKMyScene.m to explore the code to add the label on the screen. You should see something similar to the following screenshot:

  3. Now we will be updating this file with our code to create our AntKilling game in the next sections.

  4. We have to fulfill a few prerequisites to get started with the code, such as locking the orientation to landscape as we want a landscape orientation game.

  5. To change the orientation of the game, navigate to AntKilling project settings | TARGETS | General. You should see something similar to the following screenshot:

  6. Now in the General tab, uncheck Portrait from the device orientation so that the final settings should look similar to the following screenshot:

  7. Now build and run the project. You should be able to see the app running in landscape orientation.

  8. The bottom-right corner of the screen shows the number of nodes with the frame rate.

 

Developing a mini game using SpriteKit


Now you have learned enough about SpriteKit. To explore this in more depth, let's create a mini game that will help you to understand the concepts in much more detail. We are going to create an AntKilling game. In this game, we will place an ant on the screen; the ant will animate when you click on it.

Getting ready

We will use the project we created in the previous section. To create a mini game, we will have to update the source files we have got with the starter project. Now it's time to update AKMyScene to hold our ant sprites.

Before getting into the steps to update the code, download all the resources for this chapter and check for the assets folder, which has all the images used in this project.

How to do it...

Execute the following steps sequentially to create a mini game:

  1. Open the Resources folder and add them to your Xcode project.

  2. While adding the resources to the Xcode, make sure that the selected target is AntKilling and Copy items into destination group's folder (if needed) is checked.

  3. Now delete all the existing code from AKMyScene.m and make it look similar to the following screenshot:

  4. Now, firstly, we have created a private interface to declare private variables:

    @interface AKMyScene ()
    @property (nonatomic) SKSpriteNode *ant;
    @end
  5. Then, in the init method, we have printed a log to print the size of the screen:

    NSLog(@"Size: %@", NSStringFromCGSize(size));
  6. Now we will change the screen background color to white using the following line of code:

    self.backgroundColor = [SKColor colorWithRed:1.0 green:1.0 blue:1.0 alpha:1.0];
  7. Then we will change the screen background color to white using the backgroundColor property in the following line of code.

    self.backgroundColor = [SKColor colorWithRed:1.0 green:1.0 blue:1.0 alpha:1.0];
  8. In the following line of code, we are creating a sprite object using the spriteNodeWithImageNamed method and passing the image name to the same. Then we have positioned it to 100, 100 of the screen, which is in the bottom-left corner of the screen. Then finally we have added it as a child.

    self.ant = [SKSpriteNode spriteNodeWithImageNamed:@"ant.jpg"];
    self.ant.position = CGPointMake(100, 100);
    [self addChild:self.ant];

Tip

Downloading the example code

You can download the example code files from your account at http://www.packtpub.com for all the Packt Publishing books you have purchased. If you purchased this book elsewhere, you can visit http://www.packtpub.com/support and register to have the files e-mailed directly to you.

In games, we have to keep two sets of images, one for the normal display and the second for the retina display. In the preceding block of code, we have provided the name of the sprite as ant.jpg, which is going to autoreference to ant@2x.jpg for the retina devices.

Now build and run your application; you should see something similar to the following screenshot:

Now as you can see, the screen color has changed to white but there is no ant on the screen. This means something has gone wrong in the code. So, now let's check our logs, which should be printing the following:

2014-07-22 19:13:27.019 AntKilling[1437:60b] Size: {320, 568}

So the scene size is wrong. The scene should print 568 as the width and 320 as the height but it's printing the opposite. To debug this, navigate to your AKViewController.m viewDidLoad method. You can find the complete code for this function at AntKilling/AntKilling/AKViewController.m.

So, from this method, we can see that our scene is absorbing the size from the bounds of the view and this viewDidLoad method is invoked even before the view has been added to the view hierarchy. So it has not responded to the layout changes. Thus, because of the inconsistent view bounds our scene is getting started with wrong bounds.

To solve this issue, we have to move the scene startup code in the viewWillLayoutSubviews method. After removing the code from the viewDidLoad method and pasting it to viewWillLayoutSubviews, you can find the complete code for this function at AntKilling/AntKilling/AKViewController.m.

Now, once again build and run the app; you should see the following output:

How it works...

So, congrats! You have fixed the issue. Your ant has now appeared on the screen at the given location. If you observe closely, you can see that the status bar is at the top of the game, which does not look great. To remove the status bar from the screen, open your AntKilling-Info.plist file and add an UIViewControllerBasedStatusBarAppearance attribute with value NO. Your .plist file should look like the following screenshot:

Build and run your project again; you should be able to see the game without the status bar now:

This looks perfect now; our ant has been residing on the screen as expected. So now our next objective is to animate the ant when we tap on it. To accomplish this, we need to add the following code in the AKMyScene.m file, just below your initWithSize method:

- (void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event
{
  UITouch *touch = [touches anyObject];
  CGPoint positionInScene = [touch locationInNode:self];
  SKSpriteNode *touchedNode = (SKSpriteNode *)[self nodeAtPoint:positionInScene];
  if (touchedNode == self.ant) {
    SKAction *sequence = [SKAction sequence:@[[SKAction rotateByAngle:degreeToRadian(-3.0f) duration:0.2],
    [SKAction rotateByAngle:0.0 duration:0.1],
    [SKAction rotateByAngle:degreeToRadian(3.0f) duration:0.2]]];
    [touchedNode runAction:[SKAction repeatActionForever:sequence]];
  }
}

float degreeToRadian(float degree) {
  return degree / 180.0f * M_PI;
}

You can find the complete code for this function at AntKilling/AntKilling/AKMyScene.m.

So, now let's go line-by-line to understand what we have done so far. To begin with, we have added the - (void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event method to the grab all the touches on the scene.

Now in the function the first line allowed you to grab touch using CGPoint positionInScene = [touch locationInNode:self];.

In the next line, we grabbed the touch and converting it to the CGPoint positionInScene = [touch locationInNode:self]; location.

In the following line, we fetched the sprite, which has been touched:

SKSpriteNode *touchedNode = (SKSpriteNode *)[self nodeAtPoint:positionInScene];

Now, once you have the sprite object, compare and check whether the select object is the ant bug. If it's the ant bug, then animate the object by adding the following line of code:

SKAction *sequence = [SKAction sequence:@[[SKAction rotateByAngle:degreeToRadian(-3.0f) duration:0.2],[SKAction rotateByAngle:0.0 duration:0.1],[SKAction rotateByAngle:degreeToRadian(3.0f) duration:0.2]]];
[touchedNode runAction:[SKAction repeatActionForever:sequence]];

Using the SKAction class, you can execute various sequence of animations such as rotation, moveBy, moveTo, and so on. Also all the rotate methods accept the angle in radians. So to achieve the rotation, we must convert the degree to radians before passing to any rotate function.

Now, this code will animate the selected sprite. Build and run the project and you will see the ant animating on tap.

You will soon notice that on tapping the ant, it starts animating, but there is no way to stop this. So now let's add a way to stop this animation once you click anywhere on the scene. Navigate to the - (void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *) event method, and update it to the following code:

- (void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event
{
  UITouch *touch = [touches anyObject];
  CGPoint positionInScene = [touch locationInNode:self];
  SKSpriteNode *touchedNode = (SKSpriteNode *)[self nodeAtPoint:positionInScene];
  if (touchedNode == self.ant) {
    SKAction *sequence = [SKAction sequence:@[[SKAction rotateByAngle:degreeToRadian(-3.0f)duration:0.2],
    [SKAction rotateByAngle:0.0 duration:0.1],
    [SKAction rotateByAngle:degreeToRadian(3.0f) duration:0.2]]];
    [touchedNode runAction:[SKAction repeatActionForever:sequence]];
  } else {
  [self.ant removeAllActions];
  }
}

Now if you observe closely, you can see that we have added an if-else condition to check whether the touch is made on the ant, which allows it to animate; when the touch is made anywhere outside the screen, stop all the actions. To stop all the actions on the sprite, we can use the removeAllActions method on the sprite.

Latest Reviews (2 reviews total)
Very Good book. Very good book
iOS Game Programming Cookbook
Unlock this book and the full library FREE for 7 days
Start now