JavaFx overview

20
Nouveau et cool! hnologies coté client javaFX BENZOUACHE Hani

Transcript of JavaFx overview

Page 1: JavaFx overview

Nouveau et cool!

Technologies coté client javaFX

BENZOUACHE Hani

Page 2: JavaFx overview

Agenda

Introduction

C’est quoi javaFX?

La plateforme javaFX

Démonstration

What’s next?

Page 3: JavaFx overview

Java supporte-elle le développement des applications clientes riches ?

Oui…..mais !

Page 4: JavaFx overview

JavaFx simplifie le développement des applications clientes riches

Page 5: JavaFx overview

C’est quoi javaFX?

JavaFx, est l'évolution de la plate-forme client Java conçu pour permettre aux développeurs d'applications de créer et de déployer facilement des applications clients riches qui se comportent toujours sur de multiples plateformes.

‘‘

,,

Page 6: JavaFx overview

La plateforme JavaFx

Page 7: JavaFx overview

Pourquoi utiliser JavaFx?

Plateforme client riche

intuitive

Préserver son

investissement

Fonctionnalité cross-

browser

Intégration en

entreprise

RIAs for all

screens

• Desktop• Navigate

ur• Mobile• TV{

Page 8: JavaFx overview

Demonstration

Structure à base d’arbre ‘’Scene graph• Graphe acyclique orienté• Les parents et les fils• Représentation des composants GUI

les principaux nœuds de chaque arbre sont• Stage: la fenêtre d'accueil de l'application• Scene: les canevas, où les composants

montrent

Tous les composants et éléments graphiques sont placés dans la scène

Page 9: JavaFx overview

Demonstration

Page 10: JavaFx overview

Demonstration

Group (root)

AnchorPane

TextField

Button

ListView

Page 11: JavaFx overview

Demonstration

Entry-Point

LoginExample.java

User interface

LoginExample.fxml

Contrôleur

LoginController.java

Interface style

LoginExample.css

Page 12: JavaFx overview

Demonstration

LoginExample.java

@Override public void start(Stage stage) throws Exception { Parent root = FXMLLoader.load(getClass().getResource("fxml_example.fxml")); Scene scene = new Scene(root, 300, 275); stage.setTitle("FXML Welcome"); stage.setScene(scene); stage.show(); }

Page 13: JavaFx overview

Demonstration

LoginExample.fxml

<GridPane fx:controller="fxmlexample.FXMLExampleController" xmlns:fx="http://javafx.com/fxml" alignment="center" hgap="10" vgap="10"> <padding><Insets top="25" right="25" bottom="10" left="25"/></padding> <Text text="Welcome" GridPane.columnIndex="0" GridPane.rowIndex="0" GridPane.columnSpan="2"/> <Label text="User Name:" GridPane.columnIndex="0" GridPane.rowIndex="1"/> <TextField GridPane.columnIndex="1" GridPane.rowIndex="1"/> <Label text="Password:" GridPane.columnIndex="0" GridPane.rowIndex="2"/> <PasswordField fx:id="passwordField" GridPane.columnIndex="1" GridPane.rowIndex="2"/> </GridPane>

Page 14: JavaFx overview

Demonstration

LoginExample.fxml....

<HBox spacing="10" alignment="bottom_right" GridPane.columnIndex="1" GridPane.rowIndex="4"> <Button text="Sign In" onAction="#handleSubmitButtonAction"/> </HBox> <Text fx:id="actiontarget" GridPane.columnIndex="1" GridPane.rowIndex="6"/> </Gridpane>

LoginController.java

public class FXMLExampleController { @FXML private Text actiontarget; @FXML protected void handleSubmitButtonAction(ActionEvent event) { actiontarget.setText("Sign in button pressed"); } }

Page 15: JavaFx overview

Demonstration

LoginExample.fxml..

<stylesheets> <URL value="@Login.css" /> </stylesheets> </GridPane>

Login.css

root { display: block; } .root { -fx-background-image: url("background.jpg"); } .label { -fx-font-size: 12px; -fx-font-weight: bold; -fx-text-fill: #333333; -fx-effect: dropshadow( gaussian …………………………………

Page 16: JavaFx overview

Scene BuilderJavaFX Scene Builder

• Outil pour construire les UIs.• Code FXML généré

automatiquement.

Page 17: JavaFx overview

Scene BuilderDrag&Drop

Intégration avec l'EDI

Edition preview en temps réel

Page 18: JavaFx overview

And more…Ensemble

• Galerie de plus de 100 exemples d'applications.

Page 19: JavaFx overview

What next ?

8

JavaFx 3DLambda expression

Rich Text

Public API for CSSPrinting Support

Swing Node

DatePickerTree Table Control

Page 20: JavaFx overview

Questions !!