SlideShare a Scribd company logo
1 of 27
Download to read offline
From Swing
    To JavaFX
- Migration Guide to JavaFX -



               Java in the Box
               Yuichi Sakuraba
Basics of JavaFX
JavaFX
Next Generation Java GUI Library

Functionally Analogous:
                 Swing+Java2D+α
  JavaSE8 includes JavaFX3.0
public class Hello extends Application {
    @Override
    public void start(Stage stage) {
        // Create Container
        Group container = new Group();

        // Create root of Scene Graph
        Scene scene = new Scene(container, 100, 20);
        stage.setScene(scene);

        // Create label and add it to Scene Graph
        Label label = new Label("Hello, World!");
        container.getChildren().add(label);


    }
        stage.show();   SceneGraph
    public static void main(String[] args) {
        launch(args);
    }
}           Start JavaFX Application Thread
Pitfalls
Add to Container
      pane.add(comp);
      pane.getChildren().add(comp);
Event
 Only One Event Listener: EventHandler
     button.setOnAction(
         new EventHandler<ActionEvent>() {
             public void handle(ActionEvent event) {
                 // handling event
             }
     });
Pitfalls   View         Observer Pattern
  Bind
                              Model
           Swing
                         Event
           Controller
Pitfalls    View
  Bind
                          Model
           JavaFX Bind

             Controller
Pitfalls     View
  Bind
                                         Model
           JavaFX Bind

              Controller

           // Model object
           DoubleProperty xProperty = new DoubleProperty();

           Slider slider = new Slider(50, 300, 0);
           // Bind slider property to model object
           xProperty.bind(slider.valueProperty());

           Rectangle rect = new Rectangle(50, 10, 50, 30);
           // Bind model object to x property of rectangle
           rect.xProperty().bind(xProperty);
Migration Scenarios

      Scenario #1 JavaFX in Swing

     Scenario #2 Swing to JavaFX
                       w/o FXML
      Scenario #3 Swing to JavaFX
                        w/ FXML
JavaFX in Swing
   Embed JavaFX scene graph
        in Swing application
      No support for
      embedding Swing components
      into JavaFX applications

Use features JavaFX only has
                   with Swing
JavaFX in Swing
   Embed JavaFX scene graph
        in Swing application
      No support for
      embedding Swing components
      into JavaFX applications

Use features JavaFX only has
        Web    Media
                   with Swing
       Charts   Animation
JFXPanel
 JFXPanel is a Swing component
  that is compatible with JavaFX
   Add scene graph into JFXPanel
 final JFXPanel fxPanel = new JFXPanel();   Swing EDT
 jframe.add(fxPanel);

 Platform.runLater(new Runnable() {
     @Override
     public void run() {       JavaFX App Thread
         AnchorPane root = new AnchorPane();
         Scene scene = new Scene(root);
         root.getChildren().add(new Button("JavaFX Button"));
         fxPanel.setScene(scene);
     }
 });
Swing to JavaFX w/o FXML
 Rewrite Swing as JavaFX
   Same concept, similar usage
       Label, Button, TextField, et al.
  Same concept, different usage
      Layout
   New concept
      TableView, TreeView, ListView
Same concept, : Button
  similar usage
Swing
     JButton = new JButton(”Swing”);

     button.addActionListener(new ActionListener() {
         @Override
         public void actionPerformed(new ActionEvent event) {
             // handling event
         }
     });
JavaFX
  Button = new Button(”JavaFX”);

  button.setOnAction(new EventHandler<ActionEvent>() {
      @Override
      public void handle(ActionEvent event) {
          // handling event
      }
  });
Same concept, : Layout
 different usage
Swing: Container+LayoutManeger
   JPanel panel = new JPanel();
   panel.setLayout(new BorderLayout());

   panel.add(comp, BorderLayout.CENTER);


JavaFX: Container includes layout
   BorderPane pane = new BorderPane();

   pane.setCenter(comp);
New Concept: Table
Swing: TableModel
JavaFX: Bind Java Beans to Column
 class Student { ...... } // Java Bean & gradYear props
               {..} // Student has name

 TableView<Student> table = new TableView<>();

 TableColumn col1 = new TableColumn("Name");
 col1.setCellValueFactory(
     new PropertyValueFactory<Student, String>("name")
 );
 TableColumn col2 = new TableColumn("Grad Year");
 col2.setCellValueFactory(
     new PropertyValueFactory<Student, Integer>("gradYear")
 );

 table.setItems(students);
 table.getColumns().addAll(col1, col2);
Swing to JavaFX
           w/   FXML
FXML
Use XML to describe GUI structure
    FXML describes Scene Graph

  Schema-less
    Class: XML Element
    Property: XML Attribute or Element

 FXML read by Java application
                     at run time
ex. browser.fxml
<AnchorPane prefHeight="400.0" prefWidth="600.0">
  <children>
    <HBox alignment="CENTER"
          prefHeight="50.0" prefWidth="572.0" spacing="20.0">
      <children>
        <TextField prefWidth="200.0" style="-fx-font-size: 24;" />
        <Button style="-fx-font-size: 24;" text="Load" />
      </children>
    </HBox>
    <WebView prefHeight="302.0" prefWidth="572.0" />
  </children>
</AnchorPane>



AnchorPane pane = FXMLLoader.load(
                    this.getClass().getResource("browser.fxml"));
Linking FXML to Java



              ?
     View
     FXML
                   Model
                   Java

      Controller
        Java
Linking FXML to Java

 View     Controller   Model
 FXML       Java       Java
fx:id     @FXML
#method
<AnchorPane xmlns:fx="http://javafx.com/fxml"
             fx:controller="contents.BrowserController">
  <children>
    <HBox>
      <children>
        <TextField fx:id="textfield" />
        <Button onAction="#handleAction" />
      </children>
    </HBox>
    <WebView fx:id="webview" />
  </children>
            public class BrowserController implements Initializable {
</AnchorPane> @FXML private TextField textfield;
               @FXML private WebView webview;
               private WebEngine engine;

               @FXML public void handleAction(ActionEvent event) {
                   engine.load(textfield.getText());
               }
               @Override
               public void initialize(URL url, ResourceBundle rb) {
                   engine = webview.getEngine();
               }
           }
