Sprite Kit - Make scene extend up, not down, or set initial node position to bottom left corner

Question

I am setting my scene to be my screen size times three, and my scene position is set to CGPointZero. When the scene loads, it seems to be extended down below the edge of the screen, or rather the screen shows the middle of the scene (hard to explain. My character will fall for a good ways out of view before hitting the physics body at the bottom of the scene. How do I get my scene to extend only up, or get the screen to show the bottom of the scene?

- (void)viewWillLayoutSubviews
{
    // Configure the view.
    SKView * skView = (SKView *)self.view;
    if (!skView.scene) {
        skView.showsFPS = YES;
        skView.showsNodeCount = YES;
        skView.ignoresSiblingOrder = YES;
        skView.showsPhysics = YES;
        // Create and configure the scene.
        CGSize screenSize = CGSizeMake(skView.bounds.size.width, skView.bounds.size.height * 3);
        scene = [GameScene sceneWithSize:screenSize];//skView.bounds.size
        scene.gvc = self;
        scene.position = CGPointZero;
        scene.scaleMode = SKSceneScaleModeAspectFill;

        // Present the scene.
        [skView presentScene:scene];
    }
}

adding worldNode in GameScene:

worldNode = [[SKNode alloc]init];
    [self addChild:worldNode];

everything is added to worldNode and it is supposed to follow the character as in my other question here.

Edit: I figured out my problem, but not the solution. When I set my scene size to height * 3, it is setting the correct size, but the (0,0) point for the view controller is the top left corner. When the scene loads, it is showing the top of my scene, and the scene extends below it. How do I position my (0,0) of the scene to the bottom left (so (0, self.frame.size.height))?

Answer 1

Create a background composition

You can create a background composition using the next function:

func backgroundNode() -> SKSpriteNode {
  // Create a container node for your background
  let backgroundNode = SKSpriteNode()
  backgroundNode.anchorPoint = CGPointZero
  backgroundNode.name = "background"

  // Start the creation of each part of the background and add it to the container node
  let background1 = SKSpriteNode(imageNamed: "background1")
  background1.anchorPoint = CGPointZero
  background1.position = CGPoint(x: 0, y: 0)
  backgroundNode.addChild(background1)

  let background2 = SKSpriteNode(imageNamed: "background2")
  background2.anchorPoint = CGPointZero
  background2.position = CGPoint(x: 0, y: background1.size.height)
  backgroundNode.addChild(background2)

  let background3 = SKSpriteNode(imageNamed: "background3")
  background3.anchorPoint = CGPointZero
  background3.position = CGPoint(x: 0, y: background1.size.height * 2)
  backgroundNode.addChild(background3)

  // The use of (background1.size.height * 3) depends if your background images have the same
  // height, otherwise just sum al the heights instead of multiply them
  backgroundNode.size = CGSize(width: background1.size.width, height: background1.size.height * 3)
  return backgroundNode
}

Now you can use the function to create and place your background node:

let background = backgroundNode()
background.anchorPoint = CGPointZero
background.position = CGPointZero
background.name = "background"
addChild(background)

Scrolling or moving the background

Move the background is a quite complex task and depends too much of what your a trying to accomplish in your game.

Here is a piece of code from the Ray Wenderlich's book iOS Games by Tutorials Third Edition to move the background horizontally with the movement of the nodes and the finger, but you can try to modify it to meet your goals.

let backgroundMovePointsPerSec: CGFloat = 200.0

func moveBackground() {
  enumerateChildNodesWithName("background") { node, _ in
    let background = node as SKSpriteNode
    let backgroundVelocity = CGPoint(x: -self.backgroundMovePointsPerSec, y: 0)
    // dt(NSTimeInterval) is a property defined to keep track of the last time Sprite Kit called
    // update() and the delta time since the last update. update() is the Game Loop.
    let amountToMove = backgroundVelocity * CGFloat(self.dt) background.position += amountToMove
  }
}

This code is using the awesome SKUtils Swift+SpriteKit extensions from Ray Wenderlich too.