Parallax Scrolling TileSprite with Phaser 3

Download the files: ansimuz.itch.i...
Find me at:
SHOP: ansimuz.itch.io/
TWITTER: / ansimuz
WEBSITE: www.pixelgamea...
PATREON PAGE: / ansimuz
Music by Vector U / theprummer

[@EmiliaKaida]

Super concise and helpful ! This is exactly what tutorials should be, at least for pragmatic uses. Thank you so much for the tutorial. I have also just started out with Phaser 3 and game dev, hope to make friends with all the other developers !

[@jhice_fr]

Ingenious ! It changes from the classic approach (moving copies on the sides of the screen). Thanks for the tip.

[@luqmansen]

dude, this is the best explanation on the internet, many thanks !

[@ayushchaudhary2200]

I'm confused if Phaser is mind-blowing or your tutorials are mind-blowing🤯

[@vitormelo22]

Thanks Zuno, your tutorial was amazing.

[@abdulrahmanalrasheed9330]

Amazing as always ❤

[@ansimuz]

Thanks !

[@barjuandavis]

OMG I REALLY NEED THIS RIGHT ON TIME THANKS DUDE U HELPED MY SCHOOL PROJECT :')))

[@pokegaiyui]

Thank you - you saved my day!

[@trungthanhbp]

Thanks for the series, love you from VietNam

[@sergiobarros8131]

I envy you. You make the best Phaser tutorial's. How can it be so god, so short, and complete? Thanks.

[@КириллДолбилов-д7д]

Thank you so so so much!!!

[@rasulakhundov500]

Thank You so much bro

[@josecarloshuertagarcia2802]

I love this video, thak u.

[@HipHopPanda1208]

Gotta love the music from Mario Oddysey :)

[@alivalishov]

Thanks for these amazing tutorials! I am wondering; is it really possible to create games that run on the browser & be a native game on mobile?

[@nerikacutie283]

smo ost rules

[@igorconde5394]

Thanks, cool u helped me alot !!4

[@static785]

thank you so much! very helpful and worked great for my parallax background. I decided to implement the same method for my credits image b/c im not comfortable with bitmap text just yet. How would I go about having the tileSprite STOP scrolling once it reaches the end of the image? Or should I be using a different method for this?

[@theranchkeeperod7362]

Can I use scene created in Photoshop as background and foreground rather than tile maps

[@ansimuz]

Yes you can .

[@AJDOLDCHANNELARCHIVE]

How would you rate Phaser 3 vs Construct 2/3? In-terms of ease of use and performance.

[@ansimuz]

C2 is easier to learn and Phaser is Cheaper (Free). But in the long run Phaser is a more complete framework if you are the developer type.

[@adamsinclair2246]

I'm fairly new to Phaser 3. I can't speak for any other framework. The learning curve of Phaser 3 can be frustrating at times. But the more I learn and understand Phaser, the more I realize it's an excellent framework. I was happy to see features like camera shake, particle emitter, integration with Tiled, and physics simulation (Arcade / Impact / Matter.js). What really kept me working with Phaser was the active support from the developers. I ran into an issue when trying to connect an Xbox controller, and found a reported issue on GitHub. I added a comment saying I was having similar issues, and within 48 hours the issue was fixed. Maybe I just got lucky with timing, but I saw the devs are still very active and I think that's valuable. My only complaint is the Phaser 3 Labs. The folder structure can be a little confusing sometimes, and I mostly had to rely on forum posts with users linking to a specific Phaser 3 Lab example.

[@TheUnleashedGamerX]

Nice. I want to use TileSprites as background and make it like an infinite loop. So basically I just do: " tileSprite.x += 2". Now the background/tile moves from one side to the other, but it doesn't loop. How do I do that?

[@ansimuz]

Make sure you defined the background as a tilesprite 0:46 and it is "tilePositionX" not "tileSprite.x"

[@TheUnleashedGamerX]

@@ansimuz thanks dude. Can I change the position of the whole layer? I want to develop an endless runner/scroller

[@TheUnleashedGamerX]

@@ansimuz using layer.setPosition([]); makes the collision not work anymore

[@ansimuz]

​@@TheUnleashedGamerX Just change the position like this this.bg_1.x = 100; if you needed to set it 100 pixels on x axis.

[@zainfazal3964]

@@ansimuz Could you explain? I don't get what you mean

[@theranchkeeperod7362]

Does phaser support low end pc

[@nadavrot]

Phaser is a framework for developing web-based games. That means that as long as you are using a modern browser it will work flawlessly even on a low spec PC.