How to handle many images?

@ldurniat

I’m currently looking at various options for bone based animations. 

I am at the early stages of development of an educational app that will require many animation sequences. 

How are you getting on with this library?  Did you look at Spine or Dragonbones?

25 Excellent

Hi there,  Does anyone have a general advice about which third party bone based animation tool is best suited for Corona SDK?

You should start a new thread, not post on an old one.

I left Spriter project for some time. I’m planning go back to it in near future:)

Hi,  Would you be willing to share your efforts so far?  I’d be happy to contribute, too.

Hi,

I have not done this myself yet but wouldnt it be helpful to use regular sprite animations based of spritesheets?

If you dont have it already, getting TexturePacker (3rd party app) helps alot.

My 2 cents anyway.

Anaqim

Ya it definitely sounds like your doing more work than you need to, if you arent super familiar with sprite sheets check out: 

https://docs.coronalabs.com/guide/media/spriteAnimation/index.html

You should definitely use sprite sheets. It’s much easier to use them compared to what you are describing. If you’re trying to make sprite sheets out of multiple single images, use Texture Packer.

I’m not sure a sprite sheet will be useful for me. My animations are bone based (made with Spriter - skeleton based animation software) not frame based. 

So, do you manually move the skeletal joints of the image for each frame?

I’m writing my own implementation od runtime for Corona SDK based on somebody else work :slight_smile:

You could create a function that increases in count, and for each time this occurs you could do:

display.newImage("frame" .. count .. ".png") currentImage.isVisible = false

This is a possible solution.

setting a lot of images to invisible instead of removing them could cause some performance issues depending on amount of images and resolution/size of images

Are all the images of a similar size?

If so, just change the fill of the image you need to replace.

https://docs.coronalabs.com/api/type/BitmapPaint/index.html

A sort of non-related question, but say if you had a full page image that you were replacing quite often, would it be better to use this method or replace by creating a new image and deleting the old one?

I’m pretty sure, filling a like sized image should always be cheaper/more efficient.

Tip: This is an easy thing to test and benchmark…

Fair enough, Im at work, but I’ll test tonight

In general they can have different sizes. The library that I’m building is quite robust.  It have two functions: 

  • load() - responsible for loading resources like images
  • draw( object ) - responsible for drawing images on the screen. It takes single image. The function draw is invoked as many times as needed to draw whole animation. If animation consist of 10 images the draw function  will be called 10 times. What is more a programmer can choose other animation to play at any time. So during next frame draw function will be called with different arguments.

So I’m not quite sure how to adopt your solution here. To better understand my intention I provide below  gif with animation used to tests.

If you curious my library is based on this project.  Sorry for my english. I try be clear and understandable as much as possible :slight_smile:

ToOldV5.gif

Are you telling me, that when you swap out ‘leg art’ you use different sized images?  

If all the legs are the same image size, then you can simple change the fills of legs.  However, I suspect if you’re using a bone system then the individual body parts each use a ‘same sized’ art asset.  i.e. Right arms are all the same size, but may be different from left arms, etc.

In this case, the fill solution would work fine.

No.

For testing purposes I loading all images using display.newImage at once and store it in table resources. Furthermore table resources may contains images from different animation for example images for dragon or human.  

When I need draw particular images I simply get it from table resources. So I don’t need swap images at all. I change position/scale/rotation attributes of images to make it animate. I’m looking for better solution.