<AnchorPane xmlns:fx="http://javafx.com/fxml"
             fx:controller="contents.BrowserController">
  <children>
    <HBox>
      <children>
        <TextField fx:id="textfield" />
        <Button onAction="#handleAction" />
      </children>
    </HBox>
    <WebView fx:id="webview" />
  </children>
            public class BrowserController implements Initializable {
</AnchorPane> @FXML private TextField textfield;
               @FXML private WebView webview;
               private WebEngine engine;

               @FXML public void handleAction(ActionEvent event) {
                   engine.load(textfield.getText());
               }
               @Override
               public void initialize(URL url, ResourceBundle rb) {
                   engine = webview.getEngine();
               }
           }
Tools
  Java   NetBeans


  FXML   Scene Builder
Conclusion
 3 migration scenarios
 Not so different from
   a Component-based UI standpoint
 FXML is a key feature

No mention in this session
   CSS, Animaction, Effect
   Shape, Aysnc task
From Swing
    To JavaFX
- Migration Guide to JavaFX -



              Java in the Box
              Yuichi Sakuraba

More Related Content

What's hot

AngularJS application architecture
AngularJS application architectureAngularJS application architecture
AngularJS application architectureGabriele Falace
 
AngularJS Basics and Best Practices - CC FE &UX
AngularJS Basics and Best Practices - CC FE &UXAngularJS Basics and Best Practices - CC FE &UX
AngularJS Basics and Best Practices - CC FE &UXJWORKS powered by Ordina
 
Universal JavaScript Web Applications with React - Luciano Mammino - Codemoti...
Universal JavaScript Web Applications with React - Luciano Mammino - Codemoti...Universal JavaScript Web Applications with React - Luciano Mammino - Codemoti...
Universal JavaScript Web Applications with React - Luciano Mammino - Codemoti...Codemotion
 
Workshop 2: JavaScript Design Patterns
Workshop 2: JavaScript Design PatternsWorkshop 2: JavaScript Design Patterns
Workshop 2: JavaScript Design PatternsVisual Engineering
 
Angular2 Development for Java developers
Angular2 Development for Java developersAngular2 Development for Java developers
Angular2 Development for Java developersYakov Fain
 
AngularJS Basics
AngularJS BasicsAngularJS Basics
AngularJS BasicsRavi Mone
 
SproutCore and the Future of Web Apps
SproutCore and the Future of Web AppsSproutCore and the Future of Web Apps
SproutCore and the Future of Web AppsMike Subelsky
 
Angular 2 어디까지 왔을까
Angular 2 어디까지 왔을까Angular 2 어디까지 왔을까
Angular 2 어디까지 왔을까장현 한
 
Overview of the AngularJS framework
Overview of the AngularJS framework Overview of the AngularJS framework
Overview of the AngularJS framework Yakov Fain
 
AngularJS - What is it & Why is it awesome ? (with demos)
AngularJS - What is it & Why is it awesome ? (with demos)AngularJS - What is it & Why is it awesome ? (with demos)
AngularJS - What is it & Why is it awesome ? (with demos)Gary Arora
 
AngularJS introduction
AngularJS introductionAngularJS introduction
AngularJS introductionTania Gonzales
 
JSF and Seam
JSF and SeamJSF and Seam
JSF and Seamyuvalb
 
Node.js and Selenium Webdriver, a journey from the Java side
Node.js and Selenium Webdriver, a journey from the Java sideNode.js and Selenium Webdriver, a journey from the Java side
Node.js and Selenium Webdriver, a journey from the Java sideMek Srunyu Stittri
 
Workshop 13: AngularJS Parte II
Workshop 13: AngularJS Parte IIWorkshop 13: AngularJS Parte II
Workshop 13: AngularJS Parte IIVisual Engineering
 
Go swagger tutorial how to create golang api documentation using go swagger (1)
Go swagger tutorial how to create golang api documentation using go swagger (1)Go swagger tutorial how to create golang api documentation using go swagger (1)
Go swagger tutorial how to create golang api documentation using go swagger (1)Katy Slemon
 
AngularJS 101 - Everything you need to know to get started
AngularJS 101 - Everything you need to know to get startedAngularJS 101 - Everything you need to know to get started
AngularJS 101 - Everything you need to know to get startedStéphane Bégaudeau
 
ForwardJS 2017 - Fullstack end-to-end Test Automation with node.js
ForwardJS 2017 -  Fullstack end-to-end Test Automation with node.jsForwardJS 2017 -  Fullstack end-to-end Test Automation with node.js
ForwardJS 2017 - Fullstack end-to-end Test Automation with node.jsMek Srunyu Stittri
 

What's hot (20)

Workshop 16: EmberJS Parte I
Workshop 16: EmberJS Parte IWorkshop 16: EmberJS Parte I
Workshop 16: EmberJS Parte I
 
AngularJS application architecture
AngularJS application architectureAngularJS application architecture
AngularJS application architecture
 
Angular js
Angular jsAngular js
Angular js
 
AngularJS Basics and Best Practices - CC FE &UX
AngularJS Basics and Best Practices - CC FE &UXAngularJS Basics and Best Practices - CC FE &UX
AngularJS Basics and Best Practices - CC FE &UX
 
Universal JavaScript Web Applications with React - Luciano Mammino - Codemoti...
Universal JavaScript Web Applications with React - Luciano Mammino - Codemoti...Universal JavaScript Web Applications with React - Luciano Mammino - Codemoti...
Universal JavaScript Web Applications with React - Luciano Mammino - Codemoti...
 
Workshop 2: JavaScript Design Patterns
Workshop 2: JavaScript Design PatternsWorkshop 2: JavaScript Design Patterns
Workshop 2: JavaScript Design Patterns
 
Angular2 Development for Java developers
Angular2 Development for Java developersAngular2 Development for Java developers
Angular2 Development for Java developers
 
AngularJS Basics
AngularJS BasicsAngularJS Basics
AngularJS Basics
 
