Animator allows you to add CSS transitions and animations to any component from the server side.

Version 2.0

The Animator is an extension that can animate any component in your Vaadin application using an easy-to-use server side API. The animations are implemented using CSS transitions and animations in the browser.

It provides low level methods for defining your animations just as you like and not limiting you to a set of predefined animation types (unlike the previous version of Animator and AnimatorProxy).

The Animator is well suited for adding UI flourishes to your app, without overwhelming the user. It's not well suited for building complex animation sequences.

DEPENDENCIES (you need to add these for Maven explicitly in your pom.xml):

  • DOM add-on 0.1.0 (see links on the right side)

Previous versions (1.7 and 1.6)

Animate any component, even sub-windows with a small set of usable animations.

The AnimatorProxy is an invisible component that animates other components directly, without additional component hierarchy or DOM element overhead. In principal, you only need one AnimatorProxy in your application, and you can then animate any other components in that same application: size, position, fading and rolling/curtaining.

The AnimatorProxy also provides a convenient listener mechanism for all animations that are run through it, allowing you to make actions after an animation has finished.

See the online demo for available animation types and examples.

All animations allow you to specify the duration and delay of the animation. The animations are atomic, so they won't repeat automatically each time the user reloads the application.

Version summary

3.0 == Vaadin 8 2.0 == Vaadin 7, connector extension, CSS transitions and animations 1.7 == Vaadin 7, legacy component, JS animations 1.6 == Vaadin 6, JS animations


Link to this version
StableReleased 27 April 2012Apache License 2.0
Framework Support
Vaadin 6.5+
Also supported:
Vaadin 7 (2.0.0)Vaadin 8 (3.0.0)
Browser Compatibility
Install with
Release notes - Version 1.6.6

Added AnimatorProxy.removeListener(AnimationListener). AnimatorProxy.cancelAll() now cancels any pending animations on the client as well.