TP. 1 SLAM 4 – Réalisation et maintenance de composants logiciels

Développement ’une application client-lourd en Java : CreditSIO.

L’application devra être livrée le 4 janvier 2021. Elle sera notée.

L’objectif de ce TP est de développer l’application « CreditSIO », déjà développée en #, en Java.

Ce TP est développé en couches de responsabilité : Présentation / Métier/ Modèle.

Il est décomposé en deux parties :

 Première partie : mode console. 2  Deuxième partie : mode fenêtré, développé avec JavaFX et SceneBuilder.

La base de données utilisée est celle contenant les procédures/fonctions stockées et les triggers sur laquelle nous avons travaillé en classe.

Le schéma de la base de données est le suivant :

Le diagramme des classes métiers est le suivant :

3

La navigation va de Compte vers Client : un attribut privé de type Client est créé dans la classe Compte.

Mais vous pouvez choisir de naviguer de Client vers Compte, en créant une collection de Compte dans la classe Client.

Attention : la classe Compte est une classe abstraite (son nom devrait être écrit en italique).

Avant de commencer…

Vous devez écouter la vidéo suivante sur JDBC : https://www.youtube.com/watch?v=W5yvqvxnRYk&feature=youtu.be

Vous devez ensuite lire les cours sur les packages et JDBC :

4

Vous devez maintenant créer le projet (mode console). Créez un package « presentation » : le programme principal « main » sera placé à l’intérieur :

Créez immédiatement deux autres packages : « metier » et « modele » :

5

Faire clic-droit sur « src », choisir « new » puis « package ».

Répétez l’opération pour créer le package « modele ».

Il faut maintenant installer JDBC. Cliquez sur « View », « Tools Windows », « Database » :

Cliquez sur « + », choisir « Data source », « mariadb » :

6

Cliquez sur « MariaDB » pour télécharger le driver :

7

Une dernière manipulation reste à faire : il faut installer la dépendance vers JDBC. Cela revient à créer une référence dans un projet C#.

Cliquez sur « File », « Project structure », la fenêtre suivante s’ouvre :

Cliquez sur « + » et choisir « JARs »

Il faut afficher les dossiers masqués et pointer sur le fichier « .jar » suivant :

8

Pour tester que le driver est bien installé et accessible, vous devez écrire le code suivant dans le programme principal :

9

Les exceptions doivent obligatoirement être gérées.

Exécutez le code. Vous devez obtenir un affichage semblable au résultat suivant :

Tests des classes en mode console

L’étape suivante consiste à développer des classes métiers et des classes d’accès aux données (DAO).

Au préalable, vous devez écouter la vidéo suivante : https://www.youtube.com/watch?v=Ty8414r7Bmk&feature=emb_logo 10 Les classes métiers et les classes d’accès aux données sont disponibles ici : http://192.168.100.232/beatricechataing/creditsiojava

Ajoutez ces classes dans votre projet, placez-les dans les bons packages. Ces classes devront être complétées par la suite (voir plus bas).

La JavaDoc.

Les classes fournies sont documentées avec l’outil « JavaDoc ». « JavaDoc » est un outil développé par Oracle permettant de créer une documentation au format HTML depuis les commentaires présents dans le code source.

Conçu à l'origine par Sun MicroSystems (avant son rachat par Oracle), javadoc est le standard industriel pour la documentation des classes Java. La plupart des IDE génèrent automatiquement la javadoc au format HTML.

Pour en savoir plus : https://fr.wikipedia.org/wiki/Javadoc ou encore https://openclassrooms.com/fr/courses/1115306-presentation-de-la-javadoc

Vous devez maintenant générer la Javadoc du projet.

Pour cela :

 Créez un répertoire « Javadoc » dans votre projet :

 Puis cliquez sur « Tools », « Generate JavaDoc » :

11

 Naviguez jusqu’au répertoire « Javadoc » et choisissez les options de génération de la documentation :

12

Cliquez sur « OK » : la documentation est générée, on peut naviguer entre les différentes classes :

Le code récupéré sur Gitlab contient l’ensemble des classes nécessaires pour afficher les clients, les comptes courants et les comptes épargnes.

Le programme principal a été mis à jour, il utilise les classes d’accès aux données :

13

Le résultat que vous devez obtenir est semblable à celui-ci :

Il faut que ce programme soit fonctionnel pour passer à la partie suivante : le développement d’interface homme- machine avec JavaFX.

JavaFX