SproutCore and the Future of Web Apps
SproutCore and the Future of Web AppsSproutCore and the Future of Web Apps
SproutCore and the Future of Web Apps
 
Angular 2 어디까지 왔을까
Angular 2 어디까지 왔을까Angular 2 어디까지 왔을까
Angular 2 어디까지 왔을까
 
Overview of the AngularJS framework
Overview of the AngularJS framework Overview of the AngularJS framework
Overview of the AngularJS framework
 
Introduction to Angularjs
Introduction to AngularjsIntroduction to Angularjs
Introduction to Angularjs
 
AngularJS - What is it & Why is it awesome ? (with demos)
AngularJS - What is it & Why is it awesome ? (with demos)AngularJS - What is it & Why is it awesome ? (with demos)
AngularJS - What is it & Why is it awesome ? (with demos)
 
AngularJS introduction
AngularJS introductionAngularJS introduction
AngularJS introduction
 
JSF and Seam
JSF and SeamJSF and Seam
JSF and Seam
 
Node.js and Selenium Webdriver, a journey from the Java side
Node.js and Selenium Webdriver, a journey from the Java sideNode.js and Selenium Webdriver, a journey from the Java side
Node.js and Selenium Webdriver, a journey from the Java side
 
Workshop 13: AngularJS Parte II
Workshop 13: AngularJS Parte IIWorkshop 13: AngularJS Parte II
Workshop 13: AngularJS Parte II
 
Go swagger tutorial how to create golang api documentation using go swagger (1)
Go swagger tutorial how to create golang api documentation using go swagger (1)Go swagger tutorial how to create golang api documentation using go swagger (1)
Go swagger tutorial how to create golang api documentation using go swagger (1)
 
AngularJS 101 - Everything you need to know to get started
AngularJS 101 - Everything you need to know to get startedAngularJS 101 - Everything you need to know to get started
AngularJS 101 - Everything you need to know to get started
 
ForwardJS 2017 - Fullstack end-to-end Test Automation with node.js
ForwardJS 2017 -  Fullstack end-to-end Test Automation with node.jsForwardJS 2017 -  Fullstack end-to-end Test Automation with node.js
ForwardJS 2017 - Fullstack end-to-end Test Automation with node.js
 

Viewers also liked

JavaFX - Straight from the trenches
JavaFX - Straight from the trenchesJavaFX - Straight from the trenches
JavaFX - Straight from the trenchesAnderson Braz
 
Novidades do Java SE 8
Novidades do Java SE 8Novidades do Java SE 8
Novidades do Java SE 8Bruno Borges
 
The Java EE 7 Platform: Developing for the Cloud
The Java EE 7 Platform: Developing for the CloudThe Java EE 7 Platform: Developing for the Cloud
The Java EE 7 Platform: Developing for the Cloudcodemotion_es
 
Java Fx - Return of client Java
Java Fx - Return of client JavaJava Fx - Return of client Java
Java Fx - Return of client JavaShuji Watanabe
 
JavaFX Your Way: Building JavaFX Applications with Alternative Languages
JavaFX Your Way: Building JavaFX Applications with Alternative LanguagesJavaFX Your Way: Building JavaFX Applications with Alternative Languages
JavaFX Your Way: Building JavaFX Applications with Alternative LanguagesStephen Chin
 
Java EE 7: Developing for the Cloud at Geecon, JEEConf, Johannesburg
Java EE 7: Developing for the Cloud at Geecon, JEEConf, JohannesburgJava EE 7: Developing for the Cloud at Geecon, JEEConf, Johannesburg
Java EE 7: Developing for the Cloud at Geecon, JEEConf, JohannesburgArun Gupta
 
Melhore o Desenvolvimento do Time com DevOps na Nuvem
Melhore o Desenvolvimento do Time com DevOps na NuvemMelhore o Desenvolvimento do Time com DevOps na Nuvem
Melhore o Desenvolvimento do Time com DevOps na NuvemBruno Borges
 
JavaFX Enterprise (JavaOne 2014)
JavaFX Enterprise (JavaOne 2014)JavaFX Enterprise (JavaOne 2014)
JavaFX Enterprise (JavaOne 2014)Hendrik Ebbers
 
8 True Stories about JavaFX
8 True Stories about JavaFX8 True Stories about JavaFX
8 True Stories about JavaFXYuichi Sakuraba
 
JavaFX 8 - GUI by Illusion
JavaFX 8 - GUI by IllusionJavaFX 8 - GUI by Illusion
JavaFX 8 - GUI by IllusionYuichi Sakuraba
 
From Swing to JavaFX - SwingからJavaFXへのマイグレーションガイド
From Swing to JavaFX  - SwingからJavaFXへのマイグレーションガイドFrom Swing to JavaFX  - SwingからJavaFXへのマイグレーションガイド
From Swing to JavaFX - SwingからJavaFXへのマイグレーションガイドYuichi Sakuraba
 

Viewers also liked (14)

JavaFX - Straight from the trenches
JavaFX - Straight from the trenchesJavaFX - Straight from the trenches
JavaFX - Straight from the trenches
 
Novidades do Java SE 8
Novidades do Java SE 8Novidades do Java SE 8
Novidades do Java SE 8
 
The Java EE 7 Platform: Developing for the Cloud
The Java EE 7 Platform: Developing for the CloudThe Java EE 7 Platform: Developing for the Cloud
The Java EE 7 Platform: Developing for the Cloud
 
Java Fx - Return of client Java
Java Fx - Return of client JavaJava Fx - Return of client Java
Java Fx - Return of client Java
 
JavaFX Your Way: Building JavaFX Applications with Alternative Languages
JavaFX Your Way: Building JavaFX Applications with Alternative LanguagesJavaFX Your Way: Building JavaFX Applications with Alternative Languages
JavaFX Your Way: Building JavaFX Applications with Alternative Languages
 
Java FX
Java FXJava FX
Java FX
 
Java EE 7: Developing for the Cloud at Geecon, JEEConf, Johannesburg
Java EE 7: Developing for the Cloud at Geecon, JEEConf, JohannesburgJava EE 7: Developing for the Cloud at Geecon, JEEConf, Johannesburg
Java EE 7: Developing for the Cloud at Geecon, JEEConf, Johannesburg
 
