Moving To The Client - JavaFX and HTML5


Published on

Presentation on Jav

Published in: Technology, Design
1 Like
  • Be the first to comment

No Downloads
Total views
On SlideShare
From Embeds
Number of Embeds
Embeds 0
No embeds

No notes for slide

Moving To The Client - JavaFX and HTML5

  1. 1. Moving to the Client - JavaFX and HTML5<br />Stephen Chin<br />Chief Agile Methodologist, GXS<br /><br />tweet: @steveonjava<br />Kevin Nilson<br />VP of Engineering, Just.Me<br /><br />tweet: @javaclimber<br />
  2. 2. About the Presenters<br />Stephen Chin<br />Kevin Nilson<br />Java Champion<br />Java Champion<br />Chief Agile Methodologist, GXS<br />Author Web 2.0 Fundamentals<br />Author, Pro JavaFX Platform<br />User Groups Leader<br />Silicon Valley Web JUG<br />Silicon Valley JS Meetup<br />Silicon Valley Google Technology UG<br />
  3. 3.
  4. 4. History of the Web<br />1991 HTML<br />1994 HTML 2<br />1996 CSS 1 + JavaScript<br />1997 HTML 4<br />1998 CSS 2<br />2000 XHTML 1<br />2002Tableless Web Design<br />2005AJAX<br />2009HTML 5<br />
  5. 5. What is HTML5<br />Web Hypertext Application Technology Working Group (WHATWG)<br />HTML5 != HTML + CSS + JavaScript<br />HTML5 = Next Generation Features for Modern Web Development<br />Offline Storage, Web SQL Database, IndexedDB, Application Cache, Web Workers, WebSocket, Notifications, Native Drag & Drop, File System, GeoLocation, Speech Input, Form Types, Audio, Video, Canvas, SVG<br />
  6. 6. HTML5 Rounded Corners<br /><br />HTML5<br />No HTML5<br />
  7. 7. HTML5 Canvas 3D (WebGL)<br /><br />
  8. 8. Prefixes<br />-webkit-text-fill-color: black;<br />-webkit-column-count: 2;<br />Before the Spec is final<br />Before the Browser implementation is Verified<br />
  9. 9. Cross Browser<br />Browsers behave fairly differently<br />HTML5 Non-Ambiguous Spec<br />JavaScript Frameworks (jQuery, Dojo, YUI) give consistent API<br />
  10. 10. Acid Test<br /><br />
  11. 11. jQuery On The Rise<br />49.58% of Top 10,000 sites use jQuery (<br />
  12. 12. jQuery<br />12<br /><br />
  13. 13. Reaching Older Browsers<br />Chrome Frame<br />IE6, IE7, IE8 running Chrome<br />Modernizer<br />Feature detection rather than User Agent Sniffing<br />
  14. 14. JavaFX and the Java Platform <br />Java Language<br />Java EE<br />HotSpot Java VM<br />Lightweight Java VM<br />Java SE<br />Java ME<br />Java Card<br />Java FX<br />MSA<br />Java TV<br />APIs<br />Copyright 2010 Oracle<br />
  15. 15. JavaFX 2.0 Platform<br />Immersive Desktop Experience Combining the Best of JavaFX and HTML5<br />Leverage your Java skills with modern JavaFX APIs<br />Integrate Java, JavaScript, and HTML5 in the same application<br />New graphics stack takes advantage of hardware acceleration for 2D and 3D applications<br />User your favorite IDE: NetBeans, Eclipse, IntelliJ, etc.<br />
  16. 16. iPhone UIWebView<br />Formatting Text<br />Indalo is an iPhone App Kevin Helped Write<br />
  17. 17. Titanium<br />Write JavaScript, but Renders Native Application<br />Many “Native” widgets are UIWebView<br />E*Trade API Contest App Kevin Wrote<br />
  18. 18. Displaying HTML in JavaFX<br />public class WebViewTest extends Application {<br /> public static void main(String[] args) {<br />launch(WebViewTest.class, args);<br />}<br /> @Override public void start(Stage stage) {<br />WebViewwebView = new WebView();<br />webView.getEngine().load("");<br />Scene scene = new Scene(webView);<br />stage.setScene(scene);<br />stage.setTitle("Web Test");<br />;<br />}}<br />18<br />
  19. 19. Displaying HTML in JavaFX<br />19<br />
  20. 20. Calling Javascript from JavaFX<br />String script = "alert('We've got a message, Houston!');”;<br />eng.executeScript(script);<br />20<br />
  21. 21. Responding to Browser Events<br />Supported Events:<br />Alert/Confirm/Prompt:<br />Respond to JavaScript user interaction functions<br />Resize:<br />Web page moves or resizes the window object<br />Status<br />Web page changes the status text<br />Visibility<br />Hide or show the window object<br />Popup<br />Spawn a second web view/engine<br />21<br />
  22. 22. HTML5/JavaFX Integration Demo<br />22<br />
  23. 23. Pro JavaFX 2 Platform Coming Soon!<br />Coming 4th quarter this year<br />All examples rewritten in Java<br />Covers new controls including:<br />WebPane<br />TableView<br />TreeView<br />Etc.<br />Content on ScalaFX/GroovyFX/Visage<br />big announcement - come to my Wednesday session<br />23<br />
  24. 24. 24<br />Stephen Chin<br /><br />tweet: @steveonjava<br />Kevin Nilson<br /><br />tweet: @javaclimber<br />