The way to go with complex animations
-
Hello,
When developing a complex graphical application in QML what is the best approach with complex animations?
Usually, when developing a new application our designer creates all the screens, transitions and animations. Sometimes these animations are really complex and would be a lot of trouble to code them.
Normally, I'd ask him to deliver me a video file and I would play it inside the application. However, sometimes there are transparencies involved and this is not the best way to go.I thought of using png image sequences and changing the frame displayed with a timer set to the frame rate of given animation. Another option would be transforming the whole animation into a sprite sheet and using AnimatedSprite objects.
Is this the right approach? If not, what is the best way to do this? -
I'm not really understand what you mean with complex animations. What you wrote sounds a little bit like a flash movie on a web site where some little animations would play like a little jumping figure? And this animations are not really interactive because you wrote you normally use videos. You can do this in qml take a look at "this":http://qt-project.org/doc/qt-4.8/qdeclarativeanimation.html there are several ways in qml to make animations. Another thing for me, if an animation is sooo complex maybe you need to talk with your designer. Some things are only work in videos (adobe photoshop, fireworks you name it) but never in a real app. You know what i mean?
-
Sometimes the animations are not interactive, sometimes they are. In cases which they are I cannot use videos, of course.
The current app I'm working on has a semi-transparent countdown with lots of graphical elements around the numbers. The countdown is drawn over a webcam image.
I cannot use videos in this case since the animation uses transparency and Qt doesn't play very well with transparent videos.
-
Hmmm, lots of graphical elements around the number ok, but they are also animated like the numbers? Sorry can't imagine that
-
Yes, they are also animated. I'm sorry I still cannot show you any images because the project is under development. Think about numbers coming towards the screen surrounded by flying butterflies.
Anyhow, the question remains: for transparent animations that I cannot code and that should be drawn over other parts of the app, what is the recommended way of displaying them?
A PNG sequence, sprites or any other way? -
Hmm, the butterflies should be a "animated sprite":http://qt-project.org/doc/qt-5/qtquick-effects-sprites.html for the butterfly animation itself. For moving the butterflies i would use the animation elements from qt. Hope this help. Another option is to use scnenegraph and create your own custom butterfly element.