IdentifiantMot de passe
Mot de passe oubli� ?Je m'inscris ! (gratuit)
logo

FAQ JavaFXConsultez toutes les FAQ

Nombre d'auteurs : 4, nombre de questions : 507, derni�re mise � jour : 2 novembre 2016  Ajouter une question

 

Cette FAQ a �t� r�alis�e � partir des questions fr�quemment pos�es sur le forum JavaFX de http://java.developpez.com ainsi que l'exp�rience personnelle des auteurs.

Nous tenons � souligner que cette FAQ ne garantit en aucun cas que les informations qu'elle propose sont correctes. Les auteurs font leur maximum, mais l'erreur est humaine. Cette FAQ ne pr�tend pas non plus �tre compl�te. Si vous trouvez une erreur, ou que vous souhaitez nous aider en devenant r�dacteur, lisez ceci.

Sur ce, nous vous souhaitons une bonne lecture.

Sommaire →SceneGraph →FXML et SceneBuilder (27)
pr�c�dent sommaire suivant
 
HautPage
Qu'est-ce que le FXML ?

Le FXML est un format de fichier propre � JavaFX et servant, entre autres, � d�finir des interfaces graphiques. Ce format utilise tout simplement une syntaxe XML.

Prenons par exemple le fichier FXML suivant :

Code XML : S�lectionner tout 
1
2
3
4
5
6
7
8
<?xml version="1.0" encoding="UTF-8"?> 
  
<?import java.lang.*?> 
<?import java.util.*?> 
<?import javafx.scene.*?> 
<?import javafx.scene.layout.*?> 
  
<AnchorPane id="AnchorPane" prefHeight="400.0" prefWidth="600.0" xmlns:fx="http://javafx.com/fxml/1" xmlns="http://javafx.com/javafx/8"/>

Ici, les directives <?import?> servent � importer des packages Java pr�sents sur le CLASSPATH, permettant de r�soudre le nom court des classes. Comme en Java les directives d'importation sont optionnelles : il est possible de d�finir des objets en utilisant le nom long de la classe au lieu du nom court.

Ce code d�finit ensuite un unique gestionnaire de mise en page de type AnchorPane d�fini dans un �l�ment XML du m�me nom. Les propri�t�s id, prefWidth et prefHeight de ce n�ud graphique sont d�finies ici par les attributs idoines.

Les attributs xmlns et xmlns:fx ne peuvent exister que sur l��l�ment racine du document.

Bien que ce format de fichier soit avant tout destin� � d�finir des contr�les et �crans, vous pouvez en fait initialiser pratiquement n'importe quel type d'objet Java en FXML, m�me si cet objet n'a aucune vocation graphique. Il faudra cependant veiller � ce que votre classe soit publique et dispose d'un constructeur par d�faut ou d'un constructeur sans param�tre qui est public et qu'elle soit accessible sur le CLASSPATH lors du chargement du fichier FXML.

Mis � jour le 3 septembre 2014 bouye
HautPage
Comment tester si le FXML est support� sur ma plateforme ?

Pour tester si le FXML est support� par votre plateforme, vous pouvez invoquer la m�thode isSupported() de la classe javafx.application.Platform en lui passant en param�tre la valeur javafx.application.ConditionalFeature.FXML :

Code Java : S�lectionner tout 
Platform.isSupported(ConditionalFeature.FXML);

Note : le support de FXML peut �tre disponible dans les runtimes JavaFX, mais non fonctionnel. Cela est par exemple le cas lorsque la JVM ne dispose pas d'un parser XML sur la plateforme. Dans ce cas, ce test retournera false.

Mis � jour le 17 septembre 2014 bouye
HautPage
Comment charger un fichier FXML ?

Pour charger un fichier FXML, vous devez utiliser un chargeur, un objet de type javafx.fxml.FXMLLoader. Vous devez initialiser cet objet avec l'URL d�acc�s � votre fichier FXML et ensuite invoquer sa m�thode load() pour charger le fichier. Si elle s�ex�cute correctement, cette m�thode retourne l'objet d�fini en n�ud racine dans le fichier FXML.

Il est possible de r�cup�rer un fichier FXML � charger de trois mani�res :

  • le fichier FXML peut �tre empaquet� dans une biblioth�que ou une application et r�cup�r� via le m�canisme des ressources ou des ClassLoader.

    Par exemple :

    Code Java : S�lectionner tout 
    1
    2
    3
    final URL fxmlURL = getClass().getResource("monFXML.fxml"); 
