This document provides an overview of JavaFX animations. It discusses the field of animations, open source options like Blender and GIMP, and key features of JavaFX animations including extensive animation support through timelines and transitions. It provides examples of data binding and includes a short demo of animations in JavaFX.

1. Try this..

2. Anyone who has never made a mistake has never tried
anything new.
-Albert Einstein

3. Dwarakanath J
Sun Campus Ambassador
Dwarakanath.j@sun.com
Open Source Animations

4. 4
Agenda
• Field of animations
• Open Source @ Animations
• JAVAFX
• Some Eye Catchers
• Key Features
• Small Demo

5. 5
Animations
• Animation is the rapid display of a sequence of images of
2-D or 3-D artwork or model positions in order to create
an illusion of movement.
Don't get frightened!I took it from wikipedia

6. 6
World of Animations
• Adobe Flash-The leading tool
• Blender-Open Source Equvalent
• GIMP-to some extent
• JAVAFX-The new technology

7. 7
JAVA FX
• Rich Internet Applications
• Web Services
• User Friendly

8. 8
Unique Selling Points of JAVAFX
• Runs in Browser,Mobile,and at PC
• Bind Operators
• Extensive Animation Support

9. 9

10. 10
Extensive Animation Support
• Timelines handles the animation in JavaFX
• They can have one or more KeyFrames
• Animation controls
• play(), stop(), pause(), playFromStart()
• Some properties
• autoReverse, repeatCount, rate
• Timelines are nestable

11. 11
Transistions
• Predefined animations to perform a specific task
> Position, rotation, opacity, etc.
• Out of the box transitions
> RotateTranstion – rotation
> FadeTransition – opacity
> TranslateTransition – move a node along a
• straight line
> PathTransition – move an object along a defined
• path
> ScaleTranstion – grows or shrinks a node

12. 12
Bind Operators
• Direct Bind
• Reverse Bind

13. 13
Quick Look on Bind Opearator

14. 14
Example of Data Binding
• Binding variables
var r = 10;
var a = bind r;
r = 5;
FX.println(“a = {a}”); //Displays 5
• Binding object literal
var radius = 10;
def circle = bind Circle {
centerX: 100 centerY: 100
radius: radius //FX can figure this out!
fill: Color.RED
}
radius = 100; //circle's radius is now 100

15. 15
Demo Time!

16. 16
Spot the Difference

17. 17
Spot The Difference
• RIA Vs Desktop Applications
• Server Vs Software
• Bind Vs Reverse Bind

18. 18
New Feautures in JavaFX 1.2
• Persistence API's
• Web services Support for SOAP
• Increased support with Zembly

19. 19
Thank You/Questions
• Dwarakanath J
• Dwarakanath.J@sun.com
• http://blogs.sun.com/dwarak
• +91 9884799523