OpenJFX on Android and Devices

42,000 views

Published on

Presentation on deploying JavaFX applications to Android devices (and also iOS).

Published in: Technology
0 Comments
15 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
42,000
On SlideShare
0
From Embeds
0
Number of Embeds
201
Actions
Shares
0
Downloads
144
Comments
0
Likes
15
Embeds 0
No embeds

No notes for slide

OpenJFX on Android and Devices

  1. 1. 1 OpenJFX on Android and Devices Stephen Chin (@steveonjava) Java Technology Ambassador JavaOne Content Chair
  2. 2. 2 JavaFX on Android It is about time!
  3. 3. 3 Open Source Effort https://javafxports.org/
  4. 4. 4 • Cross-platform Animation, Video, Charting • Integrate Java, JavaScript, and HTML5 in the same application • New graphics stack takes advantage of hardware acceleration for 2D and 3D applications • Integrate in Swing applications using JFXPanel and SwingNode Immersive Application Experience JavaFX 2 Platform
  5. 5. 5 How to Get JavaFX  Step 1: Download Java 8
  6. 6. 6 How to Develop JavaFX Use Your Favorite IDE
  7. 7. 7 How to Deploy to Android Devices 1. Install the Android SDK / ADT 2. Download the JavaFX -Dalvik Runtime from: http://javafxports.org/ 3. Compile your JavaFX application for Android using Gradle As easy as 1… 2… 3
  8. 8. 8 Architecture of JavaFX 2 Java Virtual Machine Java2D Open GL D3D Prism Glass WinTk Media Engine Web Engine JavaFX Public API Quantum Toolkit
  9. 9. 9 Vanishing Circles
  10. 10. 10 Application Skeleton public class VanishingCircles extends Application { public static void main(String[] args) { Application.launch(args); } @Override public void start(Stage primaryStage) { primaryStage.setTitle("Vanishing Circles"); Group root = new Group(); Scene scene = new Scene(root, 800, 600, Color.BLACK); [create the circles…] root.getChildren().addAll(circles); primaryStage.setScene(scene); primaryStage.show(); [begin the animation…] } }
  11. 11. 11 Create the Circles List<Circle> circles = new ArrayList<Circle>(); for (int i = 0; i < 50; i++) { final Circle circle = new Circle(150); circle.setCenterX(Math.random() * 800); circle.setCenterY(Math.random() * 600); circle.setFill(new Color(Math.random(), Math.random(), Math.random(), .2)); circle.setEffect(new BoxBlur(10, 10, 3)); circle.setStroke(Color.WHITE); [setup binding…] [setup event listeners…] circles.add(circle); }
  12. 12. 12 Setup Binding circle.strokeWidthProperty().bind(Bindings .when(circle.hoverProperty()) .then(4) .otherwise(0) );
  13. 13. 13 Setup Event Listeners circle.addEventHandler(MouseEvent.MOUSE_CLICKED, new EventHandler<MouseEvent>() { public void handle(MouseEvent t) { KeyValue collapse = new KeyValue(circle.radiusProperty(), 0); new Timeline(new KeyFrame(Duration.seconds(3), collapse)).play(); } });
  14. 14. 14 Begin the Animation Timeline moveCircles = new Timeline(); for (Circle circle : circles) { KeyValue moveX = new KeyValue(circle.centerXProperty(), Math.random() * 800); KeyValue moveY = new KeyValue(circle.centerYProperty(), Math.random() * 600); moveCircles.getKeyFrames().add(new KeyFrame(Duration.seconds(40), moveX, moveY)); } moveCircles.play();
  15. 15. 15 MemeQuest: End-to-end JavaFX  Animations, Images, Binding, Controls on the Client  DataFX (http://www.javafxdata.org) for communication with DaliCloud back-end  User Interface: We need to stop Johan from doing User Interfaces. Who wants to help?  Code + downloads at http://bitbucket.org/lodgon/memequestfx
  16. 16. Layout Basics
  17. 17. 17 Built-in Layouts  AnchorPane  BorderPane  VBox/HBox  FlowPane  StackPane  TilePane  GridPane
  18. 18. 18 Built-in Layouts  AnchorPane  BorderPane  VBox/HBox  FlowPane  StackPane  TilePane  GridPane
  19. 19. 19 Built-in Layouts  AnchorPane  BorderPane  VBox/HBox  FlowPane  StackPane  TilePane  GridPane
  20. 20. 20 Built-in Layouts  AnchorPane  BorderPane  VBox/HBox  FlowPane  StackPane  TilePane  GridPane A B D E C
  21. 21. 21 Built-in Layouts  AnchorPane  BorderPane  VBox/HBox  FlowPane  StackPane  TilePane  GridPane
  22. 22. 22 Built-in Layouts  AnchorPane  BorderPane  VBox/HBox  FlowPane  StackPane  TilePane  GridPane
  23. 23. 23 Built-in Layouts  AnchorPane  BorderPane  VBox/HBox  FlowPane  StackPane  TilePane  GridPane
  24. 24. Controls
  25. 25. 25 Button Control  Simple Button Control  Add and remove click event handler  Support Cascading Style Sheets
  26. 26. 26 TextField Control  One line entry text field control  Set OnAction event handler  Can listen to individual key events  Support Cascading Style Sheets
  27. 27. 27 ListView Control  Displays a list of items  Reuses cells for performance  Default cell renderer can display Strings  For other object types – Create custom CellFactory
  28. 28. 28 TreeView Control  Displays a tree view of items  Can dynamically populate as tree is expanded  Default cell renderer can display Strings  For other object types – Create custom CellFactory
  29. 29. 29 ToolBar Demo  Toolbar displays items horizontally or vertically  Handles arbitrary number of items  Can add any node to the toolbar, including custom nodes  Automatic adds an overflow hint if cannot display all toolbar items
  30. 30. 30 Progress Bars and Indicators  Progress Bars can be laid out vertically and horizontally  Progress Indicator is a circular widget  Progress Bar and Indicator can be indefinite  Double property 0.0 <= x <= 1.0
  31. 31. 31 Accordion Control  Accordion is a space saving components  Accordian accept only TitledPanes  Each TitledPane managed one scenegraph node  Can choose the titled pane expanded by default
  32. 32. 32 TabPane Control  Alternative space saving component  Choose a side for the Tab  Each manages one component node  Tab pane has two modes: – floating – recessed
  33. 33. 33 DatePicker  Allows selection of dates and ranges  Can use custom formats and calendars  Supports Cascading Style Sheets
  34. 34. 34 TreeTableView  Combines a TreeView and a TableView  Optional menu for hiding and showing columns  Root can be hidden  Supports multiple selection  Supports CSS
  35. 35. 35 New Modena UI Theme
  36. 36. 36 Embedded Controls Theme
  37. 37. 37
  38. 38. 38 Build Applications Visually JavaFX Scene Builder 2
  39. 39. 39 RoboVM JavaFX on iOS + =
  40. 40. 40
  41. 41. 41 Stephen Chin tweet: @steveonjava blog: http://steveonjava.com nighthacking.com Real Geeks Live Hacking NightHacking Tour
  42. 42. 42 The preceding 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 decisions. The development, release, and timing of any features or functionality described for Oracle’s products remains at the sole discretion of Oracle.

×