final FXMLLoader fxmlLoader = new FXMLLoader(fxmlURL); 
final Node node = fxmlLoader.load();

    Ici, nous chargeons notre fichier FXML depuis les ressources du projet inclus dans le fichier JAR de l'application ou de ses d�pendances ;
  • le fichier FXML peut �tre situ� sur un disque local et peut �tre r�f�renc� par les classes File, Path, URI ou URL.

    Par exemple :

    Code Java : S�lectionner tout 
    1
    2
    FXMLLoader fxmlLoader = new FXMLLoader(new File("monFXML.fxml").toURI().toURL()); 
final Node node = fxmlLoader.load();
  • le fichier FXML peut �tre h�berg� sur un site web distant et on peut y acc�der par une String ou une URL contenant son chemin d�acc�s.

    Par exemple :

    Code Java : S�lectionner tout 
    1
    2
    FXMLLoader fxmlLoader = new FXMLLoader(new URL("http://monsite/monFXML.fxml")); 
final Node node = fxmlLoader.load();



Note : il n'est pas recommand� d'utiliser les variantes statiques de la m�thode load() de la classe FXMLLoader. Pr�f�rez l'utilisation des m�thodes d'instance.

Mis � jour le 16 septembre 2014 bouye
HautPage
Que signifie l'erreur ��Location is not set.�� en chargeant un fichier FXML ?

Cette erreur indique que le FXMLLoader ne trouve pas votre fichier FXML. V�rifiez que le chemin donn� est correct ou que l'objet de type URL retourn� par le m�canisme d�acc�s aux ressources n'a pas une valeur �gale � null (auquel cas, le fichier FXML n'est pas pr�sent dans votre fichier JAR ou votre chemin d�acc�s n'est pas valide).

Mis � jour le 16 septembre 2014 bouye
HautPage
Comment d�finir du texte internationalis� dans un fichier FXML ?

Pour d�finir des chaines de texte internationalis�es (I18N, L10N) dans un fichier FXML, vous devez pr�fixer le texte par le caract�re %. Lors du chargement du fichier, le chargeur tentera alors de substituer le texte internationalis�.

Par exemple :

Code XML : S�lectionner tout 
1
2
3
4
5
6
7
8
9
10
11
12
13
<?xml version="1.0" encoding="UTF-8"?>  
  
<?import java.lang.*?>  
<?import java.util.*?>  
<?import javafx.scene.*?>  
<?import javafx.scene.control.*?>  
<?import javafx.scene.layout.*?>  
  
<AnchorPane id="AnchorPane" xmlns:fx="http://javafx.com/fxml/1" xmlns="http://javafx.com/javafx/8">   
    <children>  
        <Label text="%hello.message"/>  
    </children>  
</AnchorPane>

Au chargement de ce fichier FXML, le chargeur tentera de substituer la valeur ��hello.message�� par une chaine de texte provenant d'un fichier de traduction utilisant le m�canisme habituel des ResourceBundle.

Par exemple un fichier de traduction FR contiendra :

Code : S�lectionner tout 
hello.message=Salut le monde !
Tandis qu'un fichier de traduction EN contiendra :

Code : S�lectionner tout 
hello.message=Hello World!

Mis � jour le 30 septembre 2014 bouye
HautPage
Comment charger un fichier FXML contenant du texte internationalis� ?

Pour charger un fichier FXML contenant des chaines de texte internationalis�es (I18N, L10N), vous devez initialiser votre FXMLLoader en lui passant en second param�tre un objet de type ResourceBundle.

Par exemple :

Code Java : S�lectionner tout 
1
2
3
4
final URL fxmlURL = getClass().getResource("monFXML.fxml");  
final ResourceBundle bundle = ResourceBundle.getBundle("monpackage.monbundle"); 
final FXMLLoader fxmlLoader = new FXMLLoader(fxmlURL, bundle);  
final Node node = fxmlLoader.load();

Apr�s chargement, les chaines de texte internationalis�es contenues dans le FXML seront substitu�es par le texte traduit provenant de vos fichiers de traduction en fonction de la Locale actuelle de la JVM.

Une exception sera lev�e si le chargeur ne trouve pas la cl� correspondant � une chaine de texte internationalis�e dans le ResourceBundle fourni.

Mis � jour le 16 septembre 2014 bouye
HautPage
Que signifie l'erreur ��No resources specified.�� en chargeant un fichier FXML ?

