Unity Parallax Tutorial - How to infinite scrolling background

A quick tutorial on how to achieve a cool parallax effect with infinite scrolling. This method uses a simple script, which means you don't need to mess with the z-axis. Personally, I think this is much better for a 2D game, and couldn't find any easy tutorials on it, so figured I would make my own. Go to my discord to download the tutorial resources!

//about
Hey! If you're new here, welcome! I'm an indie game developer, currently working on a physics based game using Unity. This is my devlog / devblog where I show off the progress I make on it. I'll try uploading every week, but I'm pretty busy with university and part time job, so I won't have time every week. But I'll do my best!

#UnityTutorial #unity #gamedev #indiegame #gamedevelopment #unity3d #madewithunity #indiedev #unity2d

[Danidev]

**CORRECTION***
I have no idea why I put the code in FIxedUpdate. I'm a dummy. USE Update() INSTEAD!!!


**WHY DO I PUT THE BACKGROUND ON THE CAMERA??**
To answer this commonly asked question:
*Usually* your camera follows the player. So when the player moves, the camera moves. This method is perfect for that, since the background only moves when the camera moves. Meaning the background moved when the plsyer moves.
You don't have to put the background on the camera, but you would have to reverse my script to get it working outside of the camera.

BUT if you want a moving background where the camera stands still, this implementation is not going to work. Luckily for you, that's way easier, and you just need to repeat the backgrounds at different speeds, using something like Mathf.repeat

If you have any questions regarding this, the easiest way to ask me is in my discord. You can ask me here on Youtube too, just don't expect an instant reply.

Thanks for watching! <3

[itsapocalypse]

We need more tutorials from Dani. He's pretty epic.

[geri]

Way more simple that other implemetations I've seen. Good job :D

[berkcan]

thank you for video, I'm gonna give cool tip for fast editing who loves shortcuts, press Ctrl+3 to focus on Hierarchy and then press Ctrl+4 to focus on inspector

[mesenes]

Brackeys stopped making tutorials Dani, It's your time.

[vehemyr]

at 07:00, this code doesn't work in my build.

if (temp > startpos + length) startpos += length;
else if (temp < startpos - length) startpos -= length;

The background change is 1 length too short, a quick fix is to multiply the length by 2:

if (temp > startpos + length) startpos += length * 2;
else if (temp < startpos - length) startpos -= length * 2;

Don't know if anyone else is experiencing the same problem I did, but if you did here's the solution. Oh and great vid btw.

[RylinthAnderfel]

Really appreciate this tutorial. Pretty easy to follow, straight to the point, simple code, and well presented. Helped me build an awesome parallax effect for a class project!

[andreystarenky]

Excellent tutorial thank you so much!!
For anyone trying to figure out how to get the background to not flip/invert if you're using a player going back and forth, move the camera outside of the player and set camera's position to player.

[fypo]

Well i didn't expect to find Dani from 1 year ago while searching this!

[noodledoodle]

Omg! Yesterday I thought I should request you to make a tutorial on parallax, turns out you've already made one! This is by far the *best* one I've found anywhere. Thank you :D

[squilliam]

for the lazy people
using System.Collections;
using System.Collections.Generic;
using UnityEngine;

public class Parallax : MonoBehaviour
{
private float length, startpos;
public GameObject cam;
public float parallexEffect;
void Start()
{
startpos = transform.position.x;
length =
}
void Update()
{
float temp = (cam.transform.position.x * (1 - parallexEffect));
float dist = (cam.transform.position.x * parallexEffect);
transform.position = new Vector3(startpos + dist, transform.position.y, transform.position.z);
if (temp > startpos + length) startpos += length;
else if (temp < startpos - length) startpos -= length;
}
}

[ayebeesee]

I love this implementation, it is so much simpler than other ones out there. Thank you so much for sharing!

[semirukiya]

I know this is not the most recent video, still I would like to point out one thing You've missed: What if camera is following player when he jumps? With the current script, the whole BG would jump with the player which wouldn't look too nice. Everyone who use their brain or know some basics would find the solution in an instant, but here's some tip for complete beginners: You need to add another float for Y axis and define its parameter, then put it in line:

transform.position = new Vector3(startpos + dist, transform.position.y, transform.position.z); replacing, ,transform.position.y".

That way Your BG will stay in place at Y axis. The video is great anyway, cheers to that!

[PorkandBeans]

I modified this code a bit so the background is affected by the Y position too (useful if your player character wants to move up or down)

using System.Collections;
using System.Collections.Generic;
using UnityEngine;

public class Parralax : MonoBehaviour
{
private float length, startpos, ypos;
public GameObject cam;
public float parallaxEffect;

// Start is called before the first frame update
void Start()
{
startpos = transform.position.x;
ypos = transform.position.y;
length =
}

// Update is called once per frame
void Update()
{
float temp = (cam.transform.position.x * (1 - parallaxEffect));
float dist = (cam.transform.position.x * parallaxEffect);
float ydist = (cam.transform.position.y * parallaxEffect);

transform.position = new Vector3(startpos + dist, ypos + ydist, transform.position.z);
if (temp > startpos + length)
{
startpos += length;
}
else if (temp < startpos - length)
{
startpos -= length;
}
}

[josefsilvar]

@Dani, please start making more tutorials like that again! It'd be really helpful because you explain it really great!

[yoctometric]

This is a good strait forward tutorial. The game I'm working on right now could use a background, so now that I have the code all I need to figure out is the art! Thanks

[kingdoom]

It’s been 4 years for publishing this video from dani and here we are , man this is super good tutorial thank you helped me with this stupid thing i was struggle with

[red.williams]

To people viewing in the future, if the ends of your background asset don't match up (as described in the start of this video), a possible solution could be to import the same background twice, where the second background is flipped horizontally. This will ensure that either end of the background meets another at the exact same height.

[UrFriendXD]

A few things to help anyone who has these problems:
If you're seeing the edges of the backgrounds when reaching the edge (it means your backgrounds are too short) replace the respecting code with this:
if (temp > startpos + (length - offset))
{
startpos += length;
}
else if (temp < startpos - (length - offset))
{
startpos -= length;
}


This will make it so it moves earlier than needs too. You'll also need a public float of offset and just fine-tune it to your needs.

If there's small jumping or the size of the children are not all the same (or you're lazy to find the correct X positions for each), have this script attached to each parallax child image (the dupes) and have one of each set to be marked isRight. This will automatically find the size of the image and offset them in the right X pos.
public class ParallaxChild : MonoBehaviour
{
[SerializeField] private bool isRight;
// Start is called before the first frame update
void OnValidate()
{
var length =
if (!isRight)
{
length *= -1;
}
transform.localPosition = new Vector3( length, 0, 0);
}

// Update is called once per frame
void Update()
{

}

Good luck with your Game Dev endeavors!

[JonasTyroller]

Very nice. I like the colors as well! Looks pretty cool.