SWT Animation Toolkit Preview

I’m currently working on a SWT Animation Toolkit (I named it SAT) which goal is to allow adding motion effects to SWT applications.

The current version supports :

  • Setting alpha level on a Shell
  • Moving any control
  • Resizing any control
  • Adding Smooth scrolling to Shell, StyledText, Canvas or any SWT custom widget

These actions use easing functions, which are well known by Flash users. Available functions are Linear, Exponential, Elastic, Bounce.

Usage :
new SmoothAction().move(shell, shell.getLocation().x, target, 1000, new BounceOut());

I uploaded a very simple demo using java webstart which should work on win32-x86, linux-gtk-x86 and OSX Leopard : SAT Demo (JavaWebstart)

On other platforms, you’ll have to run it from sources, sorry.

Update : view SAT Demo on youtube, instead of eating my bandwidth :-) (Not visible on PlanetEclipse)

The code is available on SVN :

http://sharemedia.svn.sourceforge.net/viewvc/sharemedia/trunk/

Projects :
org.sharemedia.ui.sat/
org.sharemedia.ui.sat.easing/
org.sharemedia.ui.sat.demo/

The demo is using the Nebula Gallery widget, available on eclipse’s cvs.

My RCP photo manager is already using this toolkit : windows fade-in and widgets appear smoothly in fullscreen mode. :-)

I’m not sure if this toolkit would fit in Nebula, probably not, but it would be nice if Eclipse plugins and applications could use fade effects for notifications (Mylyn, RSSOwl) or Smooth scrolling (Text editors).

License is EPL, even if the EPL header is not present on all files. Several easing equations are based on Robert Penner’s easing equations for FlashMX, distributed under the BSD license.

Update : related SWT bugs : 220173, 223637,220175. You can vote for them, if you want to.

Update 2 : This toolkit is now available in the Eclipse Nebula repository. See package org.eclipse.nebula.animation in the Nebula Gallery widget : 0.5.2 release notes, Javadoc.


Posted in Eclipse, SAT, SWT - April 13th, 2008.

