creating animated Tiled Backgrounds

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? <img src="smileys/smiley1.gif" border="0" align="middle" />

This might help:

(pf_texture, pf_tiling)

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.

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.

You can create as much object as you have frames and swap them during runtime :D

A big pain but that should work

You can create as much object as you have frames and swap them during runtime :D

A big pain but that should work

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.

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

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

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

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!!

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)

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! <img src="smileys/smiley32.gif" border="0" align="middle" />

Hello !

I'm stuck with that 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

In fact (i'm new on C2), i don't know how to enter "int(t)%frameCount", because if i go to system, compare variable (global), i can't select something different than the name of the global variables.

I miss probably something very easy :)

EDIT:

I've done it with the family version, more easy for me to understand and do :).

Thanks a lot it works very well !

Here is my implementation of Yann 's solution.

https://drive.google.com/open?id=0B-xiq ... kkxT1ZZS0k (r206)

Such an old thread, however is the only thing that I have found that could answer my question. I have 1000s of grass sprites around my map of which have 20 frames each to sway in the wind. The lag is unbearable, I cannot continue. The only way around this is to use Tiled Backgrounds. But I cannot due to not being able to animate them.

I think I have found the solution here, but I do not understand your instructions Yann as I am still very young in Construct3. This problem of animating tiled backgrounds is the only thing stopping me from purchasing a personal license. It's preventing me from finishing my game. I could really use some help on this and I am stumped as to why they have not allowed us to actually animate our tiled backgrounds. It is such a vital feature that is lacking.

I do hope you can reply, in the mean time I am going to try and replicate what you have said and try get something working.

I have a math counter of which depending on the number spawns a sprite. This sprite has 20 frames of grass swaying in the wind. During the game depending on how much it rains, the weather and season new grass will spawn, at any time there can be 1000s, but the lag is unbearable and not possible. The only way that I can fix this lag is to find a way to have tiled backgrounds do exactly what the sprite is doing, minus the lag of course!

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

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:1x009smv]

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 repr?senting the frame. 
And then in event it would look like
[code:1x009smv]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:1x009smv]

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

Hey the Maddog

i dont think that this works for many small TBGs. It is more suitable for larger, uniform surfaces such as water.

At least in my experiment, the layout with the TBGs has a worse performance than that with the sprites:

https://1drv.ms/u/s!Ap_-qxoGKbDcg0WboINa9FBXKGKI (for C3)