Melhore o Desenvolvimento do Time com DevOps na Nuvem
Melhore o Desenvolvimento do Time com DevOps na NuvemMelhore o Desenvolvimento do Time com DevOps na Nuvem
Melhore o Desenvolvimento do Time com DevOps na Nuvem
 
JavaFX Overview
JavaFX OverviewJavaFX Overview
JavaFX Overview
 
JavaFX Enterprise (JavaOne 2014)
JavaFX Enterprise (JavaOne 2014)JavaFX Enterprise (JavaOne 2014)
JavaFX Enterprise (JavaOne 2014)
 
8 True Stories about JavaFX
8 True Stories about JavaFX8 True Stories about JavaFX
8 True Stories about JavaFX
 
JavaFX 8 - GUI by Illusion
JavaFX 8 - GUI by IllusionJavaFX 8 - GUI by Illusion
JavaFX 8 - GUI by Illusion
 
The JavaFX Ecosystem
The JavaFX EcosystemThe JavaFX Ecosystem
The JavaFX Ecosystem
 
From Swing to JavaFX - SwingからJavaFXへのマイグレーションガイド
From Swing to JavaFX  - SwingからJavaFXへのマイグレーションガイドFrom Swing to JavaFX  - SwingからJavaFXへのマイグレーションガイド
From Swing to JavaFX - SwingからJavaFXへのマイグレーションガイド
 

Similar to From Swing to JavaFX

Javascript Frameworks for Joomla
Javascript Frameworks for JoomlaJavascript Frameworks for Joomla
Javascript Frameworks for JoomlaLuke Summerfield
 
UNIT 5-JavaFX Event Handling, Controls and Components.pdf
UNIT 5-JavaFX Event Handling, Controls and Components.pdfUNIT 5-JavaFX Event Handling, Controls and Components.pdf
UNIT 5-JavaFX Event Handling, Controls and Components.pdfSakkaravarthiS1
 
Workshop 23: ReactJS, React & Redux testing
Workshop 23: ReactJS, React & Redux testingWorkshop 23: ReactJS, React & Redux testing
Workshop 23: ReactJS, React & Redux testingVisual Engineering
 
Java!!!!!Create a program that authenticates username and password.pdf
Java!!!!!Create a program that authenticates username and password.pdfJava!!!!!Create a program that authenticates username and password.pdf
Java!!!!!Create a program that authenticates username and password.pdfarvindarora20042013
 
Adding a modern twist to legacy web applications
Adding a modern twist to legacy web applicationsAdding a modern twist to legacy web applications
Adding a modern twist to legacy web applicationsJeff Durta
 
EWD 3 Training Course Part 39: Building a React.js application with QEWD, Part 3
EWD 3 Training Course Part 39: Building a React.js application with QEWD, Part 3EWD 3 Training Course Part 39: Building a React.js application with QEWD, Part 3
EWD 3 Training Course Part 39: Building a React.js application with QEWD, Part 3Rob Tweed
 
Advance Java Programs skeleton
Advance Java Programs skeletonAdvance Java Programs skeleton
Advance Java Programs skeletonIram Ramrajkar
 
Overview of The Scala Based Lift Web Framework
Overview of The Scala Based Lift Web FrameworkOverview of The Scala Based Lift Web Framework
Overview of The Scala Based Lift Web FrameworkIndicThreads
 
Scala based Lift Framework
Scala based Lift FrameworkScala based Lift Framework
Scala based Lift Frameworkvhazrati
 
EWD 3 Training Course Part 38: Building a React.js application with QEWD, Part 4
EWD 3 Training Course Part 38: Building a React.js application with QEWD, Part 4EWD 3 Training Course Part 38: Building a React.js application with QEWD, Part 4
EWD 3 Training Course Part 38: Building a React.js application with QEWD, Part 4Rob Tweed
 
jQuery for beginners
jQuery for beginnersjQuery for beginners
jQuery for beginnersDivakar Gu
 
Construire une application JavaFX 8 avec gradle
Construire une application JavaFX 8 avec gradleConstruire une application JavaFX 8 avec gradle
Construire une application JavaFX 8 avec gradleThierry Wasylczenko
 
College management system.pptx
College management system.pptxCollege management system.pptx
College management system.pptxManujArora3
 
Integrating Wicket with Java EE 6
Integrating Wicket with Java EE 6Integrating Wicket with Java EE 6
Integrating Wicket with Java EE 6Michael Plöd
 
[Final] ReactJS presentation
[Final] ReactJS presentation[Final] ReactJS presentation
[Final] ReactJS presentation洪 鹏发
 

Similar to From Swing to JavaFX (20)

Javascript Frameworks for Joomla
Javascript Frameworks for JoomlaJavascript Frameworks for Joomla
Javascript Frameworks for Joomla
 
UNIT 5-JavaFX Event Handling, Controls and Components.pdf
UNIT 5-JavaFX Event Handling, Controls and Components.pdfUNIT 5-JavaFX Event Handling, Controls and Components.pdf
UNIT 5-JavaFX Event Handling, Controls and Components.pdf
 
React outbox
React outboxReact outbox
React outbox
 
Workshop 23: ReactJS, React & Redux testing
Workshop 23: ReactJS, React & Redux testingWorkshop 23: ReactJS, React & Redux testing
Workshop 23: ReactJS, React & Redux testing
 
Java!!!!!Create a program that authenticates username and password.pdf
Java!!!!!Create a program that authenticates username and password.pdfJava!!!!!Create a program that authenticates username and password.pdf
Java!!!!!Create a program that authenticates username and password.pdf
 
Adding a modern twist to legacy web applications
Adding a modern twist to legacy web applicationsAdding a modern twist to legacy web applications
Adding a modern twist to legacy web applications
 
EWD 3 Training Course Part 39: Building a React.js application with QEWD, Part 3
EWD 3 Training Course Part 39: Building a React.js application with QEWD, Part 3EWD 3 Training Course Part 39: Building a React.js application with QEWD, Part 3
EWD 3 Training Course Part 39: Building a React.js application with QEWD, Part 3
 
