There are two types of modes, namely portrait and landscape; you can select the desired orientation for your game while setting up your project. Any time during the development of your game, you can change the orientation under the properties section of your Sprite Kit project. There are four types of orientations available:

You can select any of the orientations depending on your game. If you want to make your game scene in portrait mode, you can select either Portrait or Upside Down options. If want to make your game in landscape mode, you can select the Landscape Left or Landscape Right option. If you want to make your game in both portrait and landscape, then you can select both the options too. Caution, if you want to make your game in both portrait and landscape mode, make sure that you have to handle the positions of sprites in your game during runtime.

As we are making a Platformer game, it's better to opt for landscape mode. Although you can select both Landscape Left and Landscape Right, it is better to opt for one orientation for easier programming. Following are the steps to do the same:

Now we are going to discuss about some auto-generated files in your Sprite Kit project. They can be found on the left panel in your Xcode.

We are going to make some adjustments in the already-created project called Platformer. Please follow the steps listed, in order to customize the project according to our needs:

Now you will not see an error in your Xcode, and if you run Platformer, you will see nothing. Well, that is not what we desire. Now, before getting your feet wet in code, we need to know what we have done (almost nothing but deleting...

A scene is basically a collection of different elements such as sprites, sounds, and so on, in a logical way. Suppose we want to make a menu, we'll have to put some buttons, background, and sounds in a manner that is positioned according to our needs.

A Scene object is a collection of nodes, but a scene itself acts as a node. Imagine a tree of nodes having scene objects as its root. As all nodes in the scene are positioned in defined coordinates, their linkage can be shown as:

Node (Content) → Descendant Node

This linkage of a node with its descendant(s) is very useful. Say, if you rotate a node on the top of the tree, all the nodes will be subsequently rotated.

In technical terms, Scene is an SKScene object, which holds an SKNode object (such as SKSpriteNode objects for sprites) inside a view (SKView object), so that we can render and use them. Scene is itself an SKNode object, which acts as a root node and attaches in an SKView object. Other objects required for that scene...

Everything in a game built in Sprite Kit is related to nodes, and it follows a node tree structure where a scene is a root node and other nodes are child nodes of it. When we put a node in the node tree, it uses its position property to place it within the coordinate system provided by its parent.

As a scene is also a node, it is placed inside the view provided by the SKView object. The code part which we deleted in viewDidLoad, GameScene, was added as a child in the SKView object. A scene uses its parent SKView object coordination system to render itself and the content within it. The coordinate system is the same as we learned in basic mathematics.

As the preceding diagram shows, if we move right from (0,0), then x will be positive, and negative if we move left from (0,0). If we move up from (0,0), then y will be positive, and negative if we move down from (0,0). Coordinate values are measured in points and when the scene is rendered, it will be converted to pixels.

All...

When we create a scene, we can define many of its properties such as size, origin, and so on. as we require in our game. A scene size defines the visible area in the SKView object. Of course, we can put nodes outside this area, but they will be totally ignored by the renderer.

However, if we try to change the position property of a scene, it will be ignored by Sprite Kit because a scene is a root node in a node tree, its default value is CGPointZero. But we can move scene origin by the anchorPoint property. Default value for anchorPoint is (0.5,0.5), which indicates the center point of the screen. By reassigning a new anchorPoint property, we can change the coordinate system for its child. For example, if we set anchorPoint to (0,0), the child node of the scene will start from the bottom left of the scene.

If we make the anchorPoint (0.5, 0.5) or the middle of the screen, the child node of the scene will start from the middle of the screen. It totally depends on us and what...

A node tree for a scene is created as a parent child relation. As a scene acts similar to a root node, another node acts as a child to it. Following are some common methods used to make a node tree:

If you want to remove a node from a node tree, you can use the following method:

When a node tree renders, all its children also render. First, the parent is rendered, and then, its children, in the order they are added to parent. If you have many nodes to render in a scene, it is a difficult task to maintain them in order. For this, Sprite Kit provides a solution using the z position. You can set nodes to the z position by using the zPosition property.

When you take the z position into account, the node tree will be rendered as follows:

As you've just seen, Sprite Kit uses a deterministic rendering order, based on the height nodes and their positions in the node tree. But, because the rendering order is so deterministic, Sprite Kit may be unable to apply some rendering optimizations that it might otherwise apply...

Now it is time to add a menu scene to our game. For this, select the Platformer folder and right-click on this folder, select New File. Select iOS | Source | Swift File and then Next. Inside Save As, give it the name MenuScene, and click on Create.

Click on your MenuScene.swift file. Now it's time to do some code stuff:

import SpriteKit
class MenuScene: SKScene
{
  //#1
  let PlayButton: SKSpriteNode
  let Background: SKSpriteNode
  //#2
  init(size:CGSize, playbutton:String, background:String)
  {
    PlayButton = SKSpriteNode(imageNamed: playbutton)
    Background = SKSpriteNode(imageNamed: background)
    super.init(size:size)
  }
  //#3
  required init?(coder aDecoder: NSCoder)
  {
    fatalError("init(coder:) has not been implemented")
  }
  //#4
  override func didMoveToView(view: SKView)
  {
    addChildToScene();

  }
  //#5
  func addChildToScene()
  {
    PlayButton.zPosition = 1
    Background.zPosition = 0
    Background.size = CGSize(width:self...

Create the GameScene file as we did for MenuScene:

import SpriteKit

class GameScene: SKScene
{

  let backgroundNode = SKSpriteNode(imageNamed: "BG")


  override func didMoveToView(view: SKView) {
  addBackGround()
}

  func addBackGround()
  {
    backgroundNode.zPosition = 0
    backgroundNode.size = CGSize(width:self.size.width, height:self.size.height)
    addChild(backgroundNode)
  }

  override func update(currentTime: NSTimeInterval) {

  }

}

The code is self-explanatory, we added only a background to the GameScene, the same as what we did for the MenuScene.