Discussion :

[miltone]

Salut à tous,

J'essaye d'intégrer une image dans un button en JFX à partir d'un FXML mais rien n'y fait. J'ai toujours une "unexpected token" qui va avec un NullPointerException quoique je puisse changer ou modifié dans la syntaxe.

La seul solution qui ne plante pas est cela :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

 <Button style="-fx-background-image:url('/resources/dessin.jpg')" />

Mais malheureusement ca plante au chargement du fichier FXML.

J'ai essayé de changer l'emplacement de l'image également mais en vain....


Une idée ?

PS : pour le moment je ne souhaite pas passer par du CSS externe ou par du code pour effectuer cela. J'aimerais comprendre pourquoi je ne peux pas charger d'image avec mon FXML.

[bouye]

Déjà, il manque un ; à la fin de la déclaration du CSS.

[miltone]

Tout à fait d'accord. Par contre le problème est peut-être plus d'affichage car finalement la source est apparemment bien accessible au compilateur.

je vais surtout essayer de jouer avec tous les paramètres d'un bouton dans un CSS afin de mieux travailler sur l'objet qui pose problème.

Dommage qu'on ne puisse pas avoir une espèce de compilation à chaque modification de CSS afin de travailler plus directement entre le graphique et le code.

[bouye]

Utilise SceneBuilder tout simplement, les modifications sont presque toutes apportées au vol bien sur toutes celles accessible via l'UI du soft mais aussi quand tu modifies le fichier CSS ou le FXML dans un éditeur externe (bon évidement parfois ça plante aussi si c'est trop drastique ou que la syntaxe est foirée).

Il me semble également que ScenicView permet de modifier certaines valeurs, mais je ne sais pas si les CSS inline en font partie.

[miltone]

Excuse moi bouye je me suis mal exprimé car je connais ces outils que tu m'avais précédemment conseillé d'utiliser. Ce que je fais mais dire qu'avec SceneBuilder on peut faire du CSS c'est être trop optimiste je trouve. Je préfère encore un CSS file dans mon IDE que passer par leur petites fenêtre.

ScenicView est intéressant mais comment copier des valeurs éventuelles modifier dans le code même de l'application et pas simplement en runtime ? Faire des copier coller ou réécrire par recopie entre les fenêtres ?

[jeffray03]

Salut a tous,
est ce que le dossier resources est un Source Folder dans ce cas, tu fais:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 
<Button style="-fx-background-image:url('dessin.jpg')" />

Merci.

[miltone]

Effectivement j'arrive à récupérer et visualiser une image à travers cette syntaxe mais dès que je range ma ressource images dans un dossier resources impossible d'y accéder.

D'ailleurs comment connaitre les règles syntaxique concernant les différentes façon d'obtenir des ressources (classpath, url, @.....).

[jeffray03]

peux-tu envoyer une photo de l´arbre des repertoires de ton Projet?
La on vera mieux ce qui cloche.
Bonne journée

[miltone]

cette notation marche :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
    <Pane prefHeight="793.0" prefWidth="725.0" style="-fx-background-color:white">
      <children>
        <ImageView fitHeight="150.0" fitWidth="200.0" layoutX="98.0" layoutY="103.0" pickOnBounds="true" preserveRatio="true">
          <image>
            <Image url="@../resources/coeur-music.jpg" />
          </image>
        </ImageView>
      </children>
    </Pane>

alors que celle-ci non :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
    <Pane prefHeight="793.0" prefWidth="725.0" style="-fx-background-color:white">
      <children>
        <Button layoutX="160.0" layoutY="163.0" mnemonicParsing="false" prefHeight="139.9609375" prefWidth="188.0" text="Button" style="-fx-background-image:url('/resources/coeur-music.jpg')" />
      </children>
    </Pane>

