Optimizing Animations
-
I am developing an application that includes a large number of animations. The animations are currently sequences of png files. As shown below, I am using NumberAnimation to sequence the png files at a 30 hz frame rate.
Image { id: preludeAnimation x: 0 y: 0 property int startImage: 304 visible: true source: "../Resources/PNGs/Renderings/"+preludeAnimationDirectory.intValue+"/1-"+startImage+".png" NumberAnimation on startImage { id:preludeNumberAnimation1 from: 304 to: 480 duration: 6000 }
Unfortunately, the animations result in dropped frames on my target platform, which is an X86 based 800Mhz AMD process, with 4GB RAM.
Is there a more efficient, i.e., faster, way to generate the animations using QML?
Thank you in advance.
Hoyt
-
Hi
I was developing a game were I had dynamic objects with initial animation when created. If those object were created with the main loop running, the animation were very very slow, else with the main loop stopped, animations were good. I had to do animations with a timer, it worked very well. So do try to use a timer to sequence your images to see if your can get better performance. -
try to use Sprite Animation instead with atlas sprite
-
Hi,
You should have a look at V-Play. It will help you enhance the performance and at the same time reduce the lines of code you'll have to write.
V-Play offers different ways to add animations with high performance to both Apps and Games. You can directly integrate the animations offered by V-Play into any existing Qt application.
- Animations with TexturePacker
- Heavily reduce storage and memory consumption, therefore speed up your app or game.
- Use this for animations that consist of a sequence of images (Sprites)
- Check out the Tutorial
- Skeleton-Animations with Spine
Code example with Texture Packer Animation:
TexturePackerAnimatedSpriteVPlay { id: nailgunSprite source: "../assets/img/squaby.json" frameNames: ["nailgun.png"] x: 100 y: 100 }
Code Example with Spine Animation:
Goblins { // note this is the name of the animation id: goblin skins.state: "GOBLIN" //initial skin x: scene.width / 2 y: scene.height / 2 }
Best,
Lorenz - Animations with TexturePacker