creating animated Tiled Backgrounds

Get help using Construct 2

Post » Fri Feb 03, 2012 12:20 pm

hey guys and girls. so im on full speed now with my game engine. however once again ive come across a problem..
so im trying to make an animated tiled background much like a sprite, but since the object will be stretched out during runtime, a sprite will only stretch and distort the image. a tiled background keeps feeding the same image over and over nomatter how long i stretch it.
anyway to animate this i needed the animation window to pop up when i edit the tiled background, and did so by changing the edittime.js.
i changed pf_texture to pf_animation.
i saw this on another forum so tried it and it worked, i placed all my frames into the image but now when i play my game. all tiled backgrounds in the scene show up black!
now im not sure if ive just missed some code out in the editime.js or there is another way to do this.
any ideas?
B
10
S
1
Posts: 39
Reputation: 1,053

Post » Fri Feb 03, 2012 12:36 pm

This might help:

(pf_texture, pf_tiling)
B
19
S
6
G
7
Posts: 1,205
Reputation: 7,298

Post » Fri Feb 03, 2012 2:59 pm

Just changing the pf_ property won't be enough. You'll also have to look at the way sprite does its drawing and then mimic it in your animated texture plugin. There were also a lot of other things that need adjusting if you want it to work with all the other sprite features like effects or physics, or making sure it draws both in the editor and in game, and in software renderer and webgl, etcetcetcetc.

In any case, from what I remember it isn't easy and you have to get pretty deep into the plugin.wgfunstorm2012-02-03 15:01:03
B
22
S
9
G
5
Posts: 122
Reputation: 5,386

Post » Tue Jun 26, 2012 7:46 pm

Is there no way to create animated tiled backgrounds without editing js scripts? I started to create water and realized there's no way to add animation frames to the tiled background object. Would be a ton of sprites, so a tiled background would be ideal, but if there's no animation it does not look like water.
B
9
Posts: 59
Reputation: 997

Post » Tue Jun 26, 2012 8:49 pm

You can create as much object as you have frames and swap them during runtime :D
A big pain but that should work
B
60
S
22
G
14
Posts: 1,479
Reputation: 16,346

Post » Tue Jun 26, 2012 9:44 pm

[QUOTE=Yann] You can create as much object as you have frames and swap them during runtime :D
A big pain but that should work[/QUOTE]

What your saying is replace the tiled background with another tiled background, creating the illusion of a single animated background animating?

Would this not be resource intensive?

So for a simple 3 frame, 1 second, animation, the basic setup would be

tiledbackground 1 is on screen
wait 20*dt
destroy tiledbackground 1
create tiledbackground 2
tiledbackground 2 is on screen
wait 20*dt
destroy tiledbackground 2
create tiledbackground 3
tiledbackground 3 is on screen
wait 20*dt
destroy tiledbackground 3
create tiledbackground 1

Is this going to ruin my performance, the water covers more than half of the playable/viewable area.
B
9
Posts: 59
Reputation: 997

Post » Tue Jun 26, 2012 9:56 pm

nah you're doing it wrong
first you don't use dt in the wait as it's already in seconds
seconds don't create and destroy but toggle visibility
third, well you might have the free version, but I'd use families to make things more code friendly (:

Also I would use a timer variable something like
[code]Global number speed = 5 //frame by second
Global number t=0 //timer variable
Global number frameCount=3 //number of "frame" for the effect
Every tick
-> add to t speed*dt
-> tiledbg1: set invisible
-> tiledbg2: set invisible
-> tiledbg3: set invisible
int(t)%frameCount = 0
-> tiledbg1: set visible
int(t)%frameCount = 1
-> tiledbg2: set visible
int(t)%frameCount = 2
-> tiledbg3: set visible
[/code]

With family (myTiledBG), I would add a family variable named 'frame' of type number and manually set for each tiledBG in the family a number reprsenting the frame.
And then in event it would look like
[code]Global number speed = 5 //frame by second
Global number t=0 //timer variable
Global number frameCount=3
Every tick
-> add to t speed*dt
-> myTiledBG: set invisible
myTiledBG.frame = int(t)%frameCount
-> myTiledBG: set visible[/code]

As for perf, well, there shouldn't be any difference with animated sprite. That's more or less what they do, swapping texture. But yeah you'd have a little bit more object to handle, if it's less than let say 50 frames it should be ok.Yann2012-06-26 21:59:11
B
60
S
22
G
14
Posts: 1,479
Reputation: 16,346

Post » Tue Jun 26, 2012 10:06 pm

@yann - The master strikes again, thanks man! I will give it a shot and post a capx when I got something, but this seems very straightforward, thank you!!
B
9
Posts: 59
Reputation: 997

Post » Tue Jun 26, 2012 10:36 pm

i don't know if this could work with you or not but just check it :P
http://www.scirra.com/forum/plugin-tiled-sprite_topic53015.html
(from SirG)
B
45
S
15
G
6
Posts: 795
Reputation: 11,935

Post » Wed Jun 27, 2012 12:03 am

Helpful, thankyou! I think I am going to try Yann's suggestion first to avoid additional plugins, but if if I am unsucessful this is a great plan-b!

Edit:

Setup Yann's suggestion, and it works like a charm! A tiny extra bit of setup compared to an animated sprite, but the results are ideal and controllbe. Wonderful! Greg2012-06-29 00:51:57
B
9
Posts: 59
Reputation: 997

Next

Return to How do I....?

Who is online

Users browsing this forum: Braus, Google [Bot], Yahoo [Bot], zeneizel and 14 guests