Upload
rajivmordani
View
2.571
Download
0
Tags:
Embed Size (px)
Citation preview
1
JavaFX: Incorporating Media and animation
Raghavan N. SrinivasTechnology EvangelistSun Microsystems, Inc.
2
> Rags●CTO, Technology Evangelism●Developing and deploying Java apps. for a decade
(trying to anyway)●HOL track lead for JavaOne; Author of JavaFX
HOL for JavaOne 2007 and 2008
Speaker
3
Agenda• JavaFX Platform Overview• JavaFX Script Language features
> Binding> Animation> Media> JavaFX Script from Java
• Java SE 6 update 10 and Deployment basics• Tools, Summary and References
4
JavaFX Vision
JavaFX is THE platform for creating and delivering Rich Internet Applications
across all the screens of your life
JavaFX is Powered by Java
5
JavaFX roadmap
JavaFX Desktop(Fall 2008)
JavaFX Mobile(Spring 2009)
JavaFX TV(Summer 2009)
Desktop Product Line
Mobile Product Line
TV Product Line
Other Platforms With Partner platforms/OSs
6
JavaFX Script Programming Language
• Declarative, statically-typed scripting language• Facilitates rapid GUI development• Many cool, interesting language features • Runs on Virtual Machine for the Java™ platform• Deployment options same as Java programs• Fully utilizes Java class libraries behind the scenes• For content designers and Media engineers• binding – the swiss army knife
7
Timing, Jgoodies Framework
public ControlPanel(AnimationView animationView) { this.animationView = animationView; setLayout(new GridBagLayout()); intFormat = NumberFormat.getNumberInstance(); intFormat.setParseIntegerOnly(true); doubleFormat = NumberFormat.getNumberInstance(); setupCycleGUI(); setupEnvelopeGUI(); setupPropertySetterGUI(); setupAccelerationGUI(); setupActionsGUI(); // Animation View JPanel panel = new JPanel(new BorderLayout()); panel.add(animationView); ... }
8
JavaFX code : Animation for everyone elsevar t = Timeline { repeatCount: bind rep autoReverse: bind autoRevCheckBox.selected toggle: bind toggleCheckBox.selected keyFrames: [ KeyFrame { time: 0ms values: [ x => 0, y => 0] }, KeyFrame { time: 2000ms values: [ x => 200 tween interpolate, y => 200 tween interpolate] } ]};
9
How to get started: Software Requirements
• Java SE 6 Update 10 SDK• NetBeans IDE 6.1 with JavaFX Plugin OR pre-
bundled NetBeans IDE 6.1 with JavaFX• JavaFX Preview SDK (Already bundled with the
plugin)• Mozilla Firefox 3, Safari, Internet Explorer or
Google Chrome
10
NetBeans IDE 6.1
• JavaFX Plugin for NetBeans IDE 6.1 OR pre-bundled NetBeans IDE 6.1 for JavaFX> Support development cycle
●edit, compile, run, test> JavaFX project system> Includes automatic installation of JavaFX Preview SDK
11
Components – JavaFX Preview SDK
/docs
/libjavafxc.jarjavafxrt.jarjavafxgui.jar
javafx-swing.jarScenario.jar
Decora-D3D.jarDecora-HW.jar
jmc.jarjogl.jarjaxb*.jar
/samplesSmokeScreenSample
StopWatch
/binjavafxc.exejavafx.exe
12
Command Line Development• include <javafx-sdk>/bin in PATH• javafxc to compile• javafx to run• Relevant library files in <javafx-sdk>/lib are
automatically included in classpath as necessary. Rest can be included with the -classpath option> With packages
● javafxc -d . simple/Main.fx● javafx simple.Main
> Without packages● javafxc Main.fx● javafx Main
13
Agenda• JavaFX Platform Overview• JavaFX Script Language features
> Binding> Animation> Media> JavaFX Script from Java
• Java SE 6 & Deployment Basics• Summary and References
14
> Cause and Effect—Responding to change> The JavaFX Script bind operator—Allows
dynamic content to be expressed declaratively
> Dependency-based evaluation of any expression
> Automated by the system—Rather than manually wired by the programmer
> You just declare dependencies and the JavaFX runtime takes care of performing updates when things change
> Eliminates listener patterns
Binding in JavaFX Script
15
import javafx.application.*;import javafx.ext.swing.*;
Frame { var a: String = "name"; title: "Hello World" width: 400 stage: Stage { content: ComponentView { component: BorderPanel { bottom: TextField { text: bind a with inverse} top: Label { text: bind "Hello {a}" } } } } visible: true}
Example: Binding in JavaFX Script
16
More Binding Examplespublic class User { public attribute userid: String; public attribute password: String;}// Create sequencevar users = [ User {userid: "rags" password: "everest" }, User {userid: "sridhar" password: "hyderabad" }, User {userid: "inyoung" password: "korea" },];// Bind list to sequence of usersvar list = List{items: bind for (user in users) ListItem {text: bind "{user.userid}"}};
17
Agenda• JavaFX Platform Overview• JavaFX Script language features
> Binding> Animation> Media> JavaFX Script from Java
• Java SE 6 & Deployment basics• Summary and References
18
Animation - javafx.animation.*
actioncanSkiptime
timelinesvalues
KeyFrame
TimeLineautoReverseINDEFINITEkeyFramesrepeatCountrunningtoggle
InterPolator
DISCRETEEASEBOTHEASEINEASEOUTLINEAR
19
Animation• Timelines handles the animation in JavaFX • Timelines are first-class citizen in the language
along with the duration time constants (1s, 10s) • They can have one or more KeyFrames • Methods: start(), stop(), pause(), resume() • Properties: autoReverse, repeatCount, toggle • BigDeal: Timelines are nestable!
20
Animationvar t = Timeline { repeatCount: bind rep autoReverse: bind autoRevCheckBox.selected toggle: bind toggleCheckBox.selected keyFrames: [ KeyFrame { time: 0ms values: [ x => 0, y => 0] }, KeyFrame { time: 2000ms values: [ x => 200 tween interpolate, y => 200 tween interpolate] } ]};
21
The “=>” literal constructor
values: [x => 100 tween Interpolator.LINEAR]
is equivalent to values: [KeyValue {target: pX, value: 100, interpolate: Interpolator.LINEAR}]
where pX is “pointer of x” (obtained magically :-))
22
Animation Controlsvar buttons = FlowPanel { content: [ Button { text: "Start" action: function():Void { t.start(); } }, Button { text: "Stop" action: function():Void { t.stop(); } }, Button { text: "Pause" action: function():Void { t.pause(); } } ]};
23
JavaFX Animation demo
24
Agenda• JavaFX Platform Overview• JavaFX Script language features
> Binding> Animation> Media> JavaFX Script from Java
• Java SE 6 & Deployment basics• Summary and References
25
Design Goals• Media Playback is of primary importance• Simple API: only a few lines of coded needed• Cross platform A/V format required• Native support also desirable
> “Mash ups”> Viewing local media
• Zero Configuration plug in support> Drop in format support
• Going beyond rectangular video> Support lightweight rendering> Integration with Scenegraph, FXScript, and 3D APIs
26
Architectural Overview, JMC• Java Media Components
> JMediaPlayer●A JComponent that provides media playback
> JMediaPane●A JComponent that provided media playback
without UI controls> MediaProvider
●Low level media player > Media Class
●For getting information about the media– Tracks– Metadata
> Events and Exceptions
27
Code Sample: Java Playerclass MediaDemo extends JFrame {
MediaDemo() {
JmediaPlayer mediaPlayer;
try {
mediaPlayer = new JMediaPlayer(
new URI("movie.mov"));
} catch (Exception e) {
System.out.println("Error opening media" + e);
System.exit(0);
}
add(mediaPlayer);
mediaPlayer.play();
setVisible(true);
} ...
28
Media - javafx.scene.media.*
mediaautoPlayvolumeREPEAT_FOREVER
MediaPlayer
MediasourceresolutionXresoultionY
MediaViewfullScreenmediaPlayercliprotatetransformeffect
29
Media in JavaFX
• Media classes are part of javafx.scene.media package
• Media, MediaPlayer and MediaView> MediaView is a Node
●has a MediaPlayer●MediaPlayer has a Media object.
> MediaView may be rotated, translated, sheared, and have filter effects applied to it.
> Multiple views may be bound to single player.• MediaTimers allow functions to be invoked at key
points in Media.• Other media events may be triggered
30
Code Sample: JavaFX™ MediaPlayervar media = Media{source:”movie.mov”};var player = MediaPlayer{media: media, autoPlay:true};var mediaView = MediaView{mediaPlayer: player}; // To enable audio only, don't create MediaView
MediaView{mediaPlayer:player, onMouseClicked: function(e) { if (player.paused) { player.play(); } else { player.pause(); } } // Add a clip and rotate clip: c; rotate: 90;}
31
JavaFX Media demo
32
Agenda• JavaFX Platform Overview• JavaFX Script language features
> Binding> Animation> Media> JavaFX Script from Java
• Java SE 6 & Deployment basics• Tools, Summary and References
33
Code Sample: JavaFX™ from Java// evaluate the FX script
Object fxobject = scrEng.eval(script.toString()); // you could use the FXAdapter method// or use pure reflection
Method method= fxobject.getClass().getMethod("getJComponent");
JComponent component = (Jcomponent) method.invoke(fxobject); frame.add(component);
34
Agenda• JavaFX Platform Overview• JavaFX Script language features
> Binding> Animation> Media> JavaFX Script from Java
• Java SE 6 & Deployment basics• Tools, Summary and References
35
Consumer JRE
Project Hamburg
Java SE 6, Update X
Java SE 6, Update N
Java SE 6, Update 10
36
• Java Quick Starter> Faster cold starts on most systems
• Java Kernel> Shorter download + install + launch times
• Deployment Toolkit> Simplifies using Java technology in a web browser
Features
37
• “Coldstart” vs. “Warmstart”• Root problem:
> Large files + Disk access speed• Solution: QuickStarter
> Pre-warm the disk cache• Note: QuickStarter != running VM
> Smaller footprint, more targeted disk pages
Quickstarter
38
• Java's not small> J2SE 5.0: 7.1 MB> Java SE 6: 10+ MB> rt.jar: 40+ MB on disk
• Lots of bits being moved around> Download, Unzip, Unpack200, Copying
• Solution: Java Kernel> Download only core dependencies first> Launch application> Download and install in the background
Install Time
39
JRE sizes
40
Look Mom! We Shrunk the JRE
41
Architectural Overview
HTML-Webpage
Java Applet 1
Java Applet 2
Java Applet 3
42
Architectural Overview
Thin Server JVM
Fat Client JVM 1
Fat Client JVM 2OS Process 1
OS Process 2
OS Process 3
43
Applets Reloaded
• Ground-up rewrite of the Java Plug-In> Mostly in Java
• Advanced new architecture> Out-of-process execution
• Major benefits> Improved reliability> Support for larger Java heap sizes for applets> Better support for signed applets on Windows Vista> Support for per-applet JVM command-line arguments> Support for multiple simultaneous JRE versions
44
Agenda• JavaFX Platform Overview• JavaFX Script Language features
> Binding> Animation> Media> JavaFX Script from Java
• Java SE 6 & Deployment basics• Tools, Summary and References
45
Ajax and Java compared (for RIA)
Ajax
• Javascript-based• No plugins• Simple effects, transition
and windows• Does not work in
disconnected mode• Mobile phones?• Designer/Developer
delineation is blurred
• Java-based• Plugins required• Complex effects,
transition, windows• Can work in
disconnected mode• Plans for mobile phones• Designer/Developer
delineation can be clear
Java
46
JavaFX Preview SDK
• JavaFX Preview SDK since 31st July 2008 > http://openjfx.java.sun.com > http://www.javafx.com> available for Windows and MacOS
• NetBeans 6.1 IDE and JavaFX Plugin > Available now and since 31st July 2008
• Desktop SDK 1.0 later this year• Project Nile
47
Project Nile (Designer + Developer)
• Photoshop and Illustrator plugins
• FXD File Format
• FXD Viewer
• SVG Converter
• Designer / Developer Collaboration
48
JavaFX Summary
• JavaFX is a Platform for creating rich internet applications (RIA) with immersive media and content, across all the screens of your life
• JavaFX has familiarity with Java developers aimed at designers
• Easier to write UI and Graphics programs• Timelines make animations very easy• Binding and other features make it easier• Possible to use JavaFX Script in Java• Java SE 6 update 10 is the deployment platform
49
JavaFX References
• http://javafx.com/• https://openjfx.dev.java.net/• http://openjfx-compiler.dev.java.net • http://scenegraph.dev.java.net• http://java.sun.com/javafx/• http://java.sun.com/javafx/tutorials/project_nile_integrating_graphics/• http://openjfx.java.sun.com/current-build/doc/index.html • http://www.netbeans.org
50
Thank You!!
Raghavan N. SrinivasIncorporating Media and animation into JavaFX and Java