Creating Dynamic Thin-Client User-Interfaces with Flash and Java Brad Neuberg, bneuberg@randomwalk.com
The Problem & Motivation <ul><li>The Problem:  Find a new rendering engine for Java. </li></ul><ul><li>Motivation:  Java i...
Problems with Java’s Current Rendering Engine (JRE 1.2.2) <ul><li>Large (many megabytes) </li></ul><ul><li>Slow </li></ul>...
Requirements for a New Rendering Engine <ul><li>Must be cross-platform </li></ul><ul><li>Must be very fast </li></ul><ul><...
The “New Way” to Create User-Interfaces <ul><li>First appeared with HTML, similar to Model-View-Controller </li></ul><ul><...
The “New Way” to Create User-Interfaces (Continued) <ul><li>Example: JSP file has UI which “calls” JavaBeans for behavior....
Advantages of this New Model <ul><li>Can offer great productivity </li></ul><ul><li>Creates much better-looking UIs </li><...
Candidates for the New Rendering Engine <ul><li>DHTML + JavaScript </li></ul><ul><ul><li>DHTML totally incompatible across...
Candidates for the New Rendering Engine (Continued) <ul><li>DHTML + Java through IBM’s DirectDom (formally Weblets) Toolki...
Candidates for the New Rendering Engine (Continued) <ul><li>Servlet/JSP generated HTML </li></ul><ul><ul><li>No downloads ...
Candidates for the New Rendering Engine (Continued) <ul><li>Mozilla </li></ul><ul><ul><li>XUL (eXtensible UI Language) all...
Candidates for the New Rendering Engine (Continued) <ul><li>SVG (Scalable Vector Graphics) through Adobe’s Plugin controll...
Candidates for the New Rendering Engine (Continued) <ul><li>JRE 1.3 </li></ul><ul><ul><li>Much faster than previous JREs, ...
Candidates for the New Rendering Engine (Continued) <ul><li>Flash 4 Plugin + Java 1.1 Native Browser VM </li></ul><ul><ul>...
Candidates for the New Rendering Engine (Continued) <ul><li>Flash 4 Plugin + Java 1.1 Native Browser VM (Continued) </li><...
What is Flash? <ul><li>Binary vector based format that supports animation, interactivity, and text-rendering </li></ul><ul...
Flash Examples <ul><li>Eye4U  (shows speed) </li></ul><ul><li>Balthaser  (shows text-effects and UI widgets) </li></ul><ul...
Flash  (advanced rendering) + Java  (advanced networking and programming) = Killer cross-platform solution
Flash/Java Integration <ul><li>Allow Java to call methods on Flash Plugin (Done) </li></ul><ul><li>Allow Flash to call Jav...
Allow Java to Call Methods on Flash Plugin <ul><li>The Flash Plugin exposes several methods to JavaScript </li></ul><ul><u...
Allow Java to Call Methods on Flash Plugin (Continued) <ul><li>Made JavaScript and Java wrapper around plugin, using LiveC...
Allow Java to Call Methods on Flash Plugin (Continued) <ul><li>Example use of FlashPlugin class: </li></ul><ul><li>import ...
Allow Flash to call Java methods and create new Java instances <ul><li>Flash has a light-weight scripting language called ...
Allow Flash to call Java methods and Create New Java Instances (Continued) <ul><li>Created reflective Java and JavaScript ...
Allow Flash to Call Java Methods and Create New Java Instances (Continued) <ul><li>Creating Java Object from Flash: </li><...
Allow Flash to Call Java Methods and Create New Java Instances (Continued) <ul><li>Calling Java Methods from Flash </li></...
Give the Illusion that Objects in Flash are Actually Java Objects <ul><li>Will allow one to define a Java interface: </li>...
Give the Illusion that Objects in Flash are Actually Java Objects (Continued) <ul><li>This will generate a Flash file, tha...
Give the Illusion that Objects in Flash are Actually Java Objects (Continued) <ul><li>The Java will have no clue that it i...
The Future <ul><li>As Java 2D speed increases, the Flash engine can be written in Java </li></ul><ul><li>An open-source Ja...
Upcoming SlideShare
Loading in …5
×