Un peu d’histoire sur JavaFX (source : https://xebia.developpez.com/tutoriels/java/concepts-javafx-illustration- exemple/#LI) 14

Sun a sorti la première release stable de JavaFX en 2008. Son but était de concurrencer les environnements Silverlight de Microsoft et Flex d'Adobe. Le framework est également le remplaçant de , l'ancienne bibliothèque de composants graphiques de Java.

Depuis, Silverlight est mort et Flex a été donné à la fondation Apache en 2011.

De son côté, Oracle continue de faire évoluer JavaFX en lui donnant de nouvelles fonctionnalités et en le déployant sur iOS et Android.

Dans sa première version, JavaFX ne permettait pas de développer en Java ; il fallait passer par le langage JavaFX Script. Celui-ci fut abandonné à partir de JavaFX 2. Toutefois, le framework ne faisait toujours pas partie du JDK par défaut, imposant des manipulations supplémentaires pour déployer une application JavaFX.

JavaFX est entièrement intégré au JDK, jusqu’à la version 10, ce qui simplifie son déploiement, surtout sur des systèmes embarqués. De plus, depuis cette version, JavaFX a été « opensourcé », ce qui aide grandement au développement.

Mais ce n’est plus le cas à partir de la version 11, ce qui signifie qu’il faudra le télécharger pour notre projet.

Téléchargement et installation.

Il faut se rendre ici pour le télécharger : https://gluonhq.com/products/javafx/

Déroulez jusqu’à « latest release » et choisir la version 15.0.1 :

15

Créez un répertoire « desktop » dans le dossier suivant :

Dé-zippez l’archive dans ce dossier. Vous devez obtenir :

16

Création du projet.

Créez un nouveau projet JavaFX dans IntelliJ :

Comme ce projet ne sert qu’à faire des essais, nommez-le « JavaFXStep1 » :

17

Comme le répertoire n’existe pas, IntelliJ propose de le créer :

Cliquez sur « Create ».

Il faut maintenant ajouter la librairie JavaFX au projet.

Pour cela, cliquez sur « File », « Project Structure » :

18

Ensuite, cliquez sur « + » et choisir « Java » :

Naviguez jusqu’au répertoire « lib » du JavaFX SDK téléchargé préalablement :

19 Affichez les dossiers masqués pour voir « AppData »

Confirmez :

Ensuite, cliquez sur « Apply » pour appliquer les changements au projet :

Fermez la fenêtre en cliquant sur « OK ».

Le projet est créé avec une application « Hello World » à titre d’exemple :

20

Le projet n’est cependant pas encore tout à fait fonctionnel ; si vous exécutez le main, vous obtiendrez l’erreur suivante :

21

Il reste une dernière manipulation à faire : choisir « Run », « Edit Configurations » :

Dans la zone de texte « VM options », entrez le path suivant :

--module-path "C:\Users\Administrateur\AppData\Roaming\JetBrains\IntelliJIdea2020.2\desktop\javafx-sdk- 15.0.1\lib" --add-modules javafx.controls,javafx.fxml

22

Cliquez sur « Apply », puis « OK ».

Vous pouvez maintenant exécuter le main, vous obtiendrez la fenêtre suivante :

Ce qu’il faut comprendre du code fourni :

23

- La méthode « Start » est le point d’entrée d’une application JavaFX. - La classe Stage représente la fenêtre : c’est le container le plus haut. - La classe Scene représente le container des différents contrôles qui seront posés ; il est inclus dans « Stage ». Deux fichiers pdf sont déposés sur Teams pour essayer d’y voir plus clair…

Premières manipulations.

La réalisation de cette partie s’appuie sur le tutoriel suivant : https://docs.oracle.com/javafx/2/get_started/jfxpub-get_started.htm

On modifie le code précédent afin d’ajouter un bouton. Un clic sur ce bouton affichera « Hello World » dans la console.

24

Ici, on définit un évènement pour ce bouton. Sur clic, on affiche le message dans la console.

Avant d’exécuter ce programme, il faut ajouter un certain nombre de librairies (avec Alt+Majuscule+Entrée lorsque la souris est placée sur l’instruction en rouge) :

Exécutez ce programme, vous obtenez le résultat suivant :

25

Ce projet est terminé. Créez une première version avec Git : faire un commit vers la branche Master. Inutile de le pousser vers Gitlab.

Créez maintenant une branche (par exemple : version_2) et positionnez-vous dessus.

Vous devez modifier le code précédent, afin d’obtenir la fenêtre suivante :

26

Les instructions pour la construire sont ici : https://docs.oracle.com/javafx/2/get_started/form.htm

Cette méthode de construction de formulaire est plutôt laborieuse. Il existe une alternative : l’utilisation de Scene builder.

Scene builder est un outil interactif de conception d’interfaces graphiques pour JavaFX. Il permet de construire rapidement des interfaces utilisateurs sans avoir besoin de coder.

La découverte de JavaFX étant terminée, faire un commit du code que vous venez d’écrire. Inutile de le pousser sur GitLab. Créez une nouvelle branche, que vous pouvez nommer « version_3 » et positionnez-vous dessus. Sur cette branche sera stocké la version du projet utilisant Scene Builder.

Scene Builder

Scene Builder est un outil indépendant d’IntelliJ, il faut donc le télécharger et l’installer.

Téléchargement : https://gluonhq.com/products/scene-builder/

Choisir la version 11 :

27

Une fois Scene Builder installé, il faut paramétrer Intellij afin qu’il soit intégré à l’IDE. Cliquez sur « Files », choisir « Settings » :

Dans la partie « Languages and Framework », choisissez « JavaFX » :

28

Indiquez le chemin d’accès à l’exécutable de Scene Builder. Cliquez ensuite sur « Apply » puis sur « OK ».

Cette vidéo explique comment paramétrer IntelliJ pour qu’il utilise JavaFX et Scene Builder, et montre comment créer un formulaire simple avec un bouton qui, lorsqu’il est cliqué, permet l’affichage d’un texte dans un label. https://www.youtube.com/watch?v=RyTn2zGO0e0

Réalisez ce formulaire.

Faites un commit de ce projet, puis fermez-le. Nos prochaines manipulations concernent l’application « CreditSIO ».

CreditSIO avec Scene Builder

Créez un nouveau projet « JavaFX ».

Ce projet se crée avec un package « Sample » : supprimez-le. Supprimez également la configuration correspondante, car elle lance l’application « Sample » : cliquez sur « Run », « Edit configurations » :

29

Cliquez sur « Apply » puis sur « OK ».

Ajoutez le module JavaFx au projet : voir ci-dessus, page 18.

Créez les packages « metier », « modele » et « vue », dans le package « CreditSio ».

30 Copiez les classes métiers et les classes d’accès aux données du projet mode console. Placez-les dans les bons packages.

La classe MainApp n’est pas présente pour le moment, elle sera créée plus tard.

Copiez le fichier de configuration « config.properties » :

Comme « Sample » a été supprimé (il contenait le programme de démarrage « main »), il faut créer une application « JavaFX » ; pour cela :

o Faire clic droit sur le package « CreditSio », sélectionnez « new ». o Choisir « JavaFX Application » :

31

- Nommez l’application « MainApp ». - Créez immédiatement une configuration pour l’application : cliquez sur « run », « Edit configurations » :

N’oubliez pas de renseigner les « VM 32 options ».

Il existe de nombreux tutoriels pour Scene Builder sur la toile.

Avant de débuter, lisez les deux documents pdf accompagnant ce TP.

Vous pourrez ensuite poursuivre avec celui-ci : https://docs.oracle.com/javase/8/scene-builder-2/get-started- tutorial/jfxsb-get_started.htm

Les cas d’utilisation de l’application sont les suivants :

- L’utilisateur s’identifie : il n’y a que deux types d’utilisateurs : le client ou le conseiller financier. Leurs login/mot de passe peuvent être stockés dans le fichier de configuration. - Si l’utilisateur connecté est le client :

o Il visualise tous ses comptes, o Il visualise le détail d’un de ses comptes, o Effectue un dépôt ou un retrait. - Si l’utilisateur connecté est le conseiller financier :

o Il visualise la liste de tous les clients, o Il visualise tous les comptes d’un client en particulier, o Il visualise le détail d’un compte d’un client en particulier, o Il effectue des opérations de dépôt et de retrait sur le compte d’un client en particulier, o Il administre les clients : ajout/modification/suppression, o Il administre les comptes : ajout/modification/suppression.

33

L’application débutera donc avec un formulaire pour s’identifier :

A vous d’imaginer la suite…

Pour une bonne organisation du projet et pour ne pas « mettre du vernis sur les ongles du bébé alors qu’il n’a pas de bras » :

- Complétez les DAO pour l’administration des clients et des comptes (ajout/modification/suppression). - Rappels : un compte est soit compte courant, soit compte épargne (X) et rien d’autre (T). - Testez-les dans un programme mode console. - Créez le formulaire de connexion, puis testez-le : comme il n’y a que deux types d’utilisateurs (client et conseiller), vous pouvez faire simple et enregistrer leurs logins et mots de passe dans le fichier de configuration, plutôt que les stocker dans une table. - Créez et testez les formulaires affichant les données (liste des clients, liste des comptes d’un client en particulier, affichage du compte d’un client en particulier).

- Créez et testez les formulaires permettant d’administrer les tables client et compte (ajout/modification/suppression).

L’application devra être livrée le 4 janvier 2021. Elle sera notée.

34