Jump to content

[TOPIC: topicViewTemplate]
[GLOBAL: userSmallPhoto]
Photo

Side-scrolling background image logic
Started by fkaktos Feb 05 2014 10:42 PM

- - - - -
8 replies to this topic
sile-scrolling platform schmup background
[TOPIC CONTROLS]
This topic has been archived. This means that you cannot reply to this topic.
[/TOPIC CONTROLS]
[modOptionsDropdown]
[/modOptionsDropdown]
[reputationFilter]
[TOPIC: post.html]
#1

fkaktos

[GLOBAL: userInfoPane.html]
fkaktos
  • Enthusiast

  • 53 posts
  • Corona SDK

Hello,

let's say I want to make a horizontal or vertical side-scrolling platform or shmup.

I was always wondering how to handle the moving background.

 

The background in my example moves side-ways (or vertically), and it is not a seamless repeating image. It is an image containg graphics for a looooong corridor, or a terain for my airplane to fly above, with mountains, rivers, cities.

 

So, how do I handle this? Do I import an image that is some thousants pixels long and make it move? Is this tactic logical? How do professionals handle this? I've been wondering about this since the gameboy era!

 

Can you enlighten me on this topic?



[TOPIC: post.html]
#2

bjsorrentino

[GLOBAL: userInfoPane.html]
bjsorrentino
  • Veteran

  • 8,506 posts
  • Corona SDK

Hi @fkaktos,

How you solve this may vary, but what you should not do is attempt to load a giant image into memory and try to move it around. Not only would this occupy a vast amount of texture memory, but at a certain size (depending on the device) it would simply fail to appear because it would exceed the max texture size.

 

I may suggest that you explore the Million Tile Engine...

http://forums.coronalabs.com/forum/603-million-tile-engine/

 

…or Level Director...

http://www.retrofitproductions.com/level-director/

 

…or you build your own system in which you place "pieces" of the level together systematically as they're near to coming on the screen.

 

Hope this helps,

Brent



[TOPIC: post.html]
#3

retrofitProductions

[GLOBAL: userInfoPane.html]
retrofitProductions
  • Contributor

  • 321 posts
  • Corona SDK

I just finished a couple of examples using Level Director that deals with scrolling so you might want to check them out to see if they help you in anyway;

 

http://bit.ly/Na6NFs  - Simple 4 way scrolling around a large map

 

http://bit.ly/MNPtpA - Continuous parallax side scrolling 



[TOPIC: post.html]
#4

fkaktos

[GLOBAL: userInfoPane.html]
fkaktos
  • Enthusiast

  • 53 posts
  • Corona SDK

Thank you both!!
I'm considering purchasing Level Director,cause the free version exports only up to 5 objects.

[TOPIC: post.html]
#5

retrofitProductions

[GLOBAL: userInfoPane.html]
retrofitProductions
  • Contributor

  • 321 posts
  • Corona SDK

Hi, just uploaded another example which uses the new scrolling features of the soon to be released Level Director v2.7.

 

It includes a camera system so you can slide the level to a specific camera located on your map and allows you to track an object.

 

 

Screenshot here : http://bit.ly/LX4Lab

 

Source code from here : http://bit.ly/1c1juv1

 

Platform Graphics by Kenney Vleugels (www.kenney.nl)



[TOPIC: post.html]
#6

nicksantan

[GLOBAL: userInfoPane.html]
nicksantan
  • Contributor

  • 106 posts
  • Corona SDK

Very helpful thread, thank you. Anyone know of a Level Director alternative for OS X? I'm looking to create a endless runner-style scrolling parallax background without absolutely killing texture memory and fps. I think the tile-style RPG creators aren't quite what I'm looking for.



[TOPIC: post.html]
#7

J. A. Whye

[GLOBAL: userInfoPane.html]
J. A. Whye
  • Corona Geek

  • 1,689 posts
  • Corona SDK

I think tile maps would work fine for that, it's just a matter of artwork to make it look right. But scrolling parallax backgrounds can usually be done with 2-3 different images repeated over and over. If they're background images and the action is happening in the foreground then people won't be paying too much attention to them anyway.

 

 Jay



[TOPIC: post.html]
#8

nicksantan

[GLOBAL: userInfoPane.html]
nicksantan
  • Contributor

  • 106 posts
  • Corona SDK

Thanks for the reply, J.A. - I'm working on the game where I do just as you described - I have 2-3 images on top of each other, each moving to the left. The problem is that they're horizontally quite long to represent the changing experience of the level (but not super long, maybe 1300px long). The performance is just abysmal and I'm wondering if there's an easy way to cull what's offscreen, a la Level Director.

 

Maybe I have a core misunderstanding of how title maps work. Is it possible to just take my existing long background image and divide it up into tiles?



[TOPIC: post.html]
#9

J. A. Whye

[GLOBAL: userInfoPane.html]
J. A. Whye
  • Corona Geek

  • 1,689 posts
  • Corona SDK

Yes, you can take an image and make it into tiles and sometimes that works, but usually it's easiest when the image was designed to be tiled from the beginning. Probably worth a shot, though.




[topic_controls]
[/topic_controls]