Water animation question once again!

Hi,

The opening scene for my game needs me to implement water animation.

At the moment I have been using object animation and the process is pretty tedious for me.

Can any one please tell me how using Tiled map editor I can implement animated water.

I would like to use the following tileset :

https://opengameart.org/content/animated-ocean-tileset

https://opengameart.org/content/lpc-animated-water-and-waterfalls

However everytime I use these tiles, I am creating a large tile size of the level and have to repeat for each frame.

It is not ideal I think.

Please suggest if there is a tutorial I can follow for water animation.

Thanks,

Tanvir

Can you share a screenshot of something you’re making that isn’t working?

I’m trying to get a sense of how you’re using Tiled and what scale of water level/area we are talking about.

There are so many ways to make levels, water animations, etc. it is quite hard to help w/o knowing how you are using the tool and making your levels.

Just giving you a random solution wont help unless it compatible with your process.

For anyone following I’ll cross link the OPs original related threads to make it easier to help and see the history of this topic:

I am using Tiled map editor

There is no way of using animated gif in Tiled map editor, it is a limitiation

  • However it is possible to use isAnimated property of tile to make object animated

However again I can only have single object for each animation and stretching object looks pretty bad

I just want a straight forward way of implementing water animation which can be made according to the size of the level

1.  You must have tried something that you can show a screenshot of no?  Please show us a screeshot of something even if you don’t have water in it. 

2.  I am not sure what this means:

… which can be made according to the size of the level …

are you saying you want some kind of ‘water fill’ for a level?

  1. You’re using Berry right?  https://github.com/ldurniat/Berry

Not being familar with Berry, but being quite familiar with Tiled, my first though at a solution is:

  1. Extract the images from the GIF on your own into N discrete frames/images.

  2. Combine those images as an image sheet.

  3. Place a marker in your tiled level that does not get drawn.

  4. Modify your code to detect the marker and to flood the level with a scaled sprite that also scales the wrap.

Note: The images need to have a power-of-two width and height for this two work.

Note 2: Be sure the flood in in a group below the other rendered content.

Done!

  1. Let me provide a video link : https://screencast-o-matic.com/watch/cFiZFuFKzZ

  2. The tilesize I get from openart is usually 32 by 32, if there are 21 frames needed for animation. I need to re adjust this everytime to

fill the whole level size which can be 600 by 600 for example. So I need to enlarge 21 frames to fit this size which is extremely tedious for me. 

  1. Using Berry right!

I looked at those images and I don’t think the are very suitable for a flood fill.

I could do water animation but painfully filling 21 frames, exporting them as png, and then recombinging them in one big frame and using them…quite frustrating this process

I’m confused.  I looked at the video and the links: 

https://opengameart.org/content/animated-ocean-tileset

https://opengameart.org/content/lpc-animated-water-and-waterfalls

 

I don’t see the images from your video in those sets.

 

Let me see if I can make a tiny demo showing how to create an animated flood fill using a set of discrete images.

 

No promises.

 

If I get it to work, I’ll post back with the demo.  If not I’ll post back that I failed.

That is not what I suggested.

I said place a single marker in your level that says to your code ‘this level has water’  then do something about the marker in your game code.

I came up with two ways to flood fill a ‘animated or moving’ water image.

waterfill.gif

https://github.com/roaminggamer/RG_FreeStuff/raw/master/AskEd/2018/07/waterfill.zip

Determining if these are suitable for you and how to get them into your game is up to you.

Thank you! I am in the process of testing the code myself now. I shall give you feedback shortly.

I tested animatedFloodFill code and this is indeed what I was looking for, not being able to do all the width height alterations manually!

Thank you so much for spending time in this, life saver!

I am digging through the code now, trying to understand it line by line.

Tip: For better performance, you may want to have a rather large set of images for the image sheet. 

That way, the flood doesn’t need to create too many sprites to ‘fill the area’.

i.e. 128 x 128 for each image in the image sheet would probably be good.  My example is 32x32 and that makes a lot of sprites to fill the screen.

Of course, you have to work with what you’ve got.

I ran it on the simulator and it seemed a bit sluggish on the mac initially

I did not build it on the iphone, need to test it there too

Thanks for the tips : I will use larger tile sheets which should improve performance. 

Yeah, my example makes 208 sprites.  If I’d used 128x128 images that would only be 16

You can further refine this to hide and/or stop sprites from playing if they are off screen. 

Re synchronizing them might be a pain though.

One other idea I had was to use the single texture fill solution and single big stretched and fill-scaled texture, then using ‘enterFrame’ just change the fill as needed to animate.

I’m not sure what the performance would be for that.

That would be a nice feature to hide sprites from playing if they are off screen

I am not exactly sure what you mean by resynchronizing :expressionless:

I have not used texture before in game, however last night I did download a few water textures from openart site, but not sure if they are to be used just like as images. I have tried to use the texture files but they do not look very good.

Thanks for your input :slight_smile:

Can you share a screenshot of something you’re making that isn’t working?

I’m trying to get a sense of how you’re using Tiled and what scale of water level/area we are talking about.

There are so many ways to make levels, water animations, etc. it is quite hard to help w/o knowing how you are using the tool and making your levels.

Just giving you a random solution wont help unless it compatible with your process.