Mis à jour le 05/10/2017
  • 4 heures
  • Facile

Ce cours est visible gratuitement en ligne.

Vous pouvez être accompagné et mentoré par un professeur particulier par visioconférence sur ce cours.

J'ai tout compris !

Notre outil : Netbeans

Connectez-vous ou inscrivez-vous gratuitement pour bénéficier de toutes les fonctionnalités de ce cours !

Le but de ce tutoriel est d'apprendre à développer des applications en JavaFX. Cette évolution du Java classique est assez récente, la première version a été créée en 2007 et depuis, de nombreuses évolutions ont eu lieu. La version actuelle de JavaFX est la version 2.0. Pour développer dans ce langage, nous allons utiliser le logiciel Netbeans (v7.0), c'est lui qui nous permettra de transformer notre code source en applications exécutables.

Je préfère vous prévenir tout de suite, l'installation est assez longue, ce sera peut être le chapitre le plus chiant de tout le tutoriel :p . On va devoir installer deux JRE, un JDK, un SDK, un plugin,... Bref, il y a beaucoup d'opérations à exécuter et il suffit que l'une d'elle soit mal faite pour qu'au final on n'arrive pas à compiler notre code... croyez en mon expérience :S J'essaierais pour ma part d'être le plus clair possible :) .

Création de notre environnement Java

Installation du JRE

Nous allons commencer par installer un élément que vous avez sûrement déjà : le JRE (Java Runtime Environnement). Vous savez... c'est ce qui permettra à votre ordinateur d'exécuter des applications Java. Si vous avez déjà un JRE sur votre ordinateur vous pouvez le mettre à jour, et s'il est à jour vous pouvez sauter cette étape...
Pour installer ou mettre à jour le JRE, rendez-vous sur le site de Java

Cliquez sur leur beau bouton :
Image utilisateur
Puis lancez l'installeur, qui devrait s'appeler jxpiinstall.exe (ce détail n'a aucune importance :p ) puis installer >> suivant >> fermer , je ne vais pas vous faire un screenshot pour ça ;) .

Installation du JRE pour JavaFX

En plus du JRE classique pour Java, nous devons aussi installer un JRE supplémentaire pour que notre ordinateur puisse exécuter les applications JavaFX. Pour ça, rendez-vous sur la page de téléchargement d'oracle et téléchargez le JavaFX 2.0 Beta Runtime pour votre plateforme. Dans mon cas ce sera Windows x86 :

Image utilisateur

On vous demandera de créer un compte si vous n'en avez pas déjà un. Je vous laisse le soin de remplir cette tâche hautement casse-pieds :p .

Puis là encore, lancez l'installeur, cela ne devrait prendre que quelques secondes...

Installation du JDK

Parfait, passons maintenant au téléchargement du JDK. Là encore, vous avez peut-être déjà un JDK sur votre ordinateur, dans ce cas vous pouvez le mettre à jour ou sauter cette étape si c'est déjà le cas.

On avait compris ce que c'était qu'un JRE, maintenant tu nous parles de JDK... c'est quoi ce truc??

Le JDK (Java Development Kit) est l'environnement dans lequel le code Java que nous produirons sera compilé pour être transformé en ByteCode compréhensible par le JRE que nous venons d'installer. Un peu compliqué mais ça se comprend :)
Pour cela, rendez-vous à la page de téléchargement et choisissez le JDK qui correspond à votre plateforme.

Pour moi c'est toujours Windows x86 :

Image utilisateur

Le téléchargement devrait commencer. Une fois terminé, vous pouvez lancer l'installation qui n'a rien d'extra-ordinaire : Next >> Next >> Finish.

Installation du SDK

Encore un acronyme bizarre : le SDK (Software Development Kit). Ce "kit" contient un ensemble d'outils qui nous permettront de développer nos applications en JavaFX. Pour le télécharger, rendez-vous à la page de téléchargement et choisissez la plateforme qui vous correspond. Pour moi c'est encore et toujours Windows x86 :p :

Image utilisateur

Après cela, vous devriez avoir téléchargé un dossier compressé nommé javafx_sdk-2_0-beta... Vous pouvez le décompresser et le ranger n'importe où dans vos dossier personnels, par exemple dans le dossier : C:\Program Files\Java. Puis vous pouvez ouvrir le dossier décompressé et exécuter l'installeur qu'il contient : javafx_sdk-2_0-beta...exe. Et cliquez sur Installer.

Parfait, notre environnement Java devrait maintenant être complet, on peut passer à Netbeans.

Installation de Netbeans

Nous allons maintenant installer notre outil de développement Netbeans, la version 7.0 pour être exact. Pour cela rendez-vous à la page de téléchargement, puis sélectionnez le pack de téléchargement pour la technologie Java SE :

Image utilisateur

Une fois l'installeur téléchargé, vous pouvez l'exécuter : Next >> Next >> Install >> Finish.
Vous avez maintenant Netbeans 7.0 installé sur votre ordinateur, mais il reste une étape avant d'avoir terminé notre installation. Il faut installer les plugins qui permettront à Netbeans de créer des applications JavaFX 2.0. Après ça c'est fini, promis ;) .

