Your SlideShare is downloading. ×
0
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
JavaFX 2.0 and Alternative Languages
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

JavaFX 2.0 and Alternative Languages

11,760

Published on

Presentation on JavaFX 2.0 and development with alternative languages given to the Chennai Java User Group in India.

Presentation on JavaFX 2.0 and development with alternative languages given to the Chennai Java User Group in India.

Published in: Education, Technology
1 Comment
6 Likes
Statistics
Notes
No Downloads
Views
Total Views
11,760
On Slideshare
0
From Embeds
0
Number of Embeds
7
Actions
Shares
0
Downloads
109
Comments
1
Likes
6
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide
  • There are two kinds of listener: ‘changedListener’ and ‘ChangingListener’. Being informed of the change before it happens allow for it to be vetoed.It is also possible to either watch a single property, or all properties belonging to a bean.Note that the value passed to the callback is the old value. This is to ensure that we aren’t eagerly computing the new value when it might not be required. To get the new value, you can call the function on the bean or via the propertyReference
  • There are two kinds of listener: ‘changedListener’ and ‘ChangingListener’. Being informed of the change before it happens allow for it to be vetoed.It is also possible to either watch a single property, or all properties belonging to a bean.Note that the value passed to the callback is the old value. This is to ensure that we aren’t eagerly computing the new value when it might not be required. To get the new value, you can call the function on the bean or via the propertyReference
  • There are two kinds of listener: ‘changedListener’ and ‘ChangingListener’. Being informed of the change before it happens allow for it to be vetoed.It is also possible to either watch a single property, or all properties belonging to a bean.Note that the value passed to the callback is the old value. This is to ensure that we aren’t eagerly computing the new value when it might not be required. To get the new value, you can call the function on the bean or via the propertyReference
  • There are two kinds of listener: ‘changedListener’ and ‘ChangingListener’. Being informed of the change before it happens allow for it to be vetoed.It is also possible to either watch a single property, or all properties belonging to a bean.Note that the value passed to the callback is the old value. This is to ensure that we aren’t eagerly computing the new value when it might not be required. To get the new value, you can call the function on the bean or via the propertyReference
  • There are two kinds of listener: ‘changedListener’ and ‘ChangingListener’. Being informed of the change before it happens allow for it to be vetoed.It is also possible to either watch a single property, or all properties belonging to a bean.Note that the value passed to the callback is the old value. This is to ensure that we aren’t eagerly computing the new value when it might not be required. To get the new value, you can call the function on the bean or via the propertyReference
  • There are two kinds of listener: ‘changedListener’ and ‘ChangingListener’. Being informed of the change before it happens allow for it to be vetoed.It is also possible to either watch a single property, or all properties belonging to a bean.Note that the value passed to the callback is the old value. This is to ensure that we aren’t eagerly computing the new value when it might not be required. To get the new value, you can call the function on the bean or via the propertyReference
  • There are two kinds of listener: ‘changedListener’ and ‘ChangingListener’. Being informed of the change before it happens allow for it to be vetoed.It is also possible to either watch a single property, or all properties belonging to a bean.Note that the value passed to the callback is the old value. This is to ensure that we aren’t eagerly computing the new value when it might not be required. To get the new value, you can call the function on the bean or via the propertyReference
  • Slight conversion to Groovy. This can be compiled by the Groovy compiler and run, but basically there is only one line difference (the ‘static void main’ line)
  • This is the same code as the previous slide, taking advantage of some of the Groovy syntax tricks. This is getting to look a lot more like JavaFX Script.
  • This DSL handles running on the EDT, and can actually be run as-is – there is no need for a class declaration, or anything else to ensure that we’re on the EDT. This is getting us fairly close to the simple JavaFX Script at the beginning
  • This DSL handles running on the EDT, and can actually be run as-is – there is no need for a class declaration, or anything else to ensure that we’re on the EDT. This is getting us fairly close to the simple JavaFX Script at the beginning
  • Transcript

    • 1. JavaFX 2.0 and Alternative Languages
      Stephen Chin
      Chief Agile Methodologist, GXS
      steveonjava@gmail.com
      tweet: @steveonjava
    • 2. About the Presenter
      Stephen Chin
      Java Champion
      Family Man
      Chief Agile Methodologist, GXS
      Author, Pro JavaFX Platform
      Motorcyclist
    • 3. Disclaimer: This is code-heavy
      THE FOLLOWING IS INTENDED TO STIMULATE CREATIVE USE OF JVM LANGUAGES. AFTER WATCHING THIS PRESENTATION YOU MAY FEEL COMPELLED TO START LEARNING A NEW JVM LANGUAGE AND WANT TO APPLY IT AT YOUR WORKPLACE. THE PRESENTERS ARE NOT LIABLE FOR ANY INNOVATION, BREAKTHROUGHS, OR NP-COMPLETE SOLUTIONS THAT MAY RESULT.
    • 4. Agenda
      JavaFX 2.0 Platform
      JavaFX in Java
      Explore Alternative Languages
    • 5. JavaFX and the Java Platform
      Java Language
      Java EE
      HotSpot Java VM
      Lightweight Java VM
      Java SE
      Java TV & Java ME
      Java Card
      Java FX
      APIs
      Copyright 2010 Oracle
    • 6. JavaFX Design Goals
      Deliver the Best HTML5 & Native Application Experience from Java
      Programming model: the power of Java, the ease of JavaFX
      Native interoperability between Java, JavaScript & HTML5
      High performance 2D and 3D Java graphics engine designed to exploit hardware advances in desktop & mobile
      Complete & integrated development lifecycle experience
      Copyright 2010 Oracle
    • 7. Programming Languages
      JavaFX 2.0 APIs are now in Java
      Pure Java APIs for all of JavaFX
      Expose JavaFX Binding, Sequences as Java APIs
      Embrace all JVM languages
      JRuby, Clojure, Groovy, Scala
      Fantom, Mira, Jython, etc.
      JavaFX Script is no longer supported by Oracle
      Existing JavaFX Script based applications will continue to run
      Visage is the open-source successor to the JavaFX Script language
      Copyright 2010 Oracle
    • 8. JavaFX 2.0 Product Timeline
      CYQ1 2011
      CYQ3 2011
      CYQ2 2011
      JavaFX 2.0 EA
      (Early Access)
      JavaFX 2.0 Beta
      JavaFX 2.0 GA
      (General Availability)
      Copyright 2010 Oracle
    • 9. JavaFX With Java
    • 10. JavaFX in Java
      JavaFX API follows JavaBeans approach
      Similar in feel to other UI toolkits (Swing, etc)
      Uses builder pattern to minimize boilerplate
    • 11. Binding
      Unquestionably the biggest JavaFX Script innovation
      Supported via a PropertyBinding class
      Lazy invocation for high performance
      Static construction syntax for simple cases
      e.g.: bindTo(<property>)
    • 12. Observable Pseudo-Properties
      Supports watching for changes to properties
      Implemented via anonymous inner classes
      Will take advantage of closures in the future
    • 13. Observable Pseudo-Properties
      Rectangle rect = new Rectangle();
      rect.setX(40);
      rect.setY(40);
      rect.setWidth(100);
      rect.setHeight(200);
      rect.addChangeListener(Rectangle.HOVER, new ChangeListener() {
      });
    • 14. Observable Pseudo-Properties
      Rectangle rect = new Rectangle();
      rect.setX(40);
      rect.setY(40);
      rect.setWidth(100);
      rect.setHeight(200);
      rect.addChangeListener(Rectangle.HOVER, new ChangeListener() {
      });
      The property we want to watch
    • 15. Observable Pseudo-Properties
      Rectangle rect = new Rectangle();
      rect.setX(40);
      rect.setY(40);
      rect.setWidth(100);
      rect.setHeight(200);
      rect.addChangeListener(Rectangle.HOVER, new ChangeListener() {
      });
      Only one listener used regardless of data type
    • 16. Observable Pseudo-Properties
      Rectangle rect = new Rectangle();
      rect.setX(40);
      rect.setY(40);
      rect.setWidth(100);
      rect.setHeight(200);
      rect.addChangeListener(Rectangle.HOVER, new ChangeListener() {
      public void handle(Bean bean, PropertyReference pr) {
      }
      });
      Rectangle is a Bean
    • 17. Observable Pseudo-Properties
      Rectangle rect = new Rectangle();
      rect.setX(40);
      rect.setY(40);
      rect.setWidth(100);
      rect.setHeight(200);
      rect.addChangeListener(Rectangle.HOVER, new ChangeListener() {
      public void handle(Bean bean, PropertyReference pr) {
      }
      });
      Refers to the Rectangle.hover ‘property’
    • 18. Observable Pseudo-Properties
      Rectangle rect = new Rectangle();
      rect.setX(40);
      rect.setY(40);
      rect.setWidth(100);
      rect.setHeight(200);
      rect.addChangeListener(Rectangle.HOVER, new ChangeListener() {
      public void handle(Bean bean, PropertyReference pr) {
      rect.setFill(rect.isHover() ? Color.GREEN : Color.RED);
      }
      });
    • 19. Sequences in Java
      Replaced with an Observable List
      Public API is based on JavaFX sequences
      Internal code can use lighter collections API
      JavaFX 2.0 will also have an Observable Map
    • 20. Example Application
      public class HelloStage extends Application {
      @Override public void start() {
      Stage stage = new Stage();
      stage.setTitle("Hello Stage");
      stage.setWidth(600);
      stage.setHeight(450);
      Group root = new Group();
      Scene scene = new Scene(root);
      scene.setFill(Color.LIGHTGREEN);
      stage.setScene(scene);
      stage.setVisible(true);
      }
      public static void main(String[] args) {
      Launcher.launch(HelloStage.class, args);
      }
      }
    • 21. JavaFX With JRuby
    • 22. Why JRuby?
      • Direct access to Java APIs
      • 23. Dynamic Typing
      • 24. Closures
      • 25. ‘Closure conversion’ for interfaces
    • Java in JRuby - Accessing Properties
      timeline.setAutoReverse(true)
      timeline.autoReverse = true
      timeline.auto_reverse = true
      timeline.getKeyFrames().add(kf)
      timeline.key_frames.add(kf)
      timeline.key_frames.addkf
    • 26. JRuby Example 1: Simple Stage
      require 'java'
      FX = Java::javafx.lang.FX
      Stage = Java::javafx.stage.Stage
      Scene = Java::javafx.scene.Scene
      Color = Java::javafx.scene.paint.Color
      class HelloStage
      include java.lang.Runnable
      def run
      .....
      end
      end
      FX.start(HelloStage.new);
      stage = Stage.new
      stage.title = 'Hello Stage (JRuby)'
      stage.width = 600
      stage.height = 450
      scene = Scene.new
      scene.fill = Color::LIGHTGREEN
      stage.scene = scene
      stage.visible = true;
    • 27. JRuby Example 2
      rect = Rectangle.new
      rect.x = 25
      rect.y = 40
      rect.width = 100
      rect.height = 50
      rect.fill = Color::RED
      scene.content.add(rect)
      timeline = Timeline.new
      timeline.repeat_count= Timeline::INDEFINITE
      timeline.auto_reverse = true
      kv = KeyValue.new(rect, Rectangle::X, 200);
      kf = KeyFrame.new(Duration.valueOf(500), kv);
      timeline.key_frames.addkf;
      timeline.play();
    • 28. JRuby Closure Conversion
      rect.add_change_listener(Rectangle::HOVER) do |bean, pr, bln|
      rect.fill = rect.hover ? Color::GREEN : Color::RED;
      end
      26
    • 29. JRubySwiby
      require 'swiby'
      class HelloWorldModel
      attr_accessor :saying
      end
      model = HelloWorldModel.new
      model.saying = "Hello World"
      Frame {
      title "Hello World“
      width 200
      content {
      Label {
      text bind(model,:saying)
      }
      }
      visible true
      }
      27
    • 30. 28
      JavaFX With Clojure
      Artwork by Augusto Sellhorn
      http://sellmic.com/
    • 31. A Little About Clojure
      Started in 2007 by Rich Hickey
      Functional Programming Language
      Derived from LISP
      Optimized for High Concurrency
      … and looks nothing like Java!
      29
      (def hello (fn [] "Hello world"))
      (hello)
    • 32. Clojure Syntax in One Slide
      Symbols
      numbers – 2.178
      ratios – 355/113
      strings – “clojure”, “rocks”
      characters – a b c d
      symbols – a b c d
      keywords – :alpha :beta
      boolean – true, false
      null - nil
      Collections
      (commas optional)
      Lists
      (1, 2, 3, 4, 5)
      Vectors
      [1, 2, 3, 4, 5]
      Maps
      {:a 1, :b 2, :c 3, :d 4}
      Sets
      #{:a :b :c :d :e}
      30
      (plus macros that are syntactic sugar wrapping the above)
    • 33. Clojure GUI Example
      (defnjavafxapp []
      (let [stage (Stage. "JavaFX Stage")
      scene (Scene.)]
      (.setFill scene Color/LIGHTGREEN)
      (.setWidth stage 600)
      (.setHeight stage 450)
      (.setScene stage scene)
      (.setVisible stage true)))
      (javafxapp)
      31
    • 34. Clojure GUI Example
      (defnjavafxapp[]
      (let [stage (Stage. "JavaFX Stage")
      scene (Scene.)]
      (.setFill scene Color/LIGHTGREEN)
      (.setWidth stage 600)
      (.setHeight stage 450)
      (.setScene stage scene)
      (.setVisible stage true)))
      (javafxapp)
      32
      Create a Function for the Application
    • 35. Clojure GUI Example
      (defnjavafxapp []
      (let [stage (Stage. "JavaFX Stage")
      scene (Scene.)]
      (.setFill scene Color/LIGHTGREEN)
      (.setWidth stage 600)
      (.setHeight stage 450)
      (.setScene stage scene)
      (.setVisible stage true)))
      (javafxapp)
      33
      Initialize the Stage and Scene Variables
    • 36. Clojure GUI Example
      (defnjavafxapp []
      (let [stage (Stage. "JavaFX Stage")
      scene (Scene.)]
      (.setFill scene Color/LIGHTGREEN)
      (.setWidth stage 600)
      (.setHeight stage 450)
      (.setScene stage scene)
      (.setVisible stage true)))
      (javafxapp)
      34
      Call Setter Methods on Scene and Stage
    • 37. Clojure GUI Example
      (defnjavafxapp []
      (let [stage (Stage. "JavaFX Stage")
      scene (Scene.)]
      (.setFillscene Color/LIGHTGREEN)
      (.setWidthstage 600)
      (.setHeightstage 450)
      (.setScenestage scene)
      (.setVisiblestage true)))
      (javafxapp)
      35
      Java Constant Syntax
      Java Method Syntax
    • 38. Simpler Code Using doto
      (defnjavafxapp []
      (let [stage (Stage. "JavaFX Stage")
      scene (Scene.)]
      (doto scene
      (.setFillColor/LIGHTGREEN))
      (doto stage
      (.setWidth600)
      (.setHeight450)
      (.setScene scene)
      (.setVisibletrue))))
      (javafxapp)
      36
    • 39. Simpler Code Using doto
      (defnjavafxapp []
      (let [stage (Stage. "JavaFX Stage")
      scene (Scene.)]
      (doto scene
      (.setFillColor/LIGHTGREEN))
      (doto stage
      (.setWidth 600)
      (.setHeight 450)
      (.setScene scene)
      (.setVisible true))))
      (javafxapp)
      37
      doto form:
      (doto symbol
      (.method params))
      equals:
      (.method symbol params)
    • 40. Refined Clojure GUI Example
      (defnjavafxapp []
      (doto (Stage. "JavaFX Stage")
      (.setWidth600)
      (.setHeight450)
      (.setScene (doto (Scene.)
      (.setFillColor/LIGHTGREEN)
      (.setContent (list (doto (Rectangle.)
      (.setX25)
      (.setY40)
      (.setWidth100)
      (.setHeight50)
      (.setFillColor/RED))))))
      (.setVisibletrue)))
      (javafxapp)
      38
    • 41. Refined Clojure GUI Example
      (defnjavafxapp []
      (doto(Stage. "JavaFX Stage")
      (.setWidth 600)
      (.setHeight 450)
      (.setScene (doto(Scene.)
      (.setFillColor/LIGHTGREEN)
      (.setContent (list (doto (Rectangle.)
      (.setX 25)
      (.setY 40)
      (.setWidth 100)
      (.setHeight 50)
      (.setFillColor/RED))))))
      (.setVisible true)))
      (javafxapp)
      39
      Let replaced with inline declarations
    • 42. Refined Clojure GUI Example
      (defnjavafxapp []
      (doto (Stage. "JavaFX Stage")
      (.setWidth 600)
      (.setHeight 450)
      (.setScene (doto (Scene.)
      (.setFillColor/LIGHTGREEN)
      (.setContent (list (doto (Rectangle.)
      (.setX 25)
      (.setY 40)
      (.setWidth 100)
      (.setHeight 50)
      (.setFillColor/RED))))))
      (.setVisible true)))
      (javafxapp)
      40
      Doto allows nested data structures
    • 43. Refined Clojure GUI Example
      (defnjavafxapp []
      (doto (Stage. "JavaFX Stage")
      (.setWidth 600)
      (.setHeight 450)
      (.setScene (doto (Scene.)
      (.setFillColor/LIGHTGREEN)
      (.setContent (list (doto (Rectangle.)
      (.setX 25)
      (.setY 40)
      (.setWidth 100)
      (.setHeight 50)
      (.setFillColor/RED))))))
      (.setVisible true)))
      (javafxapp)
      41
      Now a nested Rectangle fits!
    • 44. Closures in Clojure
      42
      Inner classes can be created using proxy
      (.addChangeListenerrectRectangle/HOVER
      (proxy [Listener] []
      (handle [b, p]
      (.setFillrect
      (if (.isHoverrect) Color/GREEN Color/RED)))))
    • 45. Closures in Clojure
      Inner classes can be created using proxy
      43
      Proxy form:
      (proxy [class] [args] fs+)
      f => (name [params*] body)
      (.addChangeListenerrectRectangle/HOVER
      (proxy[Listener][]
      (handle [b, p]
      (.setFillrect
      (if (.isHoverrect) Color/GREEN Color/RED)))))
    • 46. JavaFX With Groovy
    • 47. Features of Groovy
      Tight integration with Java
      Very easy to port from Java to Groovy
      Declarative syntax
      Familiar to JavaFX Script developers
      Builders
    • 48. Example 1: Simple FX Script to Groovy
    • 49. Step 1: Lazy conversion to Groovy
      class HelloStage implements Runnable {
      void run() {
      Stage stage = new Stage();
      stage.setTitle("Hello Stage (Groovy)“);
      stage.setWidth(600);
      stage.setHeight(450);
      Scene scene = new Scene();
      scene.setFill(Color.LIGHTSKYBLUE);
      stage.setScene(scene);
      stage.setVisible(true);
      }
      static void main(args) {
      FX.start(new HelloStage());
      }
      }
    • 50. Step 2: Slightly More Groovy
      class HelloStage implements Runnable {
      void run() {
      new Stage(
      title: "Hello Stage (Groovy)",
      width: 600,
      height: 450,
      visible: true,
      scene: new Scene(
      fill: Color.LIGHTSKYBLUE,
      )
      );
      }
      static void main(args) {
      FX.start(new HelloStage());
      }
      }
    • 51. Slight Aside: Groovy Builders
      Groovy builders make writing custom DSLs easy
      For the next slide, I am using a builder I defined
      Hopefully the community will improve upon this
    • 52. Step 3: Using a Groovy Builder
      FxBuilder.build {
      stage = stage(
      title: "Hello World",
      width: 600,
      height: 450,
      scene: scene(fill: Color.LIGHTSKYBLUE) {
      ...
      }
      )
      stage.visible = true;
      }
    • 53. Step 4: With Content
      FxBuilder.build {
      stage = stage(
      title: "Hello Rectangle (Groovy FxBuilder 2)",
      width: 600,
      height: 450,
      scene: scene(fill: Color.LIGHTSKYBLUE) {
      rectangle(
      x: 25, y: 40,
      width: 100, height: 50,
      fill: Color.RED
      )
      }
      )
      stage.visible = true;
      }
    • 54. Example 2: FX Script Animation in Groovy
    • 55. Step 1: JavaFX Script
      def timeline = Timeline {
      repeatCount: Timeline.INDEFINITE
      autoReverse: true
      keyFrames: [
      KeyFrame {
      time: 750ms
      values : [
      rect1.x => 200.0 tweenInterpolator.LINEAR,
      rect2.y => 200.0 tweenInterpolator.LINEAR,
      circle1.radius => 200.0 tweenInterpolator.LINEAR
      ]
      }
      ];
      }
      timeline.play();
    • 56. Step 1a: JavaFX Script Simplification
      def timeline = Timeline {
      repeatCount: Timeline.INDEFINITE
      autoReverse: true
      keyFrames: at (750ms) {
      rect1.x => 200.0 tween Interpolator.LINEAR;
      rect2.y => 200.0 tween Interpolator.LINEAR;
      circle1.radius => 200.0 tween Interpolator.LINEAR;
      }
      }
      timeline.play();
    • 57. Step 2: Java-ish Groovy Animations
      final Timeline timeline = new Timeline(
      repeatCount: Timeline.INDEFINITE,
      autoReverse: true
      )
      final KeyValue kv1 = new KeyValue (rect1.x(), 200);
      final KeyValue kv2 = new KeyValue (rect2.y(), 200);
      final KeyValue kv3 = new KeyValue (circle1.radius(), 200);
      final KeyFramekf = new KeyFrame(Duration.valueOf(750), kv1, kv2, kv3);
      timeline.getKeyFrames().add(kf);
      timeline.play();
    • 58. Step 3: JavaFX Animation Groovy DSL (courtesy of Jim Clarke – work in progress)
      timeline = timeline(repeatCount: Timeline.INDEFINITE, autoReverse: true) {
      at 750.ms update values {
      change rect1.y() to 200
      change rect2.x() to 200
      change circle.radius() to 200
      }
      }
      timeline.play();
    • 59. Groovy Closures - With interface coercion
      def f = {
      bean, pr-> rect.setFill(rect.isHover() ? Color.GREEN : Color.RED);
      } as Listener;
      rect.addChangedListener(Rectangle.HOVER, f);
    • 60. 58
      JavaFX With Scala
    • 61. What is Scala
      Started in 2001 by Martin Odersky
      Compiles to Java bytecodes
      Pure object-oriented language
      Also a functional programming language
      59
    • 62. Why Scala?
      Shares many language features with JavaFX Script that make GUI programming easier:
      Static type checking – Catch your errors at compile time
      Closures – Wrap behavior and pass it by reference
      Declarative – Express the UI by describing what it should look like
      Scala also supports DSLs!
      60
    • 63. Java vs. Scala DSL
      public class HelloStage implements Runnable {
      public void run() {
      Stage stage = new Stage();
      stage.setTitle("Hello Stage");
      stage.setWidth(600);
      stage.setHeight(450);
      Scene scene = new Scene();
      scene.setFill(Color.LIGHTGREEN);
      Rectangle rect = new Rectangle();
      rect.setX(25);
      rect.setY(40);
      rect.setWidth(100);
      rect.setHeight(50);
      rect.setFill(Color.RED);
      stage.add(rect);
      stage.setScene(scene);
      stage.setVisible(true);
      }
      public static void main(String[] args) {
      FX.start(new HelloStage());
      }
      }
      object HelloJavaFX extends JavaFXApplication {
      def stage = new Stage {
      title = "Hello Stage"
      width = 600
      height = 450
      scene = new Scene {
      fill = Color.LIGHTGREEN
      content = List(new Rectangle {
      x = 25
      y = 40
      width = 100
      height = 50
      fill = Color.RED
      })
      }
      }
      }
      61
      22 Lines
      545 Characters
      17 Lines
      324 Characters
    • 64. object HelloJavaFX extends JavaFXApplication {
      def stage = new Stage {
      title = "Hello Stage"
      width = 600
      height = 450
      scene = new Scene {
      fill = Color.LIGHTGREEN
      content = List(new Rectangle {
      x = 25
      y = 40
      width = 100
      height = 50
      fill = Color.RED
      })
      }
      }
      }
      62
    • 65. 63
      object HelloJavaFX extends JavaFXApplication {
      def stage = new Stage {
      title = "Hello Stage"
      width = 600
      height = 450
      scene = new Scene {
      fill = Color.LIGHTGREEN
      content = List(new Rectangle {
      x = 25
      y = 40
      width = 100
      height = 50
      fill = Color.RED
      })
      }
      }
      }
      object HelloJavaFX extends JavaFXApplication {
      def stage = new Stage {
      title = "Hello Stage"
      width = 600
      height = 450
      scene = new Scene {
      fill = Color.LIGHTGREEN
      content = List(new Rectangle {
      x = 25
      y = 40
      width = 100
      height = 50
      fill = Color.RED
      })
      }
      }
      }
      Base class for JavaFX applications
    • 66. 64
      object HelloJavaFX extends JavaFXApplication {
      def stage = new Stage {
      title = "Hello Stage"
      width = 600
      height = 450
      scene = new Scene {
      fill = Color.LIGHTGREEN
      content = List(new Rectangle {
      x = 25
      y = 40
      width = 100
      height = 50
      fill = Color.RED
      })
      }
      }
      }
      Declarative Stage definition
    • 67. 65
      object HelloJavaFX extends JavaFXApplication {
      def stage = new Stage {
      title = "Hello Stage"
      width = 600
      height = 450
      scene = new Scene {
      fill = Color.LIGHTGREEN
      content = List(new Rectangle {
      x = 25
      y = 40
      width = 100
      height = 50
      fill = Color.RED
      })
      }
      }
      }
      Inline property definitions
    • 68. 66
      object HelloJavaFX extends JavaFXApplication {
      def stage = new Stage {
      title = "Hello Stage"
      width = 600
      height = 450
      scene = new Scene {
      fill = Color.LIGHTGREEN
      content = List(new Rectangle {
      x = 25
      y = 40
      width = 100
      height = 50
      fill = Color.RED
      })
      }
      }
      }
      List Construction Syntax
    • 69. Animation in Scala
      def timeline = new Timeline {
      repeatCount = INDEFINITE
      autoReverse = true
      keyFrames = List(
      new KeyFrame(time: 50) {
      values = List(
      new KeyValue(rect1.x() -> 300),
      new KeyValue(rect2.y() -> 500),
      new KeyValue(rect2.width() -> 150)
      )
      }
      )
      }
      67
    • 70. def timeline = new Timeline {
      repeatCount = INDEFINITE
      autoReverse = true
      keyFrames = List(
      new KeyFrame(time: 50) {
      values = List(
      new KeyValue(rect1.x() -> 300),
      new KeyValue(rect2.y() -> 500),
      new KeyValue(rect2.width() -> 150)
      )
      }
      )
      }
      Animation in Scala
      68
      Duration set by Constructor Parameter
    • 71. Animation in Scala
      69
      def timeline = new Timeline {
      repeatCount = INDEFINITE
      autoReverse = true
      keyFrames = List(
      new KeyFrame(time: 50) {
      values = List(
      new KeyValue(rect1.x() -> 300),
      new KeyValue(rect2.y() -> 500),
      new KeyValue(rect2.width() -> 150)
      )
      }
      )
      }
      Operator overloading for animation syntax
    • 72. Closures in Scala
      70
      Closures are also supported in Scala
      And they are 100% type-safe
      rect.addChangedListener(Node.HOVER, (b, p) => {
      rect.fill = if (rect.hover) Color.GREEN else Color.RED
      })
    • 73. Closures in Scala
      Closures are also supported in Scala
      And they are 100% type-safe
      71
      rect.addChangedListener(Node.HOVER, (b, p) => {
      rect.fill = if (rect.hover) Color.GREEN else Color.RED
      })
      Compact syntax
      (params) => {body}
    • 74. Other JVM Languages to Try
      Jython
      Started by Jim Hugunin
      High Performance Python
      Mirah
      Invented by Charles Nutter
      Originally called Duby
      Local Type Inference, Static and Dynamic Typing
      Fantom
      Created by Brian and Andy Frank
      Originally called Fan
      Built-in Declarative Syntax
      Portable to Java and .NET
      Local Type Inference, Static and Dynamic Typing
      72
    • 75. Fantom Code Example
      Void main() {
      Stage {
      title= "Hello Stage"
      width= 600
      height= 450
      Scene {
      fill= Color.LIGHTGREEN
      Rectangle {
      x= 25
      y= 40
      width= 100
      height= 50
      fill= Color.RED
      }
      }
      }.open
      }
      73
    • 76. timeline := Timeline {
      repeatCount = Timeline.INDEFINITE
      autoReverse = true
      KeyFrame {
      time = 50ms
      KeyValue(rect1.x()-> 300),
      KeyValue(rect2.y() -> 500),
      KeyValue(rect2.width() -> 150)
      }
      }
      Animation in Fantom
      74
      Fantom has a built-in Duration type
      And also supports operator overloading
    • 77. Announcing Project Visage
      75
      • “Visage is a domain specific language (DSL) designed for the express purpose of writing user interfaces.”
      Visage project goals:
      Compile to JavaFX Java APIs
      Evolve the Language (Annotations, Maps, etc.)
      Support Other Toolkits
      Come join the team!
      For more info: http://visage-lang.org/
    • 78. How about JavaFX on… Visage
      Stage {
      title: "Hello Stage"
      width: 600
      height: 450
      scene: Scene {
      fill: Color.LIGHTGREEN
      content: Rectangle {
      x: 25
      y: 40
      width: 100
      height: 50
      fill: Color.RED
      }
      }
      }
      76
    • 79. How about JavaFX on… Visage
      Stage {
      title: "Hello Stage"
      width: 600
      height: 450
      scene: Scene {
      fill: Color.LIGHTGREEN
      content: Rectangle {
      x: 25
      y: 40
      width: 100
      height: 50
      fill: Color.RED
      }
      }
      }
      77
    • 80. How about JavaFX on… Visage
      Stage {
      title: "Hello Stage"
      width: 600
      height: 450
      Scene {
      fill: Color.LIGHTGREEN
      Rectangle {
      x: 25
      y: 40
      width: 100
      height: 50
      fill: Color.RED
      }
      }
      }
      78
    • 81. Conclusion
      You can write JavaFX applications in pure Java
      JavaFX is also usable in alternate languages
      Over time improved support is possible
      Groovy Builders, Scala DSL, Visage
      Remember: This is a proof of concept only – you can not leave this session and do this today.
    • 82. Challenge the Presenter…
    • 83. Challenge the Presenter…
    • 84. 82
      Stephen Chin
      steveonjava@gmail.com
      tweet: @steveonjava

    ×