• Like

Loading…

Flash Player 9 (or above) is needed to view presentations.
We have detected that you do not have it on your computer. To install it, go here.

JavaFX Your Way - Devoxx Version

  • 5,556 views
Uploaded on

Updated version of the JavaFX Your Way talk for Devoxx. This includes additional JavaFX 2.0 API changes and an example of some Fantom code snippets.

Updated version of the JavaFX Your Way talk for Devoxx. This includes additional JavaFX 2.0 API changes and an example of some Fantom code snippets.

  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
No Downloads

Views

Total Views
5,556
On Slideshare
0
From Embeds
0
Number of Embeds
4

Actions

Shares
Downloads
38
Comments
0
Likes
1

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 Your WayBuilding JavaFX Applications with Alternative Languages
    Stephen Chin
    GXS
    steveonjava@gmail.com
    tweet: @steveonjava
    Jonathan Giles
    Oracle
    Jonathan.giles@oracle.comtweet: @jonathangiles
  • 2. Meet the Presenters…
    A reasonable facsimile of…
    Steve
    Jonathan
    ?
    2
    Family Man
    Motorcyclist
  • 3. Challenge the Presenter…
  • 4. Challenge the Presenter…
  • 5. Disclaimer: This is proof of concept
    THE FOLLOWING IS INTENDED TO OUTLINE OUR GENERAL PRODUCT DIRECTION. IT IS INTENDED FOR INFORMATION PURPOSES ONLY, AND MAY NOT BE INCORPORATED INTO ANY CONTRACT. IT IS NOT A COMMITMENT TO DELIVER ANY MATERIAL, CODE, OR FUNCTIONALITY, AND SHOULD NOT BE RELIED UPON IN MAKING PURCHASING DECISION. THE DEVELOPMENT, RELEASE, AND TIMING OF ANY FEATURES OR FUNCTIONALITY DESCRIBED FOR ORACLE'S PRODUCTS REMAINS AT THE SOLE DISCRETION OF ORACLE.
  • 6. THE FOLLOWING IS INTENDED TO OUTLINE ORACLE’SGENERAL PRODUCT DIRECTION. IT IS INTENDED FOR INFORMATION PURPOSES ONLY, AND MAY NOT BE INCORPORATED INTO ANY CONTRACT. IT IS NOT A COMMITMENT TO DELIVER ANY MATERIAL, CODE, OR FUNCTIONALITY, AND SHOULD NOT BE RELIED UPON IN MAKING PURCHASING DECISION. THE DEVELOPMENT, RELEASE, AND TIMING OF ANY FEATURES OR FUNCTIONALITY DESCRIBED FOR ORACLE'S PRODUCTS REMAINS AT THE SOLE DISCRETION OF ORACLE.
  • 7. Disclaimer #2: 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.
  • 8. Overall Presentation Goal
    Demonstrate the future potential of the JavaFX platform.
  • 9. Agenda
    JavaFX 2.0 Announcement
    JavaFX in Java
    Explore alternative languages
    JRuby
    Clojure
    Groovy
    Scala
    +???
  • 10. JavaFX2.0 Announcement
    • JavaFX Script is no longer required to write JavaFX applications
    • 11. Benefits:
    • 12. Easier integration with business logic on JVM
    • 13. Access to generics, annotations, (closures), etc
    • 14. Java has great IDE support
    • 15. Downsides:
    • 16. JavaFX Script was kind to us
  • JavaFX With Java
  • 17. JavaFX in Java
    JavaFX API follows JavaBeans approach
    Similar in feel to other UI toolkits (Swing, etc.)
    Researching approaches to minimize boilerplate
  • 18. Binding
    Unquestionably the biggest JavaFX Script innovation
    Will be supported via a PropertyBinding class
    Lazy invocation for high performance
    Static construction syntax for simple cases
    e.g.: bindTo(<property>)
  • 19. Observable Pseudo-Properties
    Supports watching for changes to properties
    Implemented via anonymous inner classes
    Will take advantage of closures in the future
  • 20. Observable Pseudo-Properties
    Rectangle rect = new Rectangle();
    rect.setX(40);
    rect.setY(40);
    rect.setWidth(100);
    rect.setHeight(200);
    rect.addChangedListener(Rectangle.HOVER, new Listener() {
    });
  • 21. Observable Pseudo-Properties
    Rectangle rect = new Rectangle();
    rect.setX(40);
    rect.setY(40);
    rect.setWidth(100);
    rect.setHeight(200);
    rect.addChangedListener(Rectangle.HOVER, new Listener() {
    });
    The property we want to watch
  • 22. Observable Pseudo-Properties
    Rectangle rect = new Rectangle();
    rect.setX(40);
    rect.setY(40);
    rect.setWidth(100);
    rect.setHeight(200);
    rect.addChangedListener(Rectangle.HOVER, new Listener() {
    });
    Only one listener used regardless of data type
  • 23. Observable Pseudo-Properties
    Rectangle rect = new Rectangle();
    rect.setX(40);
    rect.setY(40);
    rect.setWidth(100);
    rect.setHeight(200);
    rect.addChangedListener(Rectangle.HOVER, new Listener() {
    public void handle(Bean bean, PropertyReference pr) {
    }
    });
    Rectangle is a Bean
  • 24. Observable Pseudo-Properties
    Rectangle rect = new Rectangle();
    rect.setX(40);
    rect.setY(40);
    rect.setWidth(100);
    rect.setHeight(200);
    rect.addChangedListener(Rectangle.HOVER, new Listener() {
    public void handle(Bean bean, PropertyReference pr) {
    }
    });
    Refers to the Rectangle.hover ‘property’
  • 25. Observable Pseudo-Properties
    Rectangle rect = new Rectangle();
    rect.setX(40);
    rect.setY(40);
    rect.setWidth(100);
    rect.setHeight(200);
    rect.addChangedListener(Rectangle.HOVER, new Listener() {
    public void handle(Bean bean, PropertyReference pr) {
    rect.setFill(rect.isHover() ? Color.GREEN : Color.RED);
    }
    });
  • 26. 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
  • 27. Example Application
    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);
    stage.setScene(scene);
    stage.setVisible(true);
    }
    public static void main(String[] args) {
    FX.start(new HelloStage());
    }
    }
    Stage {
    title: “Hello Stage”
    width: 600
    height: 450
    scene: Scene {
    fill: Color.LIGHTGREEN
    }
    }
  • 28. Summary
    The JVM has a modern UI toolkit coming to it
    Total port to Java – no hacks or kludges
    Many languages to choose from
    Alternate languages == exciting possibilities
    Choose the best language for your needs
  • 29. Major Question
    24
    How can alternative languages make developing
    JavaFX user interfaces easier & more productive?
  • 30. JavaFX With JRuby
  • 31. Why JRuby?
    • Direct access to Java APIs
    • 32. Dynamic Typing
    • 33. Closures
    • 34. ‘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
  • 35. 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;
  • 36. 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.x(), 200);
    kf = KeyFrame.new(Duration.valueOf(500), kv);
    timeline.key_frames.addkf;
    timeline.play();
  • 37. JRuby Closure Conversion
    rect.add_changed_listener(Rectangle::HOVER) do |bean, pr|
    rect.fill = rect.hover ? Color::GREEN : Color::RED;
    end
    30
  • 38. 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
    }
    31
  • 39. 32
    JavaFX With Clojure
    Artwork by Augusto Sellhorn
    http://sellmic.com/
  • 40. 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!
    33
    (def hello (fn [] "Hello world"))
    (hello)
  • 41. Clojure Syntax in One Slide
    Symbols
    numbers – 2.178
    ratios – 355/113
    strings – “clojure”, “rocks”
    characters –
    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}
    34
    (plus macros that are syntactic sugar wrapping the above)
  • 42. 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)
    35
  • 43. 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)
    36
    Create a Function for the Application
  • 44. 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)
    37
    Initialize the Stage and Scene Variables
  • 45. 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)
    38
    Call Setter Methods on Scene and Stage
  • 46. 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)
    39
    Java Constant Syntax
    Java Method Syntax
  • 47. Simpler Code Using doto
    (defnjavafxapp []
    (let [stage (Stage. "JavaFX Stage")
    scene (Scene.)]
    (doto scene
    (.setFillColor/LIGHTGREEN))
    (doto stage
    (.setWidth600)
    (.setHeight450)
    (.setScene scene)
    (.setVisibletrue))))
    (javafxapp)
    40
  • 48. 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)
    41
    doto form:
    (doto symbol
    (.method params))
    equals:
    (.method symbol params)
  • 49. 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)
    42
  • 50. 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)
    43
    Let replaced with inline declarations
  • 51. 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)
    44
    Doto allows nested data structures
  • 52. 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)
    45
    Now a nested Rectangle fits!
  • 53. Closures in Clojure
    46
    Inner classes can be created using proxy
    (.addChangeListenerrectRectangle/HOVER
    (proxy [BooleanListener] []
    (handle [b, p, o]
    (.setFillrect
    (if (.isHoverrect) Color/GREEN Color/RED)))))
  • 54. Closures in Clojure
    Inner classes can be created using proxy
    47
    Proxy form:
    (proxy [class] [args] fs+)
    f => (name [params*] body)
    (.addChangeListenerrectRectangle/HOVER
    (proxy[Listener][]
    (handle [b, p]
    (.setFillrect
    (if (.isHoverrect) Color/GREEN Color/RED)))))
  • 55. JavaFX With Groovy
  • 56. Features of Groovy
    Tight integration with Java
    Very easy to port from Java to Groovy
    Declarative syntax
    Familiar to JavaFX Script developers
    Builders
  • 57. Example 1: Simple FX Script to Groovy
  • 58. 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());
    }
    }
  • 59. 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());
    }
    }
  • 60. 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
  • 61. 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;
    }
  • 62. 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;
    }
  • 63. Example 2: FX Script Animation in Groovy
  • 64. 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();
  • 65. 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();
  • 66. 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 KeyFrame kf = new KeyFrame(Duration.valueOf(750), kv1, kv2, kv3);
    timeline.getKeyFrames().add(kf);
    timeline.play();
  • 67. Step 3: JavaFX Animation in Groovy (Using Builders)
    timeline = timeline(repeatCount: Timeline.INDEFINITE, autoReverse: true) {
    keyframes {
    keyframe(time: 750) {
    keyvalue(target: rect1.y(), endValue: 200);
    keyvalue(target: rect2.x(), endValue: 200);
    keyvalue(target: circle1.radius(), endValue: 200);
    }
    }
    }
    timeline.play();
  • 68. Groovy Closures - With interface coercion
    def f = {
    bean, pr-> rect.setFill(rect.isHover() ? Color.GREEN : Color.RED);
    } as Listener;
    rect.addChangedListener(Rectangle.HOVER, f);
  • 69. 62
    JavaFX With Scala
  • 70. What is Scala
    Started in 2001 by Martin Odersky
    Compiles to Java bytecodes
    Pure object-oriented language
    Also a functional programming language
    63
  • 71. 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!
    64
  • 72. 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
    })
    }
    }
    }
    65
    22 Lines
    545 Characters
    17 Lines
    324 Characters
  • 73. 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
    })
    }
    }
    }
    66
  • 74. 67
    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
  • 75. 68
    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
  • 76. 69
    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
  • 77. 70
    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
  • 78. Animation in Scala
    def timeline = new Timeline {
    repeatCount = INDEFINITE
    autoReverse = true
    keyFrames = List(
    new KeyFrame(50) {
    values = List(
    new KeyValue(rect1.x() -> 300),
    new KeyValue(rect2.y() -> 500),
    new KeyValue(rect2.width() -> 150)
    )
    }
    )
    }
    71
  • 79. Animation in Scala
    72
    def timeline = new Timeline {
    repeatCount = INDEFINITE
    autoReverse = true
    keyFrames = List(
    new KeyFrame(50){
    values = List(
    new KeyValue(rect1.x() -> 300),
    new KeyValue(rect2.y() -> 500),
    new KeyValue(rect2.width() -> 150)
    )
    }
    )
    }
    Duration set by Constructor Parameter
  • 80. Animation in Scala
    73
    def timeline = new Timeline {
    repeatCount = INDEFINITE
    autoReverse = true
    keyFrames = List(
    new KeyFrame(50) {
    values = List(
    new KeyValue(rect1.x() -> 300),
    new KeyValue(rect2.y() -> 500),
    new KeyValue(rect2.width() -> 150)
    )
    }
    )
    }
    Operator overloading for animation syntax
  • 81. Closures in Scala
    74
    Closures are also supported in Scala
    And they are 100% type-safe
    rect.addChangedListener(Node.HOVER, (b, p, o) => {
    rect.fill = if (rect.hover) Color.GREEN else Color.RED
    })
  • 82. Closures in Scala
    Closures are also supported in Scala
    And they are 100% type-safe
    75
    rect.addChangedListener(Node.HOVER, (b, p) => {
    rect.fill = if (rect.hover) Color.GREEN else Color.RED
    })
    rect.addChangedListener(Node.HOVER, (b, p) => {
    rect.fill = if (rect.hover) Color.GREEN else Color.RED
    })
    Compact syntax
    (params) => {body}
  • 83. 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
    76
  • 84. 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
    }
    77
  • 85. 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
    78
    Fantom has a built-in Duration type
    And also supports operator overloading
  • 86. Announcing Project Visage
    79
    • “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/
  • 87. 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
    }
    }
    }
    80
  • 88. Visage Android Workshop
    Today @ 21:00 – 22:00
    Room: BOF 2
    Description:
    Bring your Android device and learn how to build and deploy Android market applications using the Visage language.
    Prizes will be awarded for finding defects and helping the dev team make Visage better.
    81
  • 89. Conclusion
    JavaFX as Java APIs is great
    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.
  • 90. 83
    Presentation will be posted at: http://steveonjava.com/
    Thank You for Attending!
    Stephen Chin
    steveonjava@gmail.com
    tweet: @steveonjava
    Jonathan Giles
    Jonathan.giles@oracle.com
    tweet: @jonathangiles