+
Java FX
PiDev 3A – Sprint java
1
2
L’API JavaFX
A partir de Mars 2014, c’est l’outil officiel
de création d’interfaces graphiques (GUI)
Création de médias : audio et vidéos
Création des animations 2D/3D
+
+ 3
MVC : Model View Controller
Model: La structure logique des
données
View: Les interfaces utilisateurs
contenant des éléments graphiques
Controller: Assurer la
communication entre les Vues et
les Modèles
4
Stage VS Scene
Stage: Conteneur principal,
habituellement une fenêtre.
Scene: Conteneur des UI
+ elements, associé à un Stage.
+ GUI Java FX
5
XML Avec Java
Button btn = new Button();
<Button id="valider" fx:id="btn”
layoutX="405” layoutY="274” [Link]("Say 'Hello World");
text="Valider”>
<font>
<Font size="14.0" />
</font>
</Button>
Dans un fichier “.fxml”
Dans un fichier “.java”
+
Hello World
Téléchargez SceneBuilder de :
[Link]
builder/
6
+ 7
IntelliJ
NB: Vous devez télécharger la dernière version de l’IDE IntelliJ
File-> Settings -> Languages & Frameworks
Spécifiez le chemin d’installation vers le logiciel « SceneBuilder »
Ouvrez le fichier « [Link] » de votre projet.
Faites un clic droit sur le fichier et sélectionnez l'option « Generate …» dans le menu
contextuel.
+ 8
IntelliJ
- Choisissez « Dependency » dans la liste des options. Cela ouvrira une
fenêtre intitulée « Maven Artifact Search ».
- Dans l'onglet « Search For Artifact », saisissez «[Link]:javafx-
fxml» et choisissez la dernière version disponible.
- Dans l'onglet « Search For Artifact », saisissez «[Link]:javafx-
controls» et choisissez la dernière version disponible.
- Appuyez sur le bouton « Load Maven Changes » pour télécharger et
installer automatiquement la bibliothèque dans votre projet.
+ 9
IntelliJ
Faites un clic droit sur le le dossier « Resources », et créez un nouveau fichier fxml
Faites un clic droit sur le fichier fxml, et choisissez l’option « Open in Scene
Builder »
+ 10
IntelliJ
Exécution:
Ajoutez ce code dans votre fichier « [Link] »
<build>
<plugins>
<plugin>
<groupId>[Link]</groupId>
<artifactId>javafx-maven-plugin</artifactId>
<version>0.0.8</version>
<configuration>
<mainClass>[Link]</mainClass>
</configuration>
</plugin>
</plugins>
Remplacez « MainFX » par le nom de votre classe principale
</build>
Appuyez sur le bouton « Load Maven Changes » pour télécharger et installer automatiquement la bibliothèque
dans votre projet.
+ 11
IntelliJ
View -> Tool Windows -> Maven
Plugins -> javafx -> javafx:run
+ 12
Scene Builder
13
Dans le fichier .fxml :
Vous avez cliqué
Dans le contrôleur (une classe .java) :
public class MyController {
......
@FXML
public void initialize() {
[Link](e->{
[Link](“Vous avez cliqué");
});
}}
+
Navigation
14
15
@FXML
public void naviguerVersAjout(ActionEvent event){
try {
Parent root =
[Link](getClass().getResource("/[Link]");
[Link]().setRoot(root);
} catch (IOException ex) {
[Link]([Link]());
}
});
+
Insertion
dans la BD 16
+ 17
[Link](event -> {
Personne p = new Personne([Link](), [Link]());
PersonneService ps = new PersonneService();
[Link](p);
}
+ Les alertes - Dialogs
18
Information Dialog :
Alert alert = new Alert([Link]);
[Link]("Information Dialog");
[Link]("Personne insérée avec succés!");
[Link]();
+
TableView
ObservalbleList
19
+ Les Collections javaFX
20
ObsevableList
Observable
[i]
FXCollections
[c]
Classe utilitaire :
• observableArrayList()
ObservableList<E>
[i]
• observableHashMap()
• ObservalbleList : Une liste qui permet aux listeners de
détécter les changements en temp réel
21
TableView 22
@FXML
private TableView<Personne> personsTable;
@FXML
private TableColumn<Personne, String> NomColonne;
@FXML
private TableColumn<Personne, String> PrenomColonne;
@FXML
public void initialize() {
PersonneService ps = new PersonneService();
ObservableList<Personne> observableList = [Link]([Link]);
[Link](observableList);
// Remplir les colonnes :
[Link](cell -> new PropertyValueFactory<>("nom"));
[Link](cell ->new PropertyValueFactory<>("prenom");
}
+
CSS javaFX
[Link]
/jdk1.8.x/jre/lib/ext/[Link]
com/sun/javafx/scene/control/skin/modena/
23
24
Ajouter un fichier .css
Deux exemples de fichier .css :
• [Link]
• [Link]
+
Graphes
PieChart
25
26