Créer une fenêtre avec JavaFX.

[AteK5]

Yo !
Aujourd'hui je vais vous montrer comment créer une fenêtre avec les librairies JavaFX.
Ces librairies sont désormées inclut dans la dernière version de JDK.
Pour commencer il faut que votre classe hérite de la classe Application :​

public class main extends Application{
}

Après il faut que vous faites la methode d'implémentation vous allez alors noter ceci avec la notation @Override au dessus​

@Override
public void start(Stage stage) throws Exception {
}

Dans votre méthode main vous devez marquer ceci : launch(args);
Une fois cela fait on va pouvoir "construire" notre fenêtre.
Il y a plusieurs type de fenêtre en JavaFX :
-Pane
-AnchorPane
-BorderPane
-VBox
etc.
Nous allons utiliser le type Pane. Nous allons donc créer un nouvelle objet de la classe Pane dans notre méthode start : Pane root = new Pane();
après on va donner les dimensions de notre fenêtre :
root.setPrefSize(800, 600);
la première valeur est la largeur, la seconde et la hauteur.
Après cela on va initialiser notre Scene en créant un nouvelle objet de la classe Scene :
Scene scene = new Scene(root);
notre scene prend comme paramètre root qui est notre fenêtre.
après on va initialiser notre paramètre stage, puis on va lancer notre fenêtre :
stage.setScene(scene);
stage.show();
Normalement vous devriez avoir ce résultat :

You must be registered for see images attach

package com.atek.tutoriel1;

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.layout.Pane;
import javafx.stage.Stage;

/**
* Created by alex on 16/12/15.
*/
public class Main extends Application{
    public static void main(String [] args) {
        launch(args);
    }

    @Override
    public void start(Stage stage) throws Exception {
        Pane root = new Pane();
        root.setPrefSize(800, 600);

        root.getChildren().addAll();

        Scene scene = new Scene(root);

        stage.setScene(scene);
        stage.show();
    }
}

Pour ajouter des textbox ou autre vous devrez mettre :
root.getChildren().addAll();
dans les parenthèse du addAll vous mettez tous vos objets.

Quelques lignes de codes :

mettre un titre à votre fenêtre

stage.setTitle("Votre titre");

empêcher que votre fenêtre soit "resizable"

stage.setResizable(false);

changer le style de votre fenêtre​

        stage.initStyle(StageStyle.DECORATED);
        stage.initStyle(StageStyle.TRANSPARENT);
        stage.initStyle(StageStyle.UNDECORATED);
        stage.initStyle(StageStyle.UNIFIED);
        stage.initStyle(StageStyle.UTILITY);

fermer la fenêtre

stage.close();

Mettre vos instructions quand l'utilisateurs veut fermer la fenêtre​

        stage.setOnCloseRequest(event -> {
            //vos instructions
        });

créer un bouton / textArea / TextField​

        Button btn = new Button("nom du bouton");

        TextArea txtA = new TextArea();

        TextField txtF = new TextField();

Créer un label ou une zone de texte​

        Label label = new Label("le nom de votre label");
    
        Text text = new Text("Votre text");

Quand un bouton est en action (par exemple l'utilisateur clique dessus)​

        btn.setOnAction(event -> {
            //vos instructions
        });

Quand une une touche de clavier est presser dans la fenêtre (par exemple entrer)​

scene.setOnKeyPressed(event -> {
            if(event.getCode() == KeyCode.ENTER) {
                //vos instructions
            }
        });

Quand une touche est relachée​

        scene.setOnKeyReleased(event -> {
            if(event.getCode() == KeyCode.ENTER) {
                //vos instructions
            }
        });

Mettre une image en background(attention /!\ l image doit être en premier dans les "children" de root)​

        InputStream is = Files.newInputStream(Paths.get("votre url de votre image par exemple : res/imega/image.png"));
        Image img = new Image(is);
        is.close();
        ImageView imgV = new ImageView(img);

Changer la taille d'une image​

        imgV.setFitHeight(500);//hauteur
        imgV.setFitWidth(500);//largeur

Situer un objet dans la fenêtre​

        Nom_de_votre_objet.setTranslateX(500);//500 pixel par rapport au "mur" de gauche
        Nom_de_votre_objet.setTranslateY(500);//500 pixel par rapport au "plafond"

les 3 principals transitions :
les fade transitions permettent de faire une transitions par un changement d'opacité​

        FadeTransition ft = new FadeTransition(Duration.seconds(0.5), Nom_de_votre_objet);
        ft.setFromValue(1);//valeur d'opacité de départ : 1 = objet visible
        ft.setToValue(0);//valeur d'opacité de fin : 0 = objet non visible
        ft.setOnFinished(evt -> Nom_de_votre_objet.setVisible(false));//statue de l'objet à la fin de la transitions
        ft.play();//on lance la transition

les translate transitions permettent de faire une transitions par le déplacement d'un objet​

        TranslateTransition tt = new TranslateTransition(Duration.seconds(0.5), Nom_de_votre_objet);
        tt.setFromX(50);// ou setFromY c'est comme vous voulez
        tt.setToX(100);// ou setToY c'est comme vous voulez
        tt.setOnFinished(evt -> Nom_de_votre_objet.setTranslateX(100));// ou setTranslateY suivant dans quelle sens vous l'avez déplacer
        tt.play();

Les fill transition permettent de faire une transition par la couleur d'un objet​

        FillTransition ft1 = new FillTransition(Duration.seconds(0.5), Nom_de_votre_objet);
        ft1.setFromValue((Color) Paint.valueOf("#00000"));// on aurez put le remplacer par un Color.BLACK
        ft1.setToValue((Color) Paint.valueOf("#111111"));//je sais pas si cette couleur existe mais vous avez compris le principe
        ft1.setOnFinished(evt -> Nom_de_votre_objet.setFill(Paint.valueOf("#111111")));
        ft1.play();

J'espère que cela vous auras aider si vous avez pas compris quelque chose contacter moi par mp.
(désoler des fautes d'orthographes).​

 

[Hichxm]

Bon tutoriel
Tu fera une vidéo ?

 

[AteK5]

Bon tutoriel
Tu fera une vidéo ?

Pas la dessus c'est des notions de bases ça^^