Pourtant l'auto-completion de l’édition de mon fichier FXML m'a bien trouvé la ressources ainsi que son chemin pour y arriver. Si je remplace l'image qui est dans le package resources avec la même se trouvant également à la racine de src j'ai bien un button avec l'image dedans sans problème.

L'arbre des répertoires n'est pas bien compliquée :

src
src\resources
src\sample

[jeffray03]

essaies ceci voir:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
 
<Pane prefHeight="793.0" prefWidth="725.0" style="-fx-background-color:white">
      <children>
        <Button layoutX="160.0" layoutY="163.0" mnemonicParsing="false" prefHeight="139.9609375" prefWidth="188.0" text="Button">
           <graphic>
               <ImageView>
                 <Image url="@/coeur-music.jpg"/>
               </ImageView>
            </graphic>        
        </Button>
      </children>
    </Pane>

[miltone]

le problème ce caracterise également dans mon CSS qui est attaché dans le preview de mon scenebuilder. D'ailleurs chaque modification de mon CSS dans mon IDE est detecté automatiquement et mise en application avec sceneBuilder.

url de l'image d'un bouton est donc automatiquement chargé puisque il me mentionne une erreur quand je soucis une URL qui semble pourtant valide dans mon ide.

ce CSS

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

-fx-background-image: url("/resources/bandeau.png")

trouve bien la resource mais ni l'execution ni scenebuilder ne semble vouloir l'afficher.

J'ai d'ailleurs aussi essayé avec :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

-fx-background-image: url("@/resources/bandeau.png")

ou cela

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

-fx-background-image: url("@../resources/bandeau.png")

ou cela

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

-fx-background-image: url("resources/bandeau.png")

mon CSS est celui-ci :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
#bouton_note_couleur
{
    -fx-background-image: url("resources/bandeau.png");
}

alors petit oubli de ma part ou réelle explication javaesque ?

[bouye]

Mouai, je penche pour un bug dans les CSS inline.
Ça marche sans soucis dans le CSS mais ça ne fonctionne pas du tout quand c'est inline (j'ai essaye avec ' ou " ).



Ça mérite probablement la création d'un bug report sur le Jira.

[InfoStd]

bonjou,
J'ai le problème que toi en JavaFX je veux à partir d'un fichier qui se trouve dans un package (com.a.b.c.d) recupérer une image qui se trouve dans le dossier resources package fxml.icons..j'ai essayé toute les propositions dessus rien ne marche

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

Image img= new Image(getClass().getResourceAsStream("resources/icon.jpg"));

Merci à vous

[sinok]

si com.myapp.resources.images est le package qui contient tes images:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

Image img= new Image(getClass().getResource("/com/myapp/resources/images/icon.jpg"));

[InfoStd]

si com.myapp.resources.images est le package qui contient tes images:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

Image img= new Image(getClass().getResource("/com/myapp/resources/images/icon.jpg"));

D bord je te remércie pour ta réponse, sinon, le package resources dont je parle, est celui crée par netBeants, au faite j'ai deux "folders" Resource Packages et Source Packages, dans ce dernier j'ai tout mes package com.a.b.c.d.e, et dans le dossier "Resource Packages" j'ai un package fxml.icons là où se trouve mes image
donc je veux à partire de com.a.b.c.d.e aller au dossier resouces de netbeans (resources/fxml/icons)

J'ai tout essayer, rien ne marche

[sinok]

En fait, resources n'est probablement pas un package (ce devrait se voir à l'icône, elle différe suivant si il s'agit d'un package ou d'un répertoire basique).

Donc pour accéder à ton icône je dirais

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 
Image img= new Image(getClass().getResource("/fxml/icons/icon.jpg"));

[InfoStd]

En fait, resources n'est probablement pas un package (ce devrait se voir à l'icône, elle différe suivant si il s'agit d'un package ou d'un répertoire basique).

Donc pour accéder à ton icône je dirais

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 
Image img= new Image(getClass().getResource("/fxml/icons/icon.jpg"));

ça marche..Merci