Backbone.js
Backbone.jsBackbone.js
Backbone.js
 
Advance Java Programs skeleton
Advance Java Programs skeletonAdvance Java Programs skeleton
Advance Java Programs skeleton
 
Overview Of Lift Framework
Overview Of Lift FrameworkOverview Of Lift Framework
Overview Of Lift Framework
 
Overview of The Scala Based Lift Web Framework
Overview of The Scala Based Lift Web FrameworkOverview of The Scala Based Lift Web Framework
Overview of The Scala Based Lift Web Framework
 
Scala based Lift Framework
Scala based Lift FrameworkScala based Lift Framework
Scala based Lift Framework
 
DataFX - JavaOne 2013
DataFX - JavaOne 2013DataFX - JavaOne 2013
DataFX - JavaOne 2013
 
EWD 3 Training Course Part 38: Building a React.js application with QEWD, Part 4
EWD 3 Training Course Part 38: Building a React.js application with QEWD, Part 4EWD 3 Training Course Part 38: Building a React.js application with QEWD, Part 4
EWD 3 Training Course Part 38: Building a React.js application with QEWD, Part 4
 
jQuery for beginners
jQuery for beginnersjQuery for beginners
jQuery for beginners
 
Construire une application JavaFX 8 avec gradle
Construire une application JavaFX 8 avec gradleConstruire une application JavaFX 8 avec gradle
Construire une application JavaFX 8 avec gradle
 
College management system.pptx
College management system.pptxCollege management system.pptx
College management system.pptx
 
Java fx
Java fxJava fx
Java fx
 
Integrating Wicket with Java EE 6
Integrating Wicket with Java EE 6Integrating Wicket with Java EE 6
Integrating Wicket with Java EE 6
 
[Final] ReactJS presentation
[Final] ReactJS presentation[Final] ReactJS presentation
[Final] ReactJS presentation
 

More from Yuichi Sakuraba

Vector API - Javaによるベクターコンピューティング
Vector API - JavaによるベクターコンピューティングVector API - Javaによるベクターコンピューティング
Vector API - JavaによるベクターコンピューティングYuichi Sakuraba
 
Oracle Code One - Java KeynoteとJava SE
Oracle Code One - Java KeynoteとJava SEOracle Code One - Java KeynoteとJava SE
Oracle Code One - Java KeynoteとJava SEYuichi Sakuraba
 
Project Loom + Project Panama
Project Loom + Project PanamaProject Loom + Project Panama
Project Loom + Project PanamaYuichi Sakuraba
 
Project Loom - 限定継続と軽量スレッド -
Project Loom - 限定継続と軽量スレッド - Project Loom - 限定継続と軽量スレッド -
Project Loom - 限定継続と軽量スレッド - Yuichi Sakuraba
 
Oracle Code One 報告会 Java SE Update
Oracle Code One 報告会 Java SE UpdateOracle Code One 報告会 Java SE Update
Oracle Code One 報告会 Java SE UpdateYuichi Sakuraba
 
今こそStream API入門
今こそStream API入門今こそStream API入門
今こそStream API入門Yuichi Sakuraba
 
Oracle Code One 報告会 Java SE Update
Oracle Code One 報告会 Java SE UpdateOracle Code One 報告会 Java SE Update
Oracle Code One 報告会 Java SE UpdateYuichi Sakuraba
 
Learn Language 2018 Java Language Update
Learn Language 2018 Java Language Update Learn Language 2018 Java Language Update
Learn Language 2018 Java Language Update Yuichi Sakuraba
 
Dockerに向けて、Javaもダイエット
Dockerに向けて、JavaもダイエットDockerに向けて、Javaもダイエット
Dockerに向けて、JavaもダイエットYuichi Sakuraba
 
Migration Guide to Java SE 10, and also Java SE 11
Migration Guide to Java SE 10, and also Java SE 11Migration Guide to Java SE 10, and also Java SE 11
Migration Guide to Java SE 10, and also Java SE 11Yuichi Sakuraba
 
琥珀色のJava - Project Amber -
琥珀色のJava - Project Amber -琥珀色のJava - Project Amber -
琥珀色のJava - Project Amber -Yuichi Sakuraba
 
Moving to Module: Issues & Solutions
Moving to Module: Issues & SolutionsMoving to Module: Issues & Solutions
Moving to Module: Issues & SolutionsYuichi Sakuraba
 
モジュール移行の課題と対策
モジュール移行の課題と対策モジュール移行の課題と対策
モジュール移行の課題と対策Yuichi Sakuraba
 
Project Jigsawと、ちょっとだけVector API
Project Jigsawと、ちょっとだけVector APIProject Jigsawと、ちょっとだけVector API
Project Jigsawと、ちょっとだけVector APIYuichi Sakuraba
 
Java SEの現在、過去 そして未来
Java SEの現在、過去 そして未来Java SEの現在、過去 そして未来
Java SEの現在、過去 そして未来Yuichi Sakuraba
 
Introduction of Project Jigsaw
Introduction of Project JigsawIntroduction of Project Jigsaw
Introduction of Project JigsawYuichi Sakuraba
 
Encouragement of Java SE 9
Encouragement of Java SE 9Encouragement of Java SE 9
Encouragement of Java SE 9Yuichi Sakuraba
 

More from Yuichi Sakuraba (20)

Vector API - Javaによるベクターコンピューティング
Vector API - JavaによるベクターコンピューティングVector API - Javaによるベクターコンピューティング
Vector API - Javaによるベクターコンピューティング
 
Oracle Code One - Java KeynoteとJava SE
Oracle Code One - Java KeynoteとJava SEOracle Code One - Java KeynoteとJava SE
Oracle Code One - Java KeynoteとJava SE
 
Project Loom + Project Panama
Project Loom + Project PanamaProject Loom + Project Panama
Project Loom + Project Panama
 
Project Loom - 限定継続と軽量スレッド -
Project Loom - 限定継続と軽量スレッド - Project Loom - 限定継続と軽量スレッド -
Project Loom - 限定継続と軽量スレッド -
 
