Scrolling Background by Touch
floatingwoo
Los Angeles, Calif.Member Posts: 393
Hey all, I'm looking for information on how to set up a side scrolling endless background that moves with a touch. That is when the screen is touched the background slowly starts to move along, when the user takes his finger off ,the scrolling comes to a smooth stop. I would like to use an ease in/out so the movement would be really smooth. I found a kids game by Sago that has it ...heres a video http://tinypic.com/m/iwrci0/2
In the video each time the screen is touched the background advances.
Comments
I've created a small demo for you in the Mac version of GS - tho they say it should work seamlessly in the new Windows version as well.
Basically there are 3 layers... a sky background (which doesn't move), a clouds layer and a mountains layer.
The sky looks for the touch. When it's touched, it sets a game attribute (moving) to true, otherwise it sets it to false
The other two actors look for this game.moving and when it's true they constrain their linear.velocity.x to their speed (-100 for clouds, -200 for mountains). They are set to scroll seamlessly but my graphics are quick so they have some issues.
When released, the two layers interpolate their linear.velocity.x to 0.
Is that what you are looking for?
https://dropbox.com/s/aw0wemiim5esnzx/Scrolling%20Background%20Demo.gameproj.zip?dl=0
@ookami007 Yes, works very nice. Thank you. The interpolate when released eases out quite nicely. The start when touch is pressed is not bad, but, is there a way to possibly drop an ease in there? At the start I mean.
I guess theres lots of ways of doing this. I ended up just using accelerate and playing with the friction and drag settings.
If you didn't want to mess with the physics settings you could set a Max Speed in the Motion Options like I did in this sample as well.
http://jamie-cross.net/posts/ ✮ Udemy: Introduction to Mobile Games Development ✮ Learn Mobile Game Development in One Day Using Gamesalad ✮ My Patreon Page
Thanks Jamie! I will take a look. I found just using accelerate and turning on wrapX has some issues once the center point gets past the lefthand side of the scene theres a dead zone. The user would have to touch inside the next image to move it along. I knew it was to easy.
I just took the previous demo from @ookami007 and used Accelerate Behaviors like you did. But to stop the actors from moving too quickly I also set a max speed and applied it in the Motion Options. Seemed to work pretty well though I admit I didn't test it extensively.
http://jamie-cross.net/posts/ ✮ Udemy: Introduction to Mobile Games Development ✮ Learn Mobile Game Development in One Day Using Gamesalad ✮ My Patreon Page
@jamie_c Yeah it's funny, the accelerate and the interpolate seem to be fighting each other theres a bit of a lag until you finesse the settings in each.
But hey, while I got you, I was using your scrolling background demo. The one off your site Mostly Creative ...http://www.jamie-cross.net
The demo where you show how to scroll the background with spawning or recycling...I could take that and create a game attribute boolean called moving (Edit_Create an invisible actor that acts as a touch pad )and then set up a rule when touch is pressed change att: game.moving to true . That would work right?
@floatingwoo, I think it should work fine yeah. Let me know if it doesn't.
http://jamie-cross.net/posts/ ✮ Udemy: Introduction to Mobile Games Development ✮ Learn Mobile Game Development in One Day Using Gamesalad ✮ My Patreon Page
It works fine with the move behavior, which doesn't help with the ease in and out issue. Using accelerate creates the problem of having the image run away before the new spawned image has a chance to catch up. I'll keep wiring with what I got . Thanks