Serial WebAnimations

Trying to get my head round best practice for WebAnimator usage.
If I code a series of animations for an object, ie Rotate and Move, then issue the .play command, then both the Rotate and Move animations will simultaneously run (as expected). ie the object will rotate and move in one single action.

MyAnimator.RotateZ(MyContainer, 90, 2.0)
MyAnimator.Move(MyContainer, 100, 100, 2.0)

If I amend this code, by setting the rotation duration to 0 my expectation would be that the rotation would be instant, followed by the movement - but the amended version plays identical to the above code.

So perhaps it’s a question of “Playing” the rotation first, then adding the movement code into the animator’s .AnimationComplete event handler?? -But if I do that, then surely the AnimationComplete event will get into a never-ending loop?? (Maybe control that by passing a Tag variable??)

What is the proper way? Docs seem very sparse on WebAnimator.

Or maybe serialized animations are not supported??

Really?? Is there no one here that knows how WebAnimator control should work??

I’m doing a lot of Web 2 dev, but didn’t spend a second yet on animations, sorry.

No apology necessary Jeannot - I figure that animating stuff on web pages is rather more niche than I anticipated.

If anyone is interested, they can view some of this animation in action on a Playing Cards game platform I built with Xojo 2019r1 - it’s quite fun! Just enter the “Game Code” of XOJODEMO and open upto 4 tabs ( and login as 4 different players to see the whole thing in action.

Have a great day!

1 Like

Great! Well I asked myself why you are so interested in web animations, as I personally don’t like them too much. I was proven wrong again :wink: . In my context (mainly business apps, there is no real need for animations). But for something like your app, I do understand that they are kind of prerequisite.

It is indeed impressive just how wide a variety of apps that can be built with Xojo.

As a matter of record (if anyone else stumbles across this thread) - I have now solved my original question.

You can chain together a series of animations, simply by adding a keyframe:

MyAnimator.RotateZ(MyContainer, 90, 0)
MyAnimator.Move(MyContainer, 100, 100, 2.0)

Although the docs still leave me confused between AddKeyFrame and AddNextKeyFrame !

If I remember right, Greg said that WebAnimator is not available for Web 2.00


Thank you Michel, you are right, I just double-checked. Lucky me, I didn’t need them yet :-). I find it still confusing that on this forum we have no separate categories for web 1 and web 2, they are 2 different beasts.


I agree. The forum “Targets” categories should be sub-divided to Web1 & Web2