How to Make Looping Backgrounds [Unity Tutorial]

Поделиться
HTML-код
  • Опубликовано: 16 сен 2024
  • #UnityTutorial #Unity3D #Comp3interactive #GameDev In this video we're going to create a super simple but super useful little script which will control an objects texture to force it to loop indefinitely. Perform for endless runner style games like Flappy Bird!!
    Join me and learn your way through the Unity Game Engine, the C# language and the Visual Studio editor. Remember, if this video was useful then DROP A LIKE! 👍
    🤝 SPONSORED LINKS:
    / gigatank3000
    www.gigatank30...
    💬 Join the Discord community here:
    / discord
    📱 Find us on social media for more Tips and Tricks:
    / comp3interactive
    / comp3interactive
    📱 Play our games for FREE here on Google Play:
    bit.ly/2TisAQo
    ☕ Did I help you out? Feeling generous? Consider buying me a coffee/beer🍺😍: / comp3interactive

Комментарии • 75

  • @qwasd0r
    @qwasd0r 3 дня назад

    This is the perfect tutorial for me, it's both scrolling without moving the camera AND explains a parallax effect. Thank you!

  • @Dangerous_Milk
    @Dangerous_Milk 2 года назад +56

    using UnityEngine;
    public class ScrollingBackground : MonoBehaviour
    {
    public float Speed;
    private float offset;
    private Material mat;
    private void Start()
    {
    mat = GetComponent().material;
    }
    void Update()
    {
    offset += (Time.deltaTime * Speed) / 10;
    mat.SetTextureOffset("_MainTex", new Vector2(offset, 0));
    }
    }
    Here's the code, if u r too lazy to write it yourself :)

  • @MuttleyGames
    @MuttleyGames 2 года назад +18

    Absolutely great tutorial! Here is how to make it even better:
    Instead of Unlit-Transparent Cutout, use Unlit Transparent. This will preserve any fade colors and smooth transitions, better using PNGs.
    This will cause an issue with the 2D sprites. Anything above layer 0 will render in front of the foreground and below 0 will render behind the backgrounds which is horrible.
    To fix this you will need to put code on Start to set the Layer of the 3D planes as they are set to default 0. The Unity Editor does not have a layer select for whatever reason but properties exist :D
    Put this in the Start of your scrolling script and create a new Sorting Layer:
    var tr = GetComponent();
    tr.sortingLayerName = "Forward";
    You need to manually create a Forward (or whatever you call it) layer. You can do it from any 2D sprite in the Unity Editor.
    On play all layers will be sorted correctly and you will have perfect PNG backgrounds.

  • @jocarlbasco994
    @jocarlbasco994 3 года назад +9

    This is useful. I found many tutorials about looping backgrounds but I think this is the easiest way to do.

  • @vishalkhombare
    @vishalkhombare 4 года назад +10

    Great Tut!! But in the end you should have scrolled grass fast and bkg slow , to make it feel more natural I guess.

    • @mikewestanims5785
      @mikewestanims5785 3 года назад +1

      I absolutely agree, it's how it's done in the industry too. Or else it makes it feel like the player isn't running that fast.

  • @EnchantedFailure
    @EnchantedFailure Год назад +1

    an additional comment, the plane's Y axis can be 180 rather than -180. A full loop being 360 (exactly double), this means both have the same result. 0 is facing away, 180 in either direction will flip it to the same point. a small thing but hey ho. I can make better sense of it this way so ill do it like this. Great video. Might actually pass my A-level Computer Science now..

  • @mazingood826
    @mazingood826 3 месяца назад

    as a beginner I found this video very helpful and made me figure out how to add a looping background to my project
    thank you man!

  • @scratchguitar
    @scratchguitar 2 года назад +1

    You are the best good sir!!!!! Tried to do this in various ways!!! this is the only one that worked for my at my first try and I'm a total newb!!!

  • @cratuss2661
    @cratuss2661 3 года назад +2

    awesome tutorial! i must say i was about to look for a new video when you came up with 3d objects and planes but im glad im not! it just shows me how these 3d objects that i NEVER used can be useful in 2d. i guess i have a lot to learn.

  • @rollingstonesonroad
    @rollingstonesonroad 4 года назад +2

    Incredible tutorial. Learnt something new. Keep up.

  • @themofo
    @themofo Год назад +10

    You can actually use a quad instead of a plane. It'll work the same, but there's less vertices so you'll get better performance

    • @ig9652
      @ig9652 Год назад +1

      very helpful, thanks for this

  • @Dom-wv9zm
    @Dom-wv9zm 3 года назад +2

    Great tutorial, so cool. Thanks man!

  • @vaibhavkrkm
    @vaibhavkrkm 2 месяца назад

    Thanks so much!!! You are a lifesaver! I was so annoyed that I wasn't able to use the same way I used in other things like Godot, Pygame, LOVE2D etc, since all of them work on pixels as they are very optimized for 2D… This was feeling way confusing by using 3D object, but I understood by your video easily! (In those, I used to keep two objects and move them together, then moving the first one back to the front as it crosses the screen, but in Unity, i wasnt able to make it smooth)

  • @a.....a-n2i
    @a.....a-n2i Месяц назад +1

    Nice video very useful

    • @mrguy1234_5
      @mrguy1234_5 Месяц назад

      Im trying to make a 2d game but I cant get the box collider to work so my character keeps falling through the map if you know a fix please help

  • @Emilis2023
    @Emilis2023 Год назад

    Worked like a charm, thanks!

  • @bigtimecool9635
    @bigtimecool9635 2 года назад

    yes!! this was exactly what i was looking for, thank you!!!!

  • @gameswithzeta6779
    @gameswithzeta6779 Год назад

    damn this is waaay better than other methods Ive seen.

  • @SpaceGuy2023
    @SpaceGuy2023 Год назад

    Phenomenal! thanks mate. helped me put a moving background of clouds/sky on the flappybird copycat game im making for fun!

  • @semihguner1
    @semihguner1 Год назад

    This helped me a lot! Thanks

  • @Osoclever
    @Osoclever 4 месяца назад

    Thank you

  • @daniel_druziki
    @daniel_druziki 2 года назад

    Thank you so much!!!

  • @pencilgamesstudio9330
    @pencilgamesstudio9330 4 года назад

    Nice tutorial, better than using transform with spaw point and etc Keep going ;)

  • @darkflame2848
    @darkflame2848 2 года назад

    Appriciated bro

  • @OskGame
    @OskGame 4 года назад

    nice tutorial , thanks

  • @nofilkhan3164
    @nofilkhan3164 2 года назад +3

    Why on earth on youtube nobody tells ,why are doing certain things ,i mean press this press that .type this and type that and it will work ,

  • @LEARNWITHABEGINNER
    @LEARNWITHABEGINNER 2 месяца назад

    Hi ty for this tut but I use a blurry image and when there is the transition, you can see it and looks ugly and not smooth. How can I fix that ?

  • @TheOnlySane
    @TheOnlySane Год назад +1

    Great! And now I want to move some objects, controlled by another script, in the exact same speed as the background. How do I do that?

  • @amirhusain6834
    @amirhusain6834 3 года назад +2

    Why the word 'Range' and 'MonoBehaviour' not green?

  • @nikscarr
    @nikscarr 3 года назад

    Thanks mate

  • @demetrekalandarishvili2600
    @demetrekalandarishvili2600 Год назад

    Great tutorial. Grass should have been faster and background slower though.

  • @nich_788
    @nich_788 6 месяцев назад

    Thank you so much this was very helpful. The only thing I am having trouble with is that the background is covering up my sprites. How do I move the background to the background lol.

  • @marabottojem6649
    @marabottojem6649 3 года назад

    Awesome, yet simple video! Thanks.

  • @umarra9191
    @umarra9191 3 года назад

    Hey sir, very very informative video. Sir plz make a video how we can handle animation through script.

  • @TheCoolestCube
    @TheCoolestCube Месяц назад

    Does this code only work for flat 2d images and not 3d scenes?

  • @PaulVRo
    @PaulVRo Год назад +1

    I can;t add the image as a material, why?

  • @seanholmes7482
    @seanholmes7482 3 года назад +1

    Every time I try to adjust my background image on Unity to x = 90 and y = -180 the whole pictures turns dark. Why?

    • @harleywaters156
      @harleywaters156 3 года назад

      Make sure you've disabled receive shadow, and change material shader to unlit/texture

    • @seanholmes7482
      @seanholmes7482 3 года назад

      @@harleywaters156 , do you have other videos on Unity? The object I work with keeps falling.

  • @hi_im_kuro9665
    @hi_im_kuro9665 2 года назад

    thanks

  • @makeru4024
    @makeru4024 Год назад

    somehow the background appears to be up front and i cant see the UI elements anymore. How do i fix this?

  • @faizanpers
    @faizanpers 4 месяца назад

    how to scroll smaller individual objects that cannot be stretched till boundaries like clouds

  • @davidreddick5244
    @davidreddick5244 3 года назад +1

    Has anyone else tried this method, built as webgl, and tried running on mobile? The texture seems to mess up and stretch rather than repeat as expected.

    • @singledadjimbo2968
      @singledadjimbo2968 2 года назад

      Any fix? I ran into this

    • @EvanPilb
      @EvanPilb 8 месяцев назад

      ​@@singledadjimbo2968 Fix: don't use webgl, don't use webgl on mobile

  • @vineq9367
    @vineq9367 2 года назад

    My background doesn´t move (3d game) Help.

  • @ErcumentCozerx
    @ErcumentCozerx 2 года назад

    I did but my character is 2d but plane object is 3d so my character is falling down from the ground that I made

  • @kabhes9040
    @kabhes9040 Год назад

    Okay but if the character doesn't move the background doesn't ether.

  • @daniel_druziki
    @daniel_druziki 2 года назад

    does this work for mobile game?

  • @IAmScarab
    @IAmScarab 3 года назад +1

    Looks like a great scrolling effect but how would you make this scroll with the players movement instead off continuosly?

    • @Finlzz
      @Finlzz 3 года назад

      Dani has a good tutorial for what you want

  • @trungthanhbp
    @trungthanhbp 4 года назад

    Nice assets, can i ask where you get it ^^

    • @comp3interactive
      @comp3interactive  4 года назад

      Sorry man. This was just a royalty free image I came across

  • @TheEeryTeacher
    @TheEeryTeacher 11 месяцев назад

    didn't work for me.. i think its because i need the camera to scroll on its own and not when the player is moving

  • @manolisroutsis5227
    @manolisroutsis5227 9 месяцев назад

    can youi send me the image which you used to tutorial i need the exact same one

  • @gamingsih8854
    @gamingsih8854 Год назад

    Hey bro..
    I've already follow your tutorial. But,on the process to enter play mode. I got an error like this " Material ..... (Instance) with shader 'unlit/texture' doesn't have a texture property 'MainTex' UnityEngine. material:Set TextureOffset (string, UnityEngine. Vector 2)."
    Iam new in this things and very noob. Hopefully you or anybody can help me with my problem.

    • @EnchantedFailure
      @EnchantedFailure Год назад

      did you put the underscore before it? I had this issue too, solved it when I realised I was missing the underscore. it should be "_MainTex", looking at your error I have a feeling you did miss it..

  • @ippulnugroho
    @ippulnugroho Год назад +1

    how about vertical?

    • @inkkles
      @inkkles 7 месяцев назад +1

      on 5:12 you would just put the offset on the y instead of the x, and make x 0
      i.e. mat.SetTextureOffset("_MainTex", new Vector2(0, offset)); //notice the 0 and offset got swapped to make it vertical

  • @MuhammadQasim-lg2bs
    @MuhammadQasim-lg2bs 2 года назад +1

    Doesn't work for me.

  • @fedbobgamingfeddroidgaming764
    @fedbobgamingfeddroidgaming764 Год назад +1

    Didn't work

  • @Nikelover.warspear
    @Nikelover.warspear 24 дня назад

    Doesn't work

  • @AnimeClipsUnleashed
    @AnimeClipsUnleashed Месяц назад

    the image is streched how do i make it unstreched