hotmail correo[?]


  • http://jroller.com/eu Eugene Kuleshov

    Really neat demo. Though for the panel hiding animation you may want to reduce upper bouncing or move it up few pixels to hide not very good looking artifacts left from a scroll bar.

  • http://jroller.com/eu Eugene Kuleshov

    Really neat demo. Though for the panel hiding animation you may want to reduce upper bouncing or move it up few pixels to hide not very good looking artifacts left from a scroll bar.

  • http://andymaleh.blogspot.com/ Andy Maleh

    This is pretty sweet. Are you planning to grow the toolkit to have a complete set of animation features in the future? If so, I’d be willing to support it with easy syntax in Glimmer: http://andymaleh.blogspot.com/2007/11/glimmering-philosophy.html

  • http://andymaleh.blogspot.com Andy Maleh

    This is pretty sweet. Are you planning to grow the toolkit to have a complete set of animation features in the future? If so, I’d be willing to support it with easy syntax in Glimmer: http://andymaleh.blogspot.com/2007/11/glimmering-philosophy.html

  • http://nricheton.homeip.net/ Nicolas Richeton

    Eugene :
    Do you think removing the elastic effect when hiding the panel would be better ?

    Andy :
    Absolutely, I’ll soon add more easing equations and more effects. There are currently a few SWT bugs which prevent me from adding smooth scrolling on Table and Tree.

    Adding new effects is only a matter of implementing AbstractEffect with one method : applyEffect( long time). See this example. Contributions and ideas are welcome.

    It would be great if this toolkit ends up as an Eclipse projet / in Nebula if enough people are interested.

  • http://nricheton.homeip.net Nicolas Richeton

    Eugene :
    Do you think removing the elastic effect when hiding the panel would be better ?

    Andy :
    Absolutely, I’ll soon add more easing equations and more effects. There are currently a few SWT bugs which prevent me from adding smooth scrolling on Table and Tree.

    Adding new effects is only a matter of implementing AbstractEffect with one method : applyEffect( long time). See this example. Contributions and ideas are welcome.

    It would be great if this toolkit ends up as an Eclipse projet / in Nebula if enough people are interested.

  • http://www.martinklinke.com/ Martin Klinke

    This looks very promising! Would it also be possible to create the effect of spinning/flipping widgets like on OS X’s dashboard when switching to the settings for the clock widget?

  • http://www.martinklinke.com Martin Klinke

    This looks very promising! Would it also be possible to create the effect of spinning/flipping widgets like on OS X’s dashboard when switching to the settings for the clock widget?

  • http://nricheton.homeip.net/ Nicolas Richeton

    Martin :
    Hum, this will be hard, but it may work for custom widget subclassing Canvas by forcing redraws using Transforms on the graphic context. On native widget this is impossible.

  • http://nricheton.homeip.net Nicolas Richeton

    Martin :
    Hum, this will be hard, but it may work for custom widget subclassing Canvas by forcing redraws using Transforms on the graphic context. On native widget this is impossible.

  • http://nricheton.homeip.net/ Nicolas Richeton

    Martin :
    Got another idea : using a StackLayout a widget can be created this way :
    Stack 1 – Widget A
    Stack2 – Canvas
    Stack 3 – Widget B.

    Switching from Widget A to Widget B takes a snapshot of WA, switches to Canvas and animate the snapshot and finally switch to WB.

    This is far heavier than the current animations but it may work. I’ll do some tests if I have some free time.

  • http://nricheton.homeip.net Nicolas Richeton

    Martin :
    Got another idea : using a StackLayout a widget can be created this way :
    Stack 1 – Widget A
    Stack2 – Canvas
    Stack 3 – Widget B.

    Switching from Widget A to Widget B takes a snapshot of WA, switches to Canvas and animate the snapshot and finally switch to WB.

    This is far heavier than the current animations but it may work. I’ll do some tests if I have some free time.

  • http://andymaleh.blogspot.com/ Andy Maleh

    Nicolas, the SVN URL (http://sharemedia.svn.sourceforge.net/viewvc/sharemedia/trunk/) only allows me to see the files online, but not access them through the Eclipse SVN plugin. If you provide me with an SVN URL that allows check-out of the files, I can have a Glimmer extension ready within a week. Let me know if you prefer to send the URL directly to my email address.

  • http://andymaleh.blogspot.com Andy Maleh

    Nicolas, the SVN URL (http://sharemedia.svn.sourceforge.net/viewvc/sharemedia/trunk/) only allows me to see the files online, but not access them through the Eclipse SVN plugin. If you provide me with an SVN URL that allows check-out of the files, I can have a Glimmer extension ready within a week. Let me know if you prefer to send the URL directly to my email address.

  • http://nricheton.homeip.net/ Nicolas Richeton
  • http://nricheton.homeip.net Nicolas Richeton
  • http://andymaleh.blogspot.com/ Andy Maleh

    Thanks Nicolas. I got SAT working on my machine.

    The next step is to brainstorm ideas for an easy syntax to implement in Glimmer, so I posted a few ideas on the eclipse.technology.glimmer newsgroup for a start:
    http://www.eclipse.org/newsportal/article.php?id=10&group=eclipse.technology.glimmer#10

    Feel free to join in everyone.

  • http://andymaleh.blogspot.com Andy Maleh

    Thanks Nicolas. I got SAT working on my machine.

    The next step is to brainstorm ideas for an easy syntax to implement in Glimmer, so I posted a few ideas on the eclipse.technology.glimmer newsgroup for a start:
    http://www.eclipse.org/newsportal/article.php?id=10&group=eclipse.technology.glimmer#10

    Feel free to join in everyone.

  • Steve

    Nicolas,

    Did you look into the effects and animation API that is part of the EclipseCon e4 demo code? The API was carefully crafted to be native on WPF, Flex, Dojo and cocoa.

    Steve

  • Steve

    Nicolas,

    Did you look into the effects and animation API that is part of the EclipseCon e4 demo code? The API was carefully crafted to be native on WPF, Flex, Dojo and cocoa.

    Steve

  • http://zvikico.typepad.com/ Zviki Cohen

    Looks very cool. Well done. Eclipse is seriously missing a “wow factor”. I’m not surprised to see this coming from a Mac user :-)

    I liked the Smooth Scrolling widget that you posted earlier. I implemented something similar myself. Just one small note for the implementation: I believe you can use the widget setData/getData to store your scroller instance. I had two static methods for retrieving the scroller from the widget. That way, I didn’t have to save the scroller anywhere else and I could still gain access to the scroller. Just an idea. Keep up the good work. Kudos.

  • http://zvikico.typepad.com/ Zviki Cohen

    Looks very cool. Well done. Eclipse is seriously missing a “wow factor”. I’m not surprised to see this coming from a Mac user :-)

    I liked the Smooth Scrolling widget that you posted earlier. I implemented something similar myself. Just one small note for the implementation: I believe you can use the widget setData/getData to store your scroller instance. I had two static methods for retrieving the scroller from the widget. That way, I didn’t have to save the scroller anywhere else and I could still gain access to the scroller. Just an idea. Keep up the good work. Kudos.

  • http://nricheton.homeip.net/ Nicolas Richeton

    Steve :
    Not yet. Is this API already usable with the current SWT version (win32, carbon) ?
    I thought these demo where only a small preview of what could be e4, but I’ll take a look to the code ASAP.

    Zviki : Thanks,
    About your note : I keept the scroller out of the control so it is easy to turn on/off the smooth scrolling : ScrollingSmoother#smoothControl(true/false). I’ll think about you way and maybe update the code.
    an improved version of the SmoothScrolling class is included in the sat plugin.

  • http://nricheton.homeip.net Nicolas Richeton

    Steve :
    Not yet. Is this API already usable with the current SWT version (win32, carbon) ?
    I thought these demo where only a small preview of what could be e4, but I’ll take a look to the code ASAP.

    Zviki : Thanks,
    About your note : I keept the scroller out of the control so it is easy to turn on/off the smooth scrolling : ScrollingSmoother#smoothControl(true/false). I’ll think about you way and maybe update the code.
    an improved version of the SmoothScrolling class is included in the sat plugin.

  • Steve

    You should look at the e4 API. If you define API that cannot be implemented natively, then you miss out on native optimizations etc. and make it hard for the platform to adopt your work.

    BTW: Great work!

  • Steve

    You should look at the e4 API. If you define API that cannot be implemented natively, then you miss out on native optimizations etc. and make it hard for the platform to adopt your work.

    BTW: Great work!

  • Me

    Absolutely great, thanks!