Creating Dynamic Thin-Client User-Interfaces with Flash and Java

568 views

Published on

0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
568
On SlideShare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
3
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Creating Dynamic Thin-Client User-Interfaces with Flash and Java

  1. 1. Creating Dynamic Thin-Client User-Interfaces with Flash and Java Brad Neuberg, bneuberg@randomwalk.com
  2. 2. The Problem & Motivation <ul><li>The Problem: Find a new rendering engine for Java. </li></ul><ul><li>Motivation: Java is a fabulous networking language and “model” language, but is a lousy “display” language. </li></ul>
  3. 3. Problems with Java’s Current Rendering Engine (JRE 1.2.2) <ul><li>Large (many megabytes) </li></ul><ul><li>Slow </li></ul><ul><li>Not truly cross-platform (disparate support across platforms) </li></ul><ul><li>No installed base (Sun has been terrible with bundling deals </li></ul>
  4. 4. Requirements for a New Rendering Engine <ul><li>Must be cross-platform </li></ul><ul><li>Must be very fast </li></ul><ul><li>Must be small </li></ul><ul><li>Can be integrated well with Java </li></ul><ul><li>Supports the “new way” of creating UIs </li></ul><ul><li>Creates good looking, dynamic UIs </li></ul><ul><li>Easy to work with </li></ul>
  5. 5. The “New Way” to Create User-Interfaces <ul><li>First appeared with HTML, similar to Model-View-Controller </li></ul><ul><li>User-interface is completely “unhooked” from behavior of program </li></ul><ul><li>Designer draws and creates user-interface using some tools (Dreamweaver, Director, etc.) </li></ul><ul><li>Program “hooks onto” UI to control it </li></ul>
  6. 6. The “New Way” to Create User-Interfaces (Continued) <ul><li>Example: JSP file has UI which “calls” JavaBeans for behavior. </li></ul>
  7. 7. Advantages of this New Model <ul><li>Can offer great productivity </li></ul><ul><li>Creates much better-looking UIs </li></ul><ul><li>Offers greater flexibility to evolve UIs </li></ul><ul><li>No throwaway prototype UI </li></ul>
  8. 8. Candidates for the New Rendering Engine <ul><li>DHTML + JavaScript </li></ul><ul><ul><li>DHTML totally incompatible across browsers </li></ul></ul><ul><ul><li>Even IE for Mac and IE for Windows have different programming models </li></ul></ul><ul><ul><li>Slow </li></ul></ul><ul><ul><li>JavaScript is terrible for large-scale engineering </li></ul></ul><ul><ul><li>JavaScript also has few good built-in libraries </li></ul></ul>
  9. 9. Candidates for the New Rendering Engine (Continued) <ul><li>DHTML + Java through IBM’s DirectDom (formally Weblets) Toolkit </li></ul><ul><ul><li>Allows Java to control browser HTML elements </li></ul></ul><ul><ul><li>Promising, but still at alpha-level </li></ul></ul><ul><ul><li>Large download (~1.5 megs) </li></ul></ul>
  10. 10. Candidates for the New Rendering Engine (Continued) <ul><li>Servlet/JSP generated HTML </li></ul><ul><ul><li>No downloads </li></ul></ul><ul><ul><li>Slow trips back to server </li></ul></ul><ul><ul><li>Limited user-interface ability </li></ul></ul>
  11. 11. Candidates for the New Rendering Engine (Continued) <ul><li>Mozilla </li></ul><ul><ul><li>XUL (eXtensible UI Language) allows for UIs that are controlled by Java </li></ul></ul><ul><ul><li>Very cross-platform (available for Linux, Windows, Mac, Solaris, HP-UX, BeOS, etc.) </li></ul></ul><ul><ul><li>Still unstable and alpha-level </li></ul></ul><ul><ul><li>Large Download (~2 - ~15 megs, depending on number of components) </li></ul></ul><ul><ul><li>Sluggish </li></ul></ul><ul><ul><li>Promising, but not mature yet </li></ul></ul>
  12. 12. Candidates for the New Rendering Engine (Continued) <ul><li>SVG (Scalable Vector Graphics) through Adobe’s Plugin controlled by DirectDom </li></ul><ul><ul><li>Wonderful, easy programming model </li></ul></ul><ul><ul><li>SVG is a standard </li></ul></ul><ul><ul><li>Standard is still immature, though </li></ul></ul><ul><ul><li>Viewers are slow </li></ul></ul><ul><ul><li>Large download – SVG plugin (~3 megs) + DirectDom (~1.5 megs) </li></ul></ul><ul><ul><li>Both SVG plugin & Direct Dom are alpha-level </li></ul></ul><ul><ul><li>No tool support to create SVG files </li></ul></ul>
  13. 13. Candidates for the New Rendering Engine (Continued) <ul><li>JRE 1.3 </li></ul><ul><ul><li>Much faster than previous JREs, but still not fast enough </li></ul></ul><ul><ul><li>Swing is now truly mature with JRE 1.3 </li></ul></ul><ul><ul><li>Large download (~5 megs) </li></ul></ul><ul><ul><li>Still beta </li></ul></ul><ul><ul><li>Major memory requirements for Swing apps </li></ul></ul>
  14. 14. Candidates for the New Rendering Engine (Continued) <ul><li>Flash 4 Plugin + Java 1.1 Native Browser VM </li></ul><ul><ul><li>Flash plugin very ubiquitous (on about ~85% of browsers) </li></ul></ul><ul><ul><li>Flash plugin is extremely small download (~150K) </li></ul></ul><ul><ul><li>Flash is extremely cross-platform (Flash 4 plugin available for Windows 95/98/NT, Mac, Solaris, Linux, and Irix) </li></ul></ul><ul><ul><li>Flash is very fast </li></ul></ul>
  15. 15. Candidates for the New Rendering Engine (Continued) <ul><li>Flash 4 Plugin + Java 1.1 Native Browser VM (Continued) </li></ul><ul><ul><li>Flash has advanced rendering engine (anti-aliased text, cross-platform fonts, alpha-channel/transparency, text-fields, sprites, tweening, etc.) </li></ul></ul><ul><ul><li>Flash has very small compressed files </li></ul></ul><ul><ul><li>Easy to create using Macromedia Flash Authoring application </li></ul></ul><ul><ul><li>Flash is well-known to designers </li></ul></ul>
  16. 16. What is Flash? <ul><li>Binary vector based format that supports animation, interactivity, and text-rendering </li></ul><ul><li>Created with an authoring tool named Flash </li></ul><ul><li>Vector format offers small, fast downloads, screen-size independence, easy conversion to print-format, and animation </li></ul>
  17. 17. Flash Examples <ul><li>Eye4U (shows speed) </li></ul><ul><li>Balthaser (shows text-effects and UI widgets) </li></ul><ul><li>Yugop Scrolling UI (shows UI widgets) </li></ul><ul><li>FlashZone Action Demo (shows UI widgets) </li></ul><ul><li>Romeo Design (shows multimedia) </li></ul>
  18. 18. Flash (advanced rendering) + Java (advanced networking and programming) = Killer cross-platform solution
  19. 19. Flash/Java Integration <ul><li>Allow Java to call methods on Flash Plugin (Done) </li></ul><ul><li>Allow Flash to call Java methods and create new Java instances (80% Done) </li></ul><ul><li>Build on (1) to give the illusion that objects in Flash are actually Java objects (TBD) </li></ul>
  20. 20. Allow Java to Call Methods on Flash Plugin <ul><li>The Flash Plugin exposes several methods to JavaScript </li></ul><ul><ul><li>Play() </li></ul></ul><ul><ul><li>GetVariable(varName) </li></ul></ul><ul><ul><li>GotoFrame(frameNumber) </li></ul></ul><ul><ul><li>Etc. </li></ul></ul>
  21. 21. Allow Java to Call Methods on Flash Plugin (Continued) <ul><li>Made JavaScript and Java wrapper around plugin, using LiveConnect </li></ul><ul><li>LiveConnect allows JavaScript to call Java, and vice-versa </li></ul><ul><li>Most people assume it’s only supported in Netscape, but it is also completely compatible with IE </li></ul>
  22. 22. Allow Java to Call Methods on Flash Plugin (Continued) <ul><li>Example use of FlashPlugin class: </li></ul><ul><li>import org.twoofdiscs.flash.FlashPlugin; </li></ul><ul><li>import org.twoofdiscs.flash.MainController; </li></ul><ul><li>public class AddressBook { </li></ul><ul><li>public void displayAddressBook() { </li></ul><ul><li>// get FlashPlugin </li></ul><ul><li>FlashPlugin plugin = MainController.getFlashPlugin(); </li></ul><ul><li>plugin.TCallLabel(&quot;/&quot;, &quot;DISPLAY_ADDRESSBOOK&quot;); </li></ul><ul><li>} </li></ul><ul><li>} </li></ul>
  23. 23. Allow Flash to call Java methods and create new Java instances <ul><li>Flash has a light-weight scripting language called ActionScript </li></ul><ul><li>ActionScript has a command call FSCommand(String command, String arguments) </li></ul><ul><li>This command can be used to call external JavaScript functions </li></ul>
  24. 24. Allow Flash to call Java methods and Create New Java Instances (Continued) <ul><li>Created reflective Java and JavaScript glue to let Flash FSCommands call Java methods and create Java objects </li></ul>
  25. 25. Allow Flash to Call Java Methods and Create New Java Instances (Continued) <ul><li>Creating Java Object from Flash: </li></ul><ul><ul><li>FSCommand(‘org.twoofdiscs.demo.AddressBook myAddressBook = new org.twoofdiscs.demo.AddressBook(“Brad Neuberg”)’) </li></ul></ul><ul><li>org.twoofdiscs.demo.AddressBook myAddressBook = new org.twoofdiscs.demo.AddressBook(“Brad Neuberg”) - Java object to create </li></ul>
  26. 26. Allow Flash to Call Java Methods and Create New Java Instances (Continued) <ul><li>Calling Java Methods from Flash </li></ul><ul><ul><li>FSCommand(‘myAddressBook.getContacts()’, ‘/someTarget:var1, true, /, RETURN_RESULT_READY’ </li></ul></ul><ul><ul><li>Stop </li></ul></ul><ul><li>FSCommand(‘myAddressBook.getContacts()’ – Gives instance name of previously created Java object and method to run </li></ul><ul><li>/someTarget:var1, true, /, RETURN_RESULT_READY - Specifies name of Flash variable to put results into, whether the results are an array, and the movie target and label to restart at </li></ul>
  27. 27. Give the Illusion that Objects in Flash are Actually Java Objects <ul><li>Will allow one to define a Java interface: </li></ul><ul><li>public interface BankSummary { </li></ul><ul><li>public int getUsersChoice(); </li></ul><ul><li>public void resetColumns(); </li></ul><ul><li>} </li></ul><ul><li>Then, a Flash compiler will be run: </li></ul><ul><ul><li>java org.twoofdiscs.flash.callingflash.FlashCompile BankSummary </li></ul></ul>
  28. 28. Give the Illusion that Objects in Flash are Actually Java Objects (Continued) <ul><li>This will generate a Flash file, that can be imported into a Flash movie </li></ul><ul><li>This Flash movie will now appear to have an object named BankSummary that can be created, cloned, and have methods called on just like an ordinary Java object. </li></ul>
  29. 29. Give the Illusion that Objects in Flash are Actually Java Objects (Continued) <ul><li>The Java will have no clue that it is talking to Flash </li></ul><ul><li>Similar to CORBA proxies </li></ul>
  30. 30. The Future <ul><li>As Java 2D speed increases, the Flash engine can be written in Java </li></ul><ul><li>An open-source Java Flash engine is already available </li></ul><ul><li>Everything will be able to remain the same </li></ul><ul><li>Will make it possible to embed Swing components into the GUI where appropriate </li></ul>

×