Cette erreur indique que votre FXML contient des chaines de texte internationalis�es (I18N, L10N), mais que vous n'avez pas fourni � votre FXMLLoader un ResourceBundle qui permettrait de les r�soudre au chargement du fichier.

Mis � jour le 16 septembre 2014 bouye
HautPage
Comment inclure une ressource m�dia ou une image dans un fichier FXML ?

Pour inclure une ressource m�dia ou une image (c'est-�-dire que le m�dia ou l'image est empaquet� en tant que ressource de l'application) dans un fichier FXML, il faut pr�fixer le chemin relatif donn� en valeur de la propri�t� url avec le caract�re @.

Par exemple :

Code XML : S�lectionner tout 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
<?xml version="1.0" encoding="UTF-8"?> 
  
<?import java.lang.*?> 
<?import java.util.*?> 
<?import javafx.scene.*?> 
<?import javafx.scene.control.*?> 
<?import javafx.scene.layout.*?> 
<?import javafx.scene.image.*?> 
  
<AnchorPane id="AnchorPane" prefHeight="400.0" prefWidth="600.0" xmlns:fx="http://javafx.com/fxml/1" xmlns="http://javafx.com/javafx/8"> 
   <children> 
      <ImageView fitHeight="150.0" fitWidth="200.0"> 
         <image> 
            <Image url="@image.png" /> 
         </image> 
      </ImageView> 
   </children> 
</AnchorPane>

Ici, le fichier image.png est charg� en tant que ressource de l'application.

Note : il est �galement possible d'utiliser le caract�re @ pour pr�fixer une URI sur un fichier sur le disque local ou une URL distante, mais cela n'a aucun effet particulier.

Mis � jour le 3 octobre 2014 bouye
HautPage
Comment inclure un fichier FXML dans un autre fichier FXML ?

Pour inclure un fichier FXML dans un autre fichier FXML, il faut d�clarer un �l�ment de type <fx:include>. Cet �l�ment r�f�rence le chemin d�acc�s vers le fichier inclus dans son attribut source.

Prenons ce simple fichier FXML qui sera le fichier secondaire, test.fxml :

Code XML : S�lectionner tout 
1
2
3
4
5
6
7
8
<?xml version="1.0" encoding="UTF-8"?> 
  
<?import java.lang.*?> 
<?import java.util.*?> 
<?import javafx.scene.*?> 
<?import javafx.scene.layout.*?> 
  
<AnchorPane id="AnchorPane" xmlns:fx="http://javafx.com/fxml/1" xmlns="http://javafx.com/javafx/8"/>

Et incluons-le dans un autre FXML, le fichier principal, master.fxml :

Code XML : S�lectionner tout 
1
2
3
4
5
6
7
8
9
10
11
12
<?xml version="1.0" encoding="UTF-8"?> 
  
<?import java.lang.*?> 
<?import java.util.*?> 
<?import javafx.scene.*?> 
<?import javafx.scene.layout.*?> 
  
<AnchorPane id="AnchorPane" xmlns:fx="http://javafx.com/fxml/1" xmlns="http://javafx.com/javafx/8"> 
    <children> 
        <fx:include source="test.fxml"/> 
    </children> 
</AnchorPane>

Au chargement du fichier principal, le contenu du fichier secondaire sera lui aussi charg� et int�gr� dans l'arborescence du contenu du fichier principal. Il est possible d'utiliser sur cet �l�ment les m�mes attributs de positionnement, etc. que sur les �l�ments d�clarant d'autres n�uds graphiques.

Une exception sera lev�e au chargement si le fichier secondaire n'est pas accessible ou corrompu.

Mis � jour le 30 septembre 2014 bouye
HautPage
Comment inclure du scripting dans un FXML ?

Il est possible d'utiliser des langages de script pour �crire des actions � effectuer, par exemple en cas de clic sur des boutons, directement dans le fichier FXML.

Par exemple :

Code XML : S�lectionner tout 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
<?xml version="1.0" encoding="UTF-8"?> 
  
<?import java.lang.*?> 
<?import java.util.*?> 
<?import javafx.scene.*?> 
<?import javafx.scene.control.*?> 
<?import javafx.scene.layout.*?> 
  
<?language javascript?> 
  
<StackPane id="StackPane" prefHeight="200.0" prefWidth="200.0" xmlns:fx="http://javafx.com/fxml/1" xmlns="http://javafx.com/javafx/8"> 
    <fx:script> 
        function sayHello() { 
            print("Salut le monde !"); 
        } 
    </fx:script> 
    <children> 
        <Button text="Dire "Salut"" onAction="sayHello()"/> 
    </children> 
</StackPane>

La directive <?language?> indique que nous allons utiliser ici l�interpr�teur JavaScript qui est fourni avec le JRE.

L��l�ment <fx:script> qui est inclus dans l��l�ment racine de notre document nous permet de d�finir du code JavaScript, ici une fonction sayHello() qui affiche "Salut le monde !" sur la console.

Dans l��l�ment <Button>, nous affectons le nom de la fonction sayHello() dans la propri�t� onAction du bouton.

Chargeons ce fichier FXML dans une IU :

Code Java : S�lectionner tout 
1
2
3
4
5
6
7
8
final URL fxmlURL  = getClass().getResource("fxmljavascript.fxml"); 
final FXMLLoader fxmlLoader = new FXMLLoader(fxmlURL); 
final Node node = fxmlLoader.load(); 
final StackPane root = new StackPane(node); 
final Scene scene = new Scene(root, 300, 250); 
primaryStage.setTitle("Test sur FXML et JavaScript"); 
primaryStage.setScene(scene); 
primaryStage.show();

D�sormais, quand nous cliquons sur le bouton, la chaine de texte ��Salut le monde !�� s'affiche dans la console. Notre code JavaScript est bien ex�cut� !

Note : le script �tant stock� � m�me le fichier FXML, vous serez sans doute amen� � devoir �chapper des caract�res sp�ciaux du format XML.

Mis � jour le 2 octobre 2014 bouye
HautPage
Comment r�f�rencer un objet du document FXML depuis le script ?

Il est possible de r�f�rencer et de manipuler des objets qui sont d�finis dans le FXML directement depuis le code du script inclus dans ce m�me fichier. Pour ce faire, il faut utiliser l'attribut fx:id pour donner un nom unique � chaque �l�ment du document. On peut alors utiliser ce nom en tant que variable dans le code du script pour invoquer des m�thodes sur les objets r�f�renc�s.

Par exemple :

Code XML : S�lectionner tout 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<?xml version="1.0" encoding="UTF-8"?> 
  
<?import java.lang.*?> 
<?import java.util.*?> 
<?import javafx.scene.*?> 
<?import javafx.scene.control.*?> 
<?import javafx.scene.layout.*?> 
  
<?language javascript?> 
  
<StackPane id="StackPane" prefHeight="200.0" prefWidth="200.0" xmlns:fx="http://javafx.com/fxml/1" xmlns="http://javafx.com/javafx/8"> 
    <fx:script> 
        function sayHello() { 
            print("Salut le monde !"); 
            helloButton.setStyle("-fx-base: red;"); 
        } 
    </fx:script> 
    <children> 
        <Button fx:id="helloButton" text="Dire "Salut"" onAction="sayHello()"/> 
    </children> 
</StackPane>

Ici, notre bouton peut d�sormais �tre r�f�renc� dans le script en utilisant la variable helloBouton. Quand nous cliquons sur le bouton, nous changeons son style pour lui donner une couleur rouge.

Mis � jour le 3 octobre 2014 bouye
HautPage
Comment externaliser le script hors du document FXML ?

Il est possible d'externaliser le script hors du fichier FXML ce qui permet de d�coupler plus ais�ment la partie vue (le FXML) et son contr�leur (le script). Lorsque le code a �t� d�plac� dans un fichier externe, il suffit de d�clarer le chemin d�acc�s vers le script dans l'attribut source de l��l�ment <fx:script>. Ce chemin peut �tre une URL vers un site distant, une URI sur un fichier local ou un chemin relatif dans les ressources de l'application.

Par exemple, nous avons d�plac� le code vers un fichier script.js :

Code JavaScript : S�lectionner tout 
1
2
3
4
function sayHello() { 
    print("Salut le monde !"); 
    helloButton.setStyle("-fx-base: red;"); 
}

Ce qui nous permet de modifier notre fichier FXML comme suit :

Code XML : S�lectionner tout 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<?xml version="1.0" encoding="UTF-8"?> 
  
<?import java.lang.*?> 
<?import java.util.*?> 
<?import javafx.scene.*?> 
<?import javafx.scene.control.*?> 
<?import javafx.scene.layout.*?> 
  
<?language javascript?> 
  
<StackPane id="StackPane" prefHeight="200.0" prefWidth="200.0" xmlns:fx="http://javafx.com/fxml/1" xmlns="http://javafx.com/javafx/8"> 
    <fx:script source="script.js"/> 
    <children> 
        <Button fx:id="helloButton" text="Dire "Salut"" onAction="sayHello()"/> 
    </children> 
</StackPane>

Nous pouvons toujours acc�der aux variables d�clar�es par les attributs fx:id dans le document FXML.

Note : le script �tant stock� dans un fichier externe, il n'y a plus besoin d��chapper les caract�res sp�ciaux du format XML.

Mis � jour le 3 octobre 2014 bouye
HautPage
Quels sont les langages de script support�s ?

A priori, n'importe quel langage de script qui fonctionne sur la JVM (Groovy, Scala, Ruby, Python, R, etc.), m�me s'il requiert l'utilisation de biblioth�ques tierces, peut �tre utilis�. Il faudra cependant veiller � ce que moteur de script soit correctement impl�ment� en suivant les directives de la JSR223 et que les fichiers JAR n�cessaires � l'initialisation et au fonctionnement du moteur de script soient sur le CLASSPATH lors du chargement du fichier FXML.

Cependant, en pratique, le degr� d�impl�mentation de la JSR et de maturit� de l�interpr�teur fait que le support de tel ou tel langage puisse �tre partiel ou carr�ment non fonctionnel.

De mani�re g�n�rale, le support de l'utilisation du langage JavaScript dans du FXML est pleinement fonctionnel dans les JDK7 (rhino) et JDK8 (nashorn).

Mis � jour le 2 octobre 2014 bouye
HautPage
Comment injecter le n�ud racine dans un document FXML ?

Il est possible d'injecter le n�ud racine d'un document FXML. Pour cela, nous allons �crire le fichier FXML en utilisant l��l�ment <fx:root>, puis nous allons injecter un n�ud du m�me type en invoquant la m�thode setRoot() du FXMLLoader avant d'invoquer sa m�thode load().

Prenons le fichier FXML suivant :

Code XML : S�lectionner tout 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<?xml version="1.0" encoding="UTF-8"?> 
  
<?import java.lang.*?> 
<?import java.util.*?> 
<?import javafx.scene.*?> 
<?import javafx.scene.control.*?> 
<?import javafx.scene.layout.*?> 
  
<fx:root type="javafx.scene.layout.VBox" id="root" spacing="10" prefHeight="400.0" prefWidth="600.0" xmlns="http://javafx.com/javafx/8" xmlns:fx="http://javafx.com/fxml/1"> 
    <Button fx:id="button1" text="Button1"/> 
    <Button fx:id="button2" text="Button2"/> 
    <Button fx:id="button3" text="Button3"/> 
    <Button fx:id="button4" text="Button4"/> 
    <Button fx:id="button5" text="Button5"/> 
</fx:root>

Ici, le n�ud racine du document a �t� d�crit en utilisant un �l�ment <fx:root>. Nous avons d�fini un attribut type qui indique que le n�ud racine est en fait une VBox. Il est impossible de charger directement le fichier FXML, cela l�verait une exception.

Nous pouvons cependant injecter un n�ud racine du type appropri� avant de charger le fichier :

Code Java : S�lectionner tout 
1
2
3
4
5
6
final URL fxmlURL = getClass().getResource("testroot.fxml"); 
final FXMLLoader fxmlLoader = new FXMLLoader(fxmlURL); 
final VBox newRoot = new VBox(); 
fxmlLoader.setRoot(newRoot); 
final Node node = fxmlLoader.load(); 
System.out.println(newRoot == node);

Ici nous avons inject� un n�ud racine dans le document FXML. De plus, nous pouvons voir que le n�ud retourn� par la m�thode load() est en fait la racine que nous avons inject�e dans le document.

Mis � jour le 16 octobre 2014 bouye

Proposer une nouvelle r�ponse sur la FAQ

Ce n'est pas l'endroit pour poser des questions, allez plut�t sur le forum de la rubrique pour �a


R�ponse � la question

Liens sous la question
pr�c�dent sommaire suivant
 

Les sources pr�sent�es sur cette page sont libres de droits et vous pouvez les utiliser � votre convenance. Par contre, la page de pr�sentation constitue une �uvre intellectuelle prot�g�e par les droits d'auteur. Copyright � 2025 Developpez Developpez LLC. Tous droits r�serv�s Developpez LLC. Aucune reproduction, m�me partielle, ne peut �tre faite de ce site et de l'ensemble de son contenu : textes, documents et images sans l'autorisation expresse de Developpez LLC. Sinon vous encourez selon la loi jusqu'� trois ans de prison et jusqu'� 300 000 � de dommages et int�r�ts.