Oracle Code One 報告会 Java SE Update
Oracle Code One 報告会 Java SE UpdateOracle Code One 報告会 Java SE Update
Oracle Code One 報告会 Java SE Update
 
今こそStream API入門
今こそStream API入門今こそStream API入門
今こそStream API入門
 
Oracle Code One 報告会 Java SE Update
Oracle Code One 報告会 Java SE UpdateOracle Code One 報告会 Java SE Update
Oracle Code One 報告会 Java SE Update
 
Learn Language 2018 Java Language Update
Learn Language 2018 Java Language Update Learn Language 2018 Java Language Update
Learn Language 2018 Java Language Update
 
Dockerに向けて、Javaもダイエット
Dockerに向けて、JavaもダイエットDockerに向けて、Javaもダイエット
Dockerに向けて、Javaもダイエット
 
What's New in Java
What's New in JavaWhat's New in Java
What's New in Java
 
Migration Guide to Java SE 10, and also Java SE 11
Migration Guide to Java SE 10, and also Java SE 11Migration Guide to Java SE 10, and also Java SE 11
Migration Guide to Java SE 10, and also Java SE 11
 
琥珀色のJava - Project Amber -
琥珀色のJava - Project Amber -琥珀色のJava - Project Amber -
琥珀色のJava - Project Amber -
 
Moving to Module: Issues & Solutions
Moving to Module: Issues & SolutionsMoving to Module: Issues & Solutions
Moving to Module: Issues & Solutions
 
モジュール移行の課題と対策
モジュール移行の課題と対策モジュール移行の課題と対策
モジュール移行の課題と対策
 
Project Jigsawと、ちょっとだけVector API
Project Jigsawと、ちょっとだけVector APIProject Jigsawと、ちょっとだけVector API
Project Jigsawと、ちょっとだけVector API
 
Java SE 9の全貌
Java SE 9の全貌Java SE 9の全貌
Java SE 9の全貌
 
Java SEの現在、過去 そして未来
Java SEの現在、過去 そして未来Java SEの現在、過去 そして未来
Java SEの現在、過去 そして未来
 
Java SE 9 のススメ
Java SE 9 のススメJava SE 9 のススメ
Java SE 9 のススメ
 
Introduction of Project Jigsaw
Introduction of Project JigsawIntroduction of Project Jigsaw
Introduction of Project Jigsaw
 
Encouragement of Java SE 9
Encouragement of Java SE 9Encouragement of Java SE 9
Encouragement of Java SE 9
 

Recently uploaded

unit 4 immunoblotting technique complete.pptx
unit 4 immunoblotting technique complete.pptxunit 4 immunoblotting technique complete.pptx
unit 4 immunoblotting technique complete.pptxBkGupta21
 
Generative AI for Technical Writer or Information Developers
Generative AI for Technical Writer or Information DevelopersGenerative AI for Technical Writer or Information Developers
Generative AI for Technical Writer or Information DevelopersRaghuram Pandurangan
 
DSPy a system for AI to Write Prompts and Do Fine Tuning
DSPy a system for AI to Write Prompts and Do Fine TuningDSPy a system for AI to Write Prompts and Do Fine Tuning
DSPy a system for AI to Write Prompts and Do Fine TuningLars Bell
 
SIP trunking in Janus @ Kamailio World 2024
SIP trunking in Janus @ Kamailio World 2024SIP trunking in Janus @ Kamailio World 2024
SIP trunking in Janus @ Kamailio World 2024Lorenzo Miniero
 
A Deep Dive on Passkeys: FIDO Paris Seminar.pptx
A Deep Dive on Passkeys: FIDO Paris Seminar.pptxA Deep Dive on Passkeys: FIDO Paris Seminar.pptx
A Deep Dive on Passkeys: FIDO Paris Seminar.pptxLoriGlavin3
 
Transcript: New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024Transcript: New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024BookNet Canada
 
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024BookNet Canada
 
The Ultimate Guide to Choosing WordPress Pros and Cons
The Ultimate Guide to Choosing WordPress Pros and ConsThe Ultimate Guide to Choosing WordPress Pros and Cons
The Ultimate Guide to Choosing WordPress Pros and ConsPixlogix Infotech
 
Advanced Computer Architecture – An Introduction
Advanced Computer Architecture – An IntroductionAdvanced Computer Architecture – An Introduction
Advanced Computer Architecture – An IntroductionDilum Bandara
 
Scanning the Internet for External Cloud Exposures via SSL Certs
Scanning the Internet for External Cloud Exposures via SSL CertsScanning the Internet for External Cloud Exposures via SSL Certs
Scanning the Internet for External Cloud Exposures via SSL CertsRizwan Syed
 
Take control of your SAP testing with UiPath Test Suite
Take control of your SAP testing with UiPath Test SuiteTake control of your SAP testing with UiPath Test Suite
Take control of your SAP testing with UiPath Test SuiteDianaGray10
 
TrustArc Webinar - How to Build Consumer Trust Through Data Privacy
TrustArc Webinar - How to Build Consumer Trust Through Data PrivacyTrustArc Webinar - How to Build Consumer Trust Through Data Privacy
TrustArc Webinar - How to Build Consumer Trust Through Data PrivacyTrustArc
 
TeamStation AI System Report LATAM IT Salaries 2024
TeamStation AI System Report LATAM IT Salaries 2024TeamStation AI System Report LATAM IT Salaries 2024
TeamStation AI System Report LATAM IT Salaries 2024Lonnie McRorey
 
Unleash Your Potential - Namagunga Girls Coding Club
Unleash Your Potential - Namagunga Girls Coding ClubUnleash Your Potential - Namagunga Girls Coding Club
Unleash Your Potential - Namagunga Girls Coding ClubKalema Edgar
 
What is DBT - The Ultimate Data Build Tool.pdf
What is DBT - The Ultimate Data Build Tool.pdfWhat is DBT - The Ultimate Data Build Tool.pdf
What is DBT - The Ultimate Data Build Tool.pdfMounikaPolabathina
 
From Family Reminiscence to Scholarly Archive .
From Family Reminiscence to Scholarly Archive .From Family Reminiscence to Scholarly Archive .
From Family Reminiscence to Scholarly Archive .Alan Dix
 
