Friday, November 20, 2015

Quick Tip: Endless scrolling with SpriteKit and SWIFT (Part 2 of 2)

Natural endless scrolling with easing

Welcome to my tutorial series about scrolling:
  • Part 1: Endless scrolling with background tiles
  • Part 2: Natural endless scrolling with easing


In part one I showed how to implement endless scrolling. This is working fine, but there is still room for improvements. The scrolling starts immediately with full speed and also stops directly after the touch ends. A more natural movement would be to increase and decrease the speed slowly, till the target speed is reached or the movement is stopped. These is also known as ease in or ease out animation.
Thank you to hamobi who helped me with my Stackoverflow question for finding the right solution.

To give you an impression compare the two videos:

Without Easing:




With Easing:





Thursday, November 12, 2015

Quick Tip: Endless scrolling with SpriteKit and SWIFT (Part 1 of 2)

Endless scrolling with background tiles

Welcome to my new tutorial series about scrolling:
  • Part 1: Endless scrolling with background tiles
  • Part 2: Natural endless scrolling with easing

This video gives an impression what I'll show today:




1. About the algorithm and the background tiles


Creating the image tiles for the scrolling parts of the background:


First we need a background image:


Let's mirror this image and add the new one at the right side: