★ TouchArcade needs your help. Click here to support us on Patreon.

Hello all... HQ backgrounds... how??

11-03-2010, 03:50 PM
Joined: Oct 2010
Posts: 8
Hello all... HQ backgrounds... how??

Hello all... Ive spent the last couple of months learning the ins-and-outs of gaming. I started with OpenGL ES, went to cocos2d and still having a good time with that.

My one question that I cant seem to locate info on is how to do a nice, high quality background. Something with multiple layers one scrolling faster than the other... like parallax scrolling.

Ive seen plenty of tutorials on tile maps and using Tiled to create them. Ive created a couple of basic, Zelda looking ones but Im looking for something that has some depth to it.

Can anyone give me some pointers or a link to a tutorial on how to accomplish this?

11-04-2010, 12:47 PM
I'd love to learn more about this as well!
11-04-2010, 01:13 PM
Joined: Oct 2010
Posts: 8
It doesnt look like we have any takers on this one gammabeam. There has to be a way to do it without having a super large png image as the background.

I created a giant one and loaded it in and made it scroll so my player could use the accelerometer to move around, but this didnt really achieve what I was hoping for.

I cant see doing this in Tiled, especially not with the 32px tile size. I wonder if I can have 320x480 tile sizes and just build it like that.
11-04-2010, 02:22 PM
Joined: Sep 2009
Location: Vancouver, Canada
Posts: 977
Send a message via MSN to MindJuice Send a message via Skype™ to MindJuice
There are two parallax samples in the Cocos2D package.

They use the ParallaxNode to create a scrolling background.

You can also do it yourself. Let's say you are scrolling the background from right to left and want to use several smaller "tiled" images.

You add a new nodes/image on the right just before it would appear on the screen. Then every frame you move the visible images to the left. Then as each one moves far enough into negative x coordinates, you just remove it from the display.

Once you've done this for one layer, just do it again with a second or third layer with new graphics and change the scrolling speeds.