Hyperautomation and AI/ML: A Strategy for Digital Transformation Success.pdf
Hyperautomation and AI/ML: A Strategy for Digital Transformation Success.pdfHyperautomation and AI/ML: A Strategy for Digital Transformation Success.pdf
Hyperautomation and AI/ML: A Strategy for Digital Transformation Success.pdfPrecisely
 
Unraveling Multimodality with Large Language Models.pdf
Unraveling Multimodality with Large Language Models.pdfUnraveling Multimodality with Large Language Models.pdf
Unraveling Multimodality with Large Language Models.pdfAlex Barbosa Coqueiro
 
Moving Beyond Passwords: FIDO Paris Seminar.pdf
Moving Beyond Passwords: FIDO Paris Seminar.pdfMoving Beyond Passwords: FIDO Paris Seminar.pdf
Moving Beyond Passwords: FIDO Paris Seminar.pdfLoriGlavin3
 
Gen AI in Business - Global Trends Report 2024.pdf
Gen AI in Business - Global Trends Report 2024.pdfGen AI in Business - Global Trends Report 2024.pdf
Gen AI in Business - Global Trends Report 2024.pdfAddepto
 

Recently uploaded (20)

unit 4 immunoblotting technique complete.pptx
unit 4 immunoblotting technique complete.pptxunit 4 immunoblotting technique complete.pptx
unit 4 immunoblotting technique complete.pptx
 
Generative AI for Technical Writer or Information Developers
Generative AI for Technical Writer or Information DevelopersGenerative AI for Technical Writer or Information Developers
Generative AI for Technical Writer or Information Developers
 
DSPy a system for AI to Write Prompts and Do Fine Tuning
DSPy a system for AI to Write Prompts and Do Fine TuningDSPy a system for AI to Write Prompts and Do Fine Tuning
DSPy a system for AI to Write Prompts and Do Fine Tuning
 
SIP trunking in Janus @ Kamailio World 2024
SIP trunking in Janus @ Kamailio World 2024SIP trunking in Janus @ Kamailio World 2024
SIP trunking in Janus @ Kamailio World 2024
 
A Deep Dive on Passkeys: FIDO Paris Seminar.pptx
A Deep Dive on Passkeys: FIDO Paris Seminar.pptxA Deep Dive on Passkeys: FIDO Paris Seminar.pptx
A Deep Dive on Passkeys: FIDO Paris Seminar.pptx
 
Transcript: New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024Transcript: New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
 
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
 
The Ultimate Guide to Choosing WordPress Pros and Cons
The Ultimate Guide to Choosing WordPress Pros and ConsThe Ultimate Guide to Choosing WordPress Pros and Cons
The Ultimate Guide to Choosing WordPress Pros and Cons
 
Advanced Computer Architecture – An Introduction
Advanced Computer Architecture – An IntroductionAdvanced Computer Architecture – An Introduction
Advanced Computer Architecture – An Introduction
 
Scanning the Internet for External Cloud Exposures via SSL Certs
Scanning the Internet for External Cloud Exposures via SSL CertsScanning the Internet for External Cloud Exposures via SSL Certs
Scanning the Internet for External Cloud Exposures via SSL Certs
 
Take control of your SAP testing with UiPath Test Suite
Take control of your SAP testing with UiPath Test SuiteTake control of your SAP testing with UiPath Test Suite
Take control of your SAP testing with UiPath Test Suite
 
TrustArc Webinar - How to Build Consumer Trust Through Data Privacy
TrustArc Webinar - How to Build Consumer Trust Through Data PrivacyTrustArc Webinar - How to Build Consumer Trust Through Data Privacy
TrustArc Webinar - How to Build Consumer Trust Through Data Privacy
 
TeamStation AI System Report LATAM IT Salaries 2024
TeamStation AI System Report LATAM IT Salaries 2024TeamStation AI System Report LATAM IT Salaries 2024
TeamStation AI System Report LATAM IT Salaries 2024
 
Unleash Your Potential - Namagunga Girls Coding Club
Unleash Your Potential - Namagunga Girls Coding ClubUnleash Your Potential - Namagunga Girls Coding Club
Unleash Your Potential - Namagunga Girls Coding Club
 
What is DBT - The Ultimate Data Build Tool.pdf
What is DBT - The Ultimate Data Build Tool.pdfWhat is DBT - The Ultimate Data Build Tool.pdf
What is DBT - The Ultimate Data Build Tool.pdf
 
From Family Reminiscence to Scholarly Archive .
From Family Reminiscence to Scholarly Archive .From Family Reminiscence to Scholarly Archive .
From Family Reminiscence to Scholarly Archive .
 
Hyperautomation and AI/ML: A Strategy for Digital Transformation Success.pdf
Hyperautomation and AI/ML: A Strategy for Digital Transformation Success.pdfHyperautomation and AI/ML: A Strategy for Digital Transformation Success.pdf
Hyperautomation and AI/ML: A Strategy for Digital Transformation Success.pdf
 
Unraveling Multimodality with Large Language Models.pdf
Unraveling Multimodality with Large Language Models.pdfUnraveling Multimodality with Large Language Models.pdf
Unraveling Multimodality with Large Language Models.pdf
 
Moving Beyond Passwords: FIDO Paris Seminar.pdf
Moving Beyond Passwords: FIDO Paris Seminar.pdfMoving Beyond Passwords: FIDO Paris Seminar.pdf
Moving Beyond Passwords: FIDO Paris Seminar.pdf
 
Gen AI in Business - Global Trends Report 2024.pdf
Gen AI in Business - Global Trends Report 2024.pdfGen AI in Business - Global Trends Report 2024.pdf
Gen AI in Business - Global Trends Report 2024.pdf
 

