Animation in Java

9,505 views

Published on

This slide describes how to create animation effect in java with timing framework

Published in: Technology
0 Comments
3 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
9,505
On SlideShare
0
From Embeds
0
Number of Embeds
88
Actions
Shares
0
Downloads
0
Comments
0
Likes
3
Embeds 0
No embeds

No notes for slide

Animation in Java

  1. 1. Animation in Java [email_address]
  2. 2. D isclaimer <ul><li>Rendering or Performance issues are not covered here </li></ul>
  3. 3. Simplest Example
  4. 4. Using Timer
  5. 5. 2 Timers in Java World <ul><li>java.util.Timer </li></ul><ul><ul><li>for general use </li></ul></ul><ul><ul><ul><li>calls java.util.TimerTask instance </li></ul></ul></ul><ul><ul><li>good for scheduling tasks </li></ul></ul><ul><ul><ul><li>specifying time for task </li></ul></ul></ul><ul><li>javax.swing.Timer </li></ul><ul><ul><li>GUI specific </li></ul></ul><ul><ul><ul><li>calls java.awt.event.ActionListener instance </li></ul></ul></ul><ul><ul><li>called on EDT </li></ul></ul>
  6. 6. Working Implementation <ul><li>Example1 </li></ul>labelPanel.getObj()
  7. 7. Code & Demo of Example 1 timer = new Timer(10, new ActionListener() { public void actionPerformed(ActionEvent e) { if(xPos < xEndPos) { xPos += xDiff; JComponent obj = labelPanel.getObject(); obj.setLocation( xPos, obj.getY() ); } else { timer.stop(); xPos = 0; } } }); timer.start();
  8. 8. Is it enough? <ul><li>What about </li></ul><ul><ul><li>Repetition </li></ul></ul><ul><ul><li>Duration </li></ul></ul><ul><ul><li>On slow machine </li></ul></ul><ul><ul><li>Non-linear interpolation </li></ul></ul><ul><ul><li>Reverse direction </li></ul></ul><ul><ul><ul><li>Back and Forth </li></ul></ul></ul>
  9. 9. Time based animation <ul><li>v = f(t) </li></ul>
  10. 10. Key Concepts of Timing Model <ul><li>Cycle </li></ul><ul><ul><li>Smallest unit for animation </li></ul></ul><ul><li>Envelope </li></ul><ul><ul><li>container of same cycles </li></ul></ul><ul><li>TimingController </li></ul><ul><ul><li>uses Cycles & Envelopes </li></ul></ul><ul><ul><li>Synthesize TimingEvent (s) </li></ul></ul><ul><li>TimingTarget </li></ul><ul><ul><li>Interface we should implements </li></ul></ul><ul><ul><li>Modify value based on timing event </li></ul></ul>
  11. 11. Cycle
  12. 12. Envelope
  13. 13. Envelope ( bonus ) <ul><li>Repeat Behavior </li></ul><ul><ul><li>FORWARD or REVERSE </li></ul></ul><ul><ul><li>at the end of each cycles </li></ul></ul><ul><li>End Behavior </li></ul><ul><ul><li>HOLD or RESET </li></ul></ul><ul><ul><li>at the end of the Envelope </li></ul></ul>
  14. 14. Timing Target <ul><li>Interface we should implement </li></ul><ul><li>callback for timing events </li></ul><ul><li>where the formula ( v=f(t) ) resides </li></ul>
  15. 15. Example 2 // duration : 1s , resolution : 10 ms Cycle horizontalCycle = new Cycle( 1000, 10 ); // repeat 5 times , beginning delay : 0 ms Envelope simpleEnv = new Envelope( 5, 0, Envelope.RepeatBehavior.FORWARD, Envelope.EndBehavior.HOLD ); TimingTarget tt = new TimingTarget() { public void begin() {} public void end() {} public void timingEvent(long cycleElapsedTime, long totalElapsedTime, float fraction) { int x = (int)(fraction * 400); JComponent obj = labelPanel.getObject(); obj.setLocation( x, obj.getY() ); } }; TimingController controller = new TimingController( horizontalCycle, simpleEnv ); controller.addTarget( tt ); controller.start();
  16. 16. Demo of Example 2 <ul><li>Duration </li></ul><ul><li>Resolution </li></ul><ul><li>Beginning delay </li></ul><ul><li>Repeat Count </li></ul><ul><li>Repeat Behavior </li></ul>
  17. 17. Hardcore Animation Non-linear Interpolation Acceleration Deceleration Property Range Object Modifier Trigger Multi-Step Animation
  18. 18. Non-linear Interpolation <ul><li>Real World is non-linear </li></ul><ul><ul><li>Gravity, Acceleration, friction… </li></ul></ul><ul><li>Non-linear movement looks more natural </li></ul><ul><li>see KeySplines , KeyFrames </li></ul>Ease-in Ease-in, Ease-out Quick Start
  19. 19. Acceleration / Deceleration <ul><li>Simple & useful non-linear interpolation </li></ul><ul><li>Float value between 0 and 1 </li></ul><ul><li>Fraction of time spent speeding up or slowing down </li></ul><ul><li>Demo please </li></ul><ul><ul><li>modifying Example 2 </li></ul></ul>
  20. 20. Property Setter <ul><li>Property is CBD term for field or member variable </li></ul><ul><li>Animate property of JavaBeans </li></ul><ul><li>Consists of </li></ul><ul><ul><li>PropertyRange </li></ul></ul><ul><ul><ul><li>property name + value range </li></ul></ul></ul><ul><ul><ul><li>int, double, float, Dimension, Point, Color, Rectangle </li></ul></ul></ul><ul><ul><li>Object modifier </li></ul></ul><ul><ul><ul><li>implements TimingTarget </li></ul></ul></ul>
  21. 21. Example 3 & Demo Cycle horizontalCycle = new Cycle( 1000, 10 ); Envelope simpleEnv = new Envelope( 1, 0, RepeatBehavior.REVERSE, EndBehavior.HOLD ); Rectangle from = new Rectangle( 0, 0, 0, 0 ); Rectangle to = new Rectangle( 100, 100, 200, 200 ); PropertyRange boundsRange = PropertyRange.createPropertyRangeRectangle(&quot;bounds&quot;, from, to); TimingTarget tt = new ObjectModifier( labelPanel.getObject(), boundsRange ); TimingController controller = new TimingController( horizontalCycle, simpleEnv ); controller.addTarget( tt ); controller.start();
  22. 22. Trigger <ul><li>Utilities to reduce event listener code </li></ul><ul><li>Useful for </li></ul><ul><ul><li>Hover effect for buttons </li></ul></ul><ul><ul><li>Pulsating effect for focus events </li></ul></ul><ul><ul><li>Animation on action events </li></ul></ul><ul><li>ActionTrigger, ButtonStateTrigger, ComponentFocusTrigger, TimingTrigger </li></ul>
  23. 23. Trigger Example from JavaOne2006 TS-1297 Slide
  24. 24. Multi-Step Animations <ul><li>KeyValues, KeyTimes, KeySplines, KeyFrames (Example 4) </li></ul>Cycle horizontalCycle = new Cycle( 1000, 10 ); Envelope simpleEnv = new Envelope( 1, 0, REVERSE, HOLD ); Point from = new Point( 0, 10 ); Point mid = new Point ( 10, 300 ); Point to = new Point( 400, 100 ); // variable length arguments KeyValues values = KeyValues.createKeyValues(from, mid, to); KeyFrames frames = new KeyFrames( values ); PropertyRange boundsRange = new PropertyRange(&quot;location&quot;, frames ); TimingTarget tt = new ObjectModifier( labelPanel.getObject(), boundsRange ); TimingController controller = new TimingController( horizontalCycle, simpleEnv ); controller.addTarget( tt ); controller.start();
  25. 25. Application <ul><li>Not only for location, size, bounds </li></ul><ul><li>can apply for everywhere </li></ul><ul><li>Example 5 – Fading Animation Demo </li></ul>
  26. 26. Reference <ul><li>Timing is Everything </li></ul><ul><ul><li>http://today.java.net/pub/a/today/2005/02/15/timing.htmlhttp://today.java.net/pub/a/today/2005/02/15/timing.html </li></ul></ul><ul><li>Time Again </li></ul><ul><ul><li>http://today.java.net/pub/a/today/2006/03/16/time-again.html </li></ul></ul><ul><li>Timing Framework </li></ul><ul><ul><li>http://timingframework.dev.java.net/ </li></ul></ul><ul><li>JavaOne 2006 TS-1297 “Filthy Rich Clients: Animated Effects in Swing Applications” </li></ul>

×