2D Scrolling Backgrounds

Checked with version: 4.5

-

Difficulty: Intermediate

Scrolling Background can really help sell a 2D game and keep the performance high and the code efficient. In this session we will look as various ways to move and scroll backgrounds, create the feeling of parallax and look at ways to efficiently manage the assets and code. Tutor: Adam Buckner

2D Scrolling Backgrounds

Intermediate 2D Game Creation

Download the project images HERE.

Please note that "Done_BGScroller" can be found in the Space Shooter tutorial in the context of the completed game.

Done_BGScroller

Code snippet

using UnityEngine;
using System.Collections;

public class Done_BGScroller : MonoBehaviour
{
    public float scrollSpeed;
    public float tileSizeZ;

    private Vector3 startPosition;

    void Start ()
    {
        startPosition = transform.position;
    }

    void Update ()
    {
        float newPosition = Mathf.Repeat(Time.time * scrollSpeed, tileSizeZ);
        transform.position = startPosition + Vector3.forward * newPosition;
    }
}

OffsetScroller

Code snippet

using UnityEngine;
using System.Collections;

public class OffsetScroller : MonoBehaviour {

    public float scrollSpeed;
    private Vector2 savedOffset;

    void Start () {
        savedOffset = renderer.sharedMaterial.GetTextureOffset ("_MainTex");
    }

    void Update () {
        float y = Mathf.Repeat (Time.time * scrollSpeed, 1);
        Vector2 offset = new Vector2 (savedOffset.x, y);
        renderer.sharedMaterial.SetTextureOffset ("_MainTex", offset);
    }

    void OnDisable () {
        renderer.sharedMaterial.SetTextureOffset ("_MainTex", savedOffset);
    }
}

StripScroller

Code snippet

using UnityEngine;
using System.Collections;

public class StripScroller : MonoBehaviour {
    
    public float scrollSpeed;
    public float tileSizeZ;

    private Vector2 savedOffset;
    private Vector3 startPosition;
    
    void Start ()
    {
        startPosition = transform.position;
        savedOffset = renderer.sharedMaterial.GetTextureOffset ("_MainTex");
    }
    
    void Update ()
    {
        float x = Mathf.Repeat (Time.time * scrollSpeed, tileSizeZ * 4);
        x = x / tileSizeZ;
        x = Mathf.Floor (x);
        x = x / 4;
        Vector2 offset = new Vector2 (x, savedOffset.y);
        renderer.sharedMaterial.SetTextureOffset ("_MainTex", offset);
        float newPosition = Mathf.Repeat(Time.time * scrollSpeed, tileSizeZ);
        transform.position = startPosition + Vector3.back * newPosition;
    }
    
    void OnDisable () {
        renderer.sharedMaterial.SetTextureOffset ("_MainTex", savedOffset);
    }
}

Related tutorials

Related documentation

2D Game Creation

  1. 2D Game Development Walkthrough
  2. 2D Mode
  3. The Sprite Type
  4. Sprite Renderer
  5. The Sprite Editor
  6. Sorting Layers
  1. 2D Physics Overview
  2. Rigidbody 2D
  3. Collider 2D
  4. Hinge Joint 2D
  5. Area Effector 2D
  6. Distance Joint 2D
  7. Point Effector 2D
  8. Bouncing & Sliding in 2D
  1. Introduction to Unity from a 2D perspective
  2. 2D Character Controllers
  3. 2D Catch Game - Pt 1
  4. 2D Catch Game - Pt 2
  5. 2D Catch Game - Pt 3
  6. 2D Catch Game - Q&A / AMA
  7. 2D Scrolling Backgrounds
  8. Top Down 2D Game Basics
  9. 2D Physics: Fun with Effectors
  10. Making an "Angry Birds" style game - Part 1
  11. Making an "Angry Birds" style game - Part 2
  12. 2D Games for Non-Programmers
  1. Project Goals
  2. Adding Sprites
  3. The Bird Script
  4. Animating The Bird
  5. Score and GameOver UI Setup
  6. Adding The Game Controller
  7. Scrolling Repeating Backgrounds
  8. Adding Column Obstacles
  9. Recycling Obstacles With Object Pooling
  10. Questions and Answers
  1. Intro and Session Goals
  2. Scripting Gravity
  3. Detecting Overlaps
  4. Scripting Collision
  5. Horizontal Movement
  6. Player Controller Script
  7. Adding Player Animation
  8. Questions and Answers
  1. Introduction and Goals
  2. Sorting Layers and 9-Slice Sprites
  3. 2D Composite and Capsule Colliders
  4. Sorting Groups and Transparency Sort Axis
  5. 2D Physics Reference Project
  6. Questions and Answers
  1. Introduction to 2D Essentials
  2. 2D Character Setup with Corgi Engine
  3. 2D Follow Camera w/ Cinemachine
  4. Adding Enemies with Corgi Engine
  5. 2D Lighting with 2DDL Pro
  6. Tween Effects with DOTween Pro
  7. Easy UI with Doozy UI
  8. Questions and Answers for 2D Essentials
  1. Intro to 2D World building w/ Tilemap
  2. Core Tilemap Concepts
  3. Tilemap Collider 2D and Composite Collider 2D
  4. Confined Follow Camera with Cinemachine For 2D
  5. Using Rule Tiles With Tilemap
  6. Random and Animated Tilemap Tiles
  7. Custom Tilemap Brush To Spawn Prefabs
  8. Questions and Answers for 2D Worldbuilding
  1. Getting Started with SVG Importer