Your SlideShare is downloading. ×
0
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
JavaFX - Jetzt nun doch oder besser nicht?
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 - Jetzt nun doch oder besser nicht?

1,515

Published on

Und ewig grüßt das Murmeltier: Zum wiederholten Male tritt JavaFX an, die Java-UI-Welt zu (r)evolutionieren. Würde nicht Oracle mit seiner geballten Macht dahinter stehen, könnte man diese Ankündigung …

Und ewig grüßt das Murmeltier: Zum wiederholten Male tritt JavaFX an, die Java-UI-Welt zu (r)evolutionieren. Würde nicht Oracle mit seiner geballten Macht dahinter stehen, könnte man diese Ankündigung getrost ignorieren – aber so? Die Session zeigt die neuen Ansätze von JavaFX 2 und warum es doch zu einem Erfolg werden könnte. Und das auf (fast) allen Plattformen – Desktop, Web und Mobile.

Speaker: Lars Röwekamp

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

  • Be the first to like this

No Downloads
Views
Total Views
1,515
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
22
Comments
0
Likes
0
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

Transcript

  • 1. JavaFx 2.0 Lars Röwekamp | open knowledge GmbH@mobileLarson@_openKnowledge
  • 2. 775 JavaFx History JavaOne: JavaOne: Java UI Welt ist noch in gewohnter Zweite JavaFX JavaFX 1.2 Ordnung Ankünding Launch (Swing, SWT) Preview SDK Mobile Runtine (WM)2006 2007 2008 2009 2010 Mobile a.k.a. JavaFX 1.1 JavaOne: JavaFX 1.0: JavaFX 1.3: Erste JavaFX Launch Preview Ankünding (a.k.a. F3)
  • 3. 775 JavaFx History JavaOne: JavaOne: Java UI Welt ist noch in gewohnter Zweite JavaFX JavaFX 1.2 Ordnung Ankünding Launch (Swing, SWT) Preview SDK Mobile Runtine (WM)2006 2007 2008 2009 2010 Mobile a.k.a. JavaFX 1.1 JavaOne: JavaFX 1.0: JavaFX 1.3: Erste JavaFX Launch Preview Ankünding (a.k.a. F3)
  • 4. 775JavaFx 2.0
  • 5. 775 JavaFx 2.0JavaFX 2.0 is the next step in the evolution ofJava as a rich client platform. It is designed toprovide a modern Java environment thatshortens the development time and eases thedeployment of data driven business andenterprise client applications. Starting withversion 2.0, JavaFX applications are completelydeveloped in Java, which has becomeubiquitous with over 9 million developersworldwide.
  • 6. 775 JavaFx 2.0JavaFX 2.0 is the next step in the evolution ofJava as a rich client platform. It is designed toprovide a modern Java environment thatshortens the development time and eases thedeployment of data driven business andenterprise client applications. Starting withversion 2.0, JavaFX applications are completelydeveloped in Java, which has becomeubiquitous with over 9 million developersworldwide.
  • 7. 775 ?
  • 8. 775 JavaFx UI DesignHot `r Not ? Tooling
  • 9. 775 JavaFx UI DesignHot `r Not ? Tooling
  • 10. 775Demo(s)
  • 11. 775JavaFx 2.0
  • 12. 775
  • 13. 775JavaFx 2.0
  • 14. 775 JavaFx 2.0(Quelle: fxexperience)
  • 15. 775JavaFx 2.0
  • 16. 775JavaFx 2.0
  • 17. 775JavaFx 2.0
  • 18. 775 JavaFx 2.0> Java API for JavaFX> Built-in UI Controls & Charts> Graphic Engine> Media Engine> Web Engine> „kind of“ Open Source
  • 19. 775JavaFx 2.0
  • 20. 775Kickstart
  • 21. 775Kickstart
  • 22. 775Kickstart
  • 23. 775 Kickstart> JavaFX Application> Stages & Scenes> Groups & Nodes> Effects & Animations
  • 24. 775 Kickstart// CREATE AN APPLICATIONpublic class ColorfulCircles extends Application { public static void main(String[] args) { launch(args); } @Override public void start(Stage primaryStage) { primaryStage.show(); }}
  • 25. 775Kickstart
  • 26. 775 Kickstart// ADD A SCENEpublic class ColorfulCircles extends Application { public static void main(String[] args) { launch(args); } @Override public void start(Stage primarystage) { Group root = new Group(); Scene scene = new Scene(root, 800, 600, Color.BLACK); primaryStage.setScene(scene); primaryStage.show(); }}
  • 27. 775Kickstart
  • 28. 775 Kickstart// ADD SOME GRAPHICS@Overridepublic void start(Stage primarystage) { ... // scene with root already set // add 30 circles Group circles = new Group(); for (int i = 0; i < 30; i++) { Circle circle = new Circle(150, Color.web("white",0.05)); circle.setStrokeType(StrokeType.OUTSIDE); circle.setStroke(Color.web("white", 0.16)); circle.setStrokeWidth(4); circles.getChildren().add(circle); } root.getChrildren().add(circles); primaryStage.show();}
  • 29. 775Kickstart
  • 30. 775 Kickstart// ADD VISUAL EFFECTS@Overridepublic void start(Stage primarystage) { ... Group circles = new Group(); for (int i = 0; i < 30; i++) { ... circles.getChildren().add(circle); } circles.setEffect(new BoxBlur(10, 10, 3)); root.getChrildren().add(circles); primaryStage.show();}
  • 31. 775Kickstart
  • 32. 775 Kickstart// ADD GRADIENTRectangle colors = new Rectangle(scene.getWidth(), scene.getHeight(), new LinearGradient(0f, 1f, 1f, 0f, true, CycleMethod.NO_CYCLE, new Stop[]{ new Stop(0, Color.web("#f8bd55")), new Stop(0.14, Color.web("#c0fe56")), new Stop(0.28, Color.web("#5dfbc1")), new Stop(0.43, Color.web("#64c2f8")), new Stop(0.57, Color.web("#be4af7")), new Stop(0.71, Color.web("#ed5fc2")), new Stop(0.85, Color.web("#ef504c")), new Stop(1, Color.web("#f2660f")),}));root.getChildren().add(colors);
  • 33. 775Kickstart
  • 34. 775Kickstart
  • 35. 775 Kickstartroot.getChildren().add(colors);root.getChildren().add(circles);// APPLY A BLEND MODEGroup blendModeGroup = new Group(new Group(new Rectangle(scene.getWidth(), scene.getHeight(),Color.BLACK), circles), colors);colors.setBlendMode(BlendMode.OVERLAY);root.getChildren().add(blendModeGroup);primaryStage.show();
  • 36. 775Kickstart
  • 37. 775Kickstart
  • 38. 775 Kickstart// ADD ANIMATIONTimeline timeline = new Timeline();for (Node circle: circles.getChildren()) { timeline.getKeyFrames().addAll( new KeyFrame(Duration.ZERO, // set start pos at 0 new KeyValue(circle.translateXProperty(), random() * 800), new KeyValue(circle.translateYProperty(), random() * 600) ), new KeyFrame(new Duration(40000), // set end pos at 40s new KeyValue(circle.translateXProperty(), random() * 800), new KeyValue(circle.translateYProperty(), random() * 600) ) );}// play 40s of animationtimeline.play();
  • 39. 775Kickstart
  • 40. 775 JavaFx UI DesignHot `r Not ? Tooling
  • 41. 775 UI Design ToolingJavaFx ? Hot `r Not
  • 42. 775 UI Design> 50+ Build-In Controls & Layouts> Model/View-Binding> Event Handling> Drag & Drop Support> Effects & Animations> FXML & CSS 3
  • 43. 775UI Controls
  • 44. 775 UI Controls> Label ... HTMLEditor ... Charts> extends Node> Animation, Effects, Transformation> Styling via CSS> Integration with Swing ( & SWT)
  • 45. 775 (UI) Binding> via Property & Binding Classes > IntegerProperty, DoubleProperty ... > Bindings, NumberBindings, ...> via Observable & Listener > Observable, ObservableValue > Change- & InvalidationListener > Lists, Maps, Collections
  • 46. 775(UI) Binding
  • 47. 775 (UI) Binding// String bindingLabel label = new Label();label.textProperty().bind(new StringBinding() { { bind(dateField.textProperty()); } @Override protected String computeValue() { Date date = format.parse(dateField.getText()); return "You were born " + format.format(date); }});
  • 48. 775 Event Handling> Drag, Key, Mouse, Scroll ...> EventHandler, EventFilter> Event Delivery Process > Target Selection > Route Construction > Event Capturing > Event Bubbling
  • 49. 775Effects & Animations > Blend, Bloom, Blur > Shadows, Reflection, Lighting > Translation, Rotation, Scaling > Transition, Timelines, Keyframes > Effect Chains
  • 50. 775 Effects & Animations(Quelle: glyphsoft)
  • 51. 775 FXML & CSS 3> UI Deklaration> XML-based, Scriptable> Controller „Binding“> Action „Binding“> @FXML Annotation
  • 52. 775Kickstart II
  • 53. 775 FXML & CSS 3(Quelle: glyphsoft)
  • 54. 775 FXML & CSS 3> UI Declaration
  • 55. 775 FXML & CSS 3<?xml version="1.0" encoding="UTF-8"?><?import javafx.scene.layout.*?>...<BorderPane xmlns:fx="http://javafx.com/fxml"> <top> ... </top> <center> <GridPane ... > <children> ... </children> </GridPane> </center></BorderPane>> UI Declaration
  • 56. 775 FXML & CSS 3> Controller & Action Binding
  • 57. 775 FXML & CSS 3<?xml version="1.0" encoding="UTF-8"?><?import javafx.scene.layout.*?>...<BorderPane fx:controller="Controller" xmlns:fx="http://javafx.com/fxml"> ... <Button fx:id="submitButton" text="%submit" onAction="#handleSubmitButtonAction"/> ...</BorderPane>> Controller & Action Binding
  • 58. 775 FXML & CSS 3> Scripting Language
  • 59. 775 FXML & CSS 3 <?xml version="1.0" encoding="UTF-8"?> <?language javascript?> <?import javafx.scene.layout.*?> ... <BorderPane fx:controller="Controller" xmlns:fx="http://javafx.com/fxml"> <fx:script source="demo.js" /> ... </BorderPane>> Scripting Language
  • 60. 775 FXML & CSS 3> CSS 3
  • 61. 775 UI Design ToolingJavaFx ? Hot `r Not
  • 62. 775 ToolingUI Design Hot `r Not ? JavaFx
  • 63. 775 TOOLING> NetBeans 7.x> Eclipse> IntelliJ Idea
  • 64. 775 TOOLING> NetBeans 7.x> Eclipse> IntelliJ Idea> JavaFX SceneBuilder
  • 65. 775SceneBuilder
  • 66. 775 ToolingUI Design Hot `r Not ? JavaFx
  • 67. 775 Hot `r NotTooling JavaFx ? UI Design
  • 68. JavaFx 2.0
  • 69. 775
  • 70. 775 > Improved UI Controls & Charts > Data Service Support > Enhancements to WebView > Modularization > Mulit-Touch & Sensor Support

×