From Swing to JavaFX

  • 1. From Swing To JavaFX - Migration Guide to JavaFX - Java in the Box Yuichi Sakuraba
  • 2.
  • 4. JavaFX Next Generation Java GUI Library Functionally Analogous: Swing+Java2D+α JavaSE8 includes JavaFX3.0
  • 5. public class Hello extends Application { @Override public void start(Stage stage) { // Create Container Group container = new Group(); // Create root of Scene Graph Scene scene = new Scene(container, 100, 20); stage.setScene(scene); // Create label and add it to Scene Graph Label label = new Label("Hello, World!"); container.getChildren().add(label); } stage.show(); SceneGraph public static void main(String[] args) { launch(args); } } Start JavaFX Application Thread
  • 6. Pitfalls Add to Container pane.add(comp); pane.getChildren().add(comp); Event Only One Event Listener: EventHandler button.setOnAction( new EventHandler<ActionEvent>() { public void handle(ActionEvent event) { // handling event } });
  • 7. Pitfalls View Observer Pattern Bind Model Swing Event Controller
  • 8. Pitfalls View Bind Model JavaFX Bind Controller
  • 9. Pitfalls View Bind Model JavaFX Bind Controller // Model object DoubleProperty xProperty = new DoubleProperty(); Slider slider = new Slider(50, 300, 0); // Bind slider property to model object xProperty.bind(slider.valueProperty()); Rectangle rect = new Rectangle(50, 10, 50, 30); // Bind model object to x property of rectangle rect.xProperty().bind(xProperty);
  • 10. Migration Scenarios Scenario #1 JavaFX in Swing Scenario #2 Swing to JavaFX w/o FXML Scenario #3 Swing to JavaFX w/ FXML
  • 11. JavaFX in Swing Embed JavaFX scene graph in Swing application No support for embedding Swing components into JavaFX applications Use features JavaFX only has with Swing
  • 12. JavaFX in Swing Embed JavaFX scene graph in Swing application No support for embedding Swing components into JavaFX applications Use features JavaFX only has Web Media with Swing Charts Animation
  • 13. JFXPanel JFXPanel is a Swing component that is compatible with JavaFX Add scene graph into JFXPanel final JFXPanel fxPanel = new JFXPanel(); Swing EDT jframe.add(fxPanel); Platform.runLater(new Runnable() { @Override public void run() { JavaFX App Thread AnchorPane root = new AnchorPane(); Scene scene = new Scene(root); root.getChildren().add(new Button("JavaFX Button")); fxPanel.setScene(scene); } });
  • 14. Swing to JavaFX w/o FXML Rewrite Swing as JavaFX Same concept, similar usage Label, Button, TextField, et al. Same concept, different usage Layout New concept TableView, TreeView, ListView
  • 15. Same concept, : Button similar usage Swing JButton = new JButton(”Swing”); button.addActionListener(new ActionListener() { @Override public void actionPerformed(new ActionEvent event) { // handling event } }); JavaFX Button = new Button(”JavaFX”); button.setOnAction(new EventHandler<ActionEvent>() { @Override public void handle(ActionEvent event) { // handling event } });
  • 16. Same concept, : Layout different usage Swing: Container+LayoutManeger JPanel panel = new JPanel(); panel.setLayout(new BorderLayout()); panel.add(comp, BorderLayout.CENTER); JavaFX: Container includes layout BorderPane pane = new BorderPane(); pane.setCenter(comp);
  • 17. New Concept: Table Swing: TableModel JavaFX: Bind Java Beans to Column class Student { ...... } // Java Bean & gradYear props {..} // Student has name TableView<Student> table = new TableView<>(); TableColumn col1 = new TableColumn("Name"); col1.setCellValueFactory( new PropertyValueFactory<Student, String>("name") ); TableColumn col2 = new TableColumn("Grad Year"); col2.setCellValueFactory( new PropertyValueFactory<Student, Integer>("gradYear") ); table.setItems(students); table.getColumns().addAll(col1, col2);
  • 18. Swing to JavaFX w/ FXML
  • 19. FXML Use XML to describe GUI structure FXML describes Scene Graph Schema-less Class: XML Element Property: XML Attribute or Element FXML read by Java application at run time
  • 20. ex. browser.fxml <AnchorPane prefHeight="400.0" prefWidth="600.0"> <children> <HBox alignment="CENTER" prefHeight="50.0" prefWidth="572.0" spacing="20.0"> <children> <TextField prefWidth="200.0" style="-fx-font-size: 24;" /> <Button style="-fx-font-size: 24;" text="Load" /> </children> </HBox> <WebView prefHeight="302.0" prefWidth="572.0" /> </children> </AnchorPane> AnchorPane pane = FXMLLoader.load( this.getClass().getResource("browser.fxml"));
  • 21. Linking FXML to Java ? View FXML Model Java Controller Java
  • 22. Linking FXML to Java View Controller Model FXML Java Java fx:id @FXML #method
  • 23. <AnchorPane xmlns:fx="http://javafx.com/fxml" fx:controller="contents.BrowserController"> <children> <HBox> <children> <TextField fx:id="textfield" /> <Button onAction="#handleAction" /> </children> </HBox> <WebView fx:id="webview" /> </children> public class BrowserController implements Initializable { </AnchorPane> @FXML private TextField textfield; @FXML private WebView webview; private WebEngine engine; @FXML public void handleAction(ActionEvent event) { engine.load(textfield.getText()); } @Override public void initialize(URL url, ResourceBundle rb) { engine = webview.getEngine(); } }
  • 24. <AnchorPane xmlns:fx="http://javafx.com/fxml" fx:controller="contents.BrowserController"> <children> <HBox> <children> <TextField fx:id="textfield" /> <Button onAction="#handleAction" /> </children> </HBox> <WebView fx:id="webview" /> </children> public class BrowserController implements Initializable { </AnchorPane> @FXML private TextField textfield; @FXML private WebView webview; private WebEngine engine; @FXML public void handleAction(ActionEvent event) { engine.load(textfield.getText()); } @Override public void initialize(URL url, ResourceBundle rb) { engine = webview.getEngine(); } }
  • 25. Tools Java NetBeans FXML Scene Builder
  • 26. Conclusion 3 migration scenarios Not so different from a Component-based UI standpoint FXML is a key feature No mention in this session CSS, Animaction, Effect Shape, Aysnc task
  • 27. From Swing To JavaFX - Migration Guide to JavaFX - Java in the Box Yuichi Sakuraba