Commencer par télécharger les plugins à la page de téléchargement d'oracle :

Image utilisateur

Là encore, vous devriez avoir téléchargé un dossier compressé nommé javafx-2_0-beta-b32-netbeans... Vous pouvez extraire le dossier "updates" qu'il contient et le ranger dans vos dossiers personnels, par exemple : C:\Program Files\NetBeans 7.0.

Il ne nous reste plus qu'à installer ce plugin dans notre IDE Netbeans. Vous pouvez donc lancer Netbeans grâce à l'icône qui a dû être créé sur votre bureau.

Image utilisateur

Dans un premier temps, nous allons mettre à jour Netbeans. Pour cela, aller dans le menu Tools dans la barre de menu en haut de l'application puis sélectionnez Plugins.
Allez dans l'onglet Updates de la fenêtre qui apparaît et veillez à ce que tous les éléments soient cochés puis cliquez sur Update :

Image utilisateur

Et suivez les instructions de l'installation : Next >> Update >> Finish. Après cela, votre IDE devrait redémarrer.
Pour installer le plugin, retourner dans le menu Tools >> Plugins et allez cette fois dans l'onglet Downloaded.
Nous allons maintenant installer les plugins que nous avons téléchargés tout à l'heure. Pour cela cliquez sur le bouton Add Plugins... et allez dans le dossier "updates" que nous avons téléchargé (je l'avais rangé à l'adresse C:\Program Files\NetBeans 7.0\updates) :

Image utilisateur

On voit que notre dossier "updates" contient quatre fichiers d'extension NBM.
Si comme moi vous avez un système d'exploitation de type 32 bits, il devrait s'agir des fichiers suivants :

  • org-netbeans-modules-javafx2-kit.nbm

  • org-netbeans-modules-javafx2-lib-win.nbm

  • org-netbeans-modules-javafx2-project.nbm

  • org-netbeans-modules-javafx2-samples.nbm

Si par contre vous avez un système d'exploitation de type 64 bits, vous devriez avoir les fichiers suivants :

  • org-netbeans-modules-javafx2-kit.nbm

  • org-netbeans-modules-javafx2-lib-win64.nbm

  • org-netbeans-modules-javafx2-project.nbm

  • org-netbeans-modules-javafx2-samples.nbm

Vous pouvez donc ajouter ces quatre fichiers NBM, puis cliquez sur Install :

Image utilisateur

Et suivez les instructions de l'installation : Next >> Install >> Finish, puis fermez la fenêtre Plugins.
Pour clôturer cette suite d'installations bien casse-pieds... vous pouvez cliquer sur Close :) .

Vous êtes maintenant équipés pour créer des applications en JavaFX :). Ouf ! C'était un vrai parcours du combattant comme je vous l'avais promis, mais on a maintenant tout ce qu'il faut et on va pouvoir commencer à s'amuser ;) .

Découverte de Netbeans

Pour vérifier que tout marche bien, nous allons créer un projet Test que nous allons compiler. Pour créer un nouveau projet, allez dans l'item File de la barre de menu et sélectionnez New Project... ou Ctrl + Maj + N, ou encore cliquez sur l'icône :

Image utilisateur

Un fenêtre devrait apparaître pour nous permettre de choisir le type de projet que nous souhaitons créer. Pour créer une application JavaFX, dans la rubrique "Cathégorie" choisissez Java, puis dans la rubrique "Projects" choisissez Java FX Application. Et cliquez sur Next :

Image utilisateur

Puis entrez comme nom de projet : "Test" et cliquez sur Finish.
Voici ce qui devrait apparaître :

Image utilisateur
  • Dans l'encadré 1, vous pouvez voir tous les dossiers qui constituent notre projet. Pour l'instant il ne contient qu'un seul package test et une seule feuille de code Test.java.

  • Dans l'encadré 2, on voit la feuille Test.java toute prête à être éditée, ne vous souciez pas de ce qu'elle contient pour l'instant, nous y reviendrons plus tard.

  • Dans l'encadré 3 c'est la console, vous savez, c'est là qu'on affiche des informations avec la fonction System.out.println() (entre autres)

Tout ça n'a rien d'exceptionnel, c'est une interface similaire à celles que proposent la plupart des IDE, comme eclipse par exemple.

Vérifions maintenant que Netbeans est bien capable de compiler du code JavaFX. Pour cela, appuyez tout simplement sur le bouton Run Main Project en haut de la fenêtre :

Image utilisateur

ou appuyez sur la touche F6.
Netbeans devrait compiler notre projet Test et la fenêtre suivante devrait apparaître :

Image utilisateur

C'est la fenêtre de notre première application JavaFX. Félicitations ! Tout marche :D .

Bon... On est enfin prêt :) . Je vous promet que les chapitres suivant seront moins casse-pieds. On va pouvoir entrer dans le vif du sujet et apprendre à coder en JavaFX pour créer nos propres RIAs (Rich Internet Applications).

Pour nous détendre un peu, la prochaine partie ne sera qu'une présentation des possibilités offertes par JavaFX, il y aura plus d'images que de texte et vous n'aurez rien à faire ;) .

Exemple de certificat de réussite
Exemple de certificat de réussite