Tutoriel: afficher le monde 2d #

Créer une tâche pour l’affichage temps-réel #

Ouvrir AfficherPartie et ajouter ce code

public class AfficherPartie {

    public static void creerTaches(FrontendTasks tasks) {

        creerDonneesVuePartie(tasks);

        // ajouter le groupe de tâches suivant
        tasks.taskGroup("AfficherPartie")

             .waitsFor(created(DonneesVuePartie.class))

             .waitsFor("afficherVuePartie")

             .contains(subTasks -> {

                prochaineImagePartie(subTasks);

             });

    }

    // ...


    // ajouter la méthode
    private static void prochaineImagePartie(FrontendTasks subTasks) {

        subTasks.task("prochaineImagePartie")

                 .waitsFor("afficherVuePartie")

                 .waitsFor(created(DonneesVuePartie.class))

                 .waitsFor(created(VuePartie.class))

                 .waitsFor(clock().nextTick())

                 .executes(inputs -> {

                    DonneesVuePartie donneesVuePartie = inputs.get(created(DonneesVuePartie.class));
                    VuePartie        vuePartie        = inputs.get(created(VuePartie.class));
                    Tick             tick             = inputs.get(clock().nextTick());

                    // TODO: afficher le monde 2d
                });
    }
}

NOTES
- la tâche prochaineImagePartie sera appelée à chaque clock().nextTick()
- ce qui veut dire: le plus souvent possible
- (en JavaFx, typiquement 60 fois par secondes)

S’assurer que AppPong s’exécute
```
$ sh gradlew pong
```
Vérifier le graphe de tâches du frontal

Coder l’affichage du monde 2d #

Dans la tâche prochaineImagePartie, ajouter l’appel suivant

public class AfficherPartie {

    // ...

    private static void prochaineImagePartie(FrontendTasks subTasks) {

        subTasks.task("prochaineImagePartie")

                 .waitsFor("afficherVuePartie")

                 .waitsFor(created(DonneesVuePartie.class))

                 .waitsFor(created(VuePartie.class))

                 .waitsFor(clock().nextTick())

                 .executes(inputs -> {

                    DonneesVuePartie donneesVuePartie = inputs.get(created(DonneesVuePartie.class));
                    VuePartie        vuePartie        = inputs.get(created(VuePartie.class));
                    Tick             tick             = inputs.get(clock().nextTick());

                    // ajouter
                    donneesVuePartie.afficherSur(vuePartie);

                });
    }

}

Utiliser Ctrl+.Eclipse: Ctrl+1 pour créer la méthode DonneesVuePartie.afficherSur

Dans DonneesVuePartie, ajouter ce code pour la méthode afficherSur

public class DonneesVuePartie implements ViewData {

    // ...

    public void afficherSur(VuePartie vuePartie) {

        vuePartie.viderCanvas();
        vuePartie.afficherImagesParSeconde("FPS " + fpsCourant);
        vuePartie.afficherPong2d(mondePong2d);

    }

Utiliser Ctrl+.Eclipse: Ctrl+1 pour créer les méthodes suivantes:
- VuePartie.viderCanvas
- VuePartie.afficherImagesParSecondes
- VuePartie.afficherPong2d

Dans VuePartie, ajouter le code suivant

public class VuePartie extends ViewFx {

    // ...

    public void viderCanvas() {
        canvasPartie.clearCanvas();
    }

    public void afficherImagesParSeconde(String fps) {
        canvasPartie.afficherFps(fps);
    }

    public void afficherPong2d(MondePong2d mondePong2d) {
        mondePong2d.drawOn(canvasPartie);
    }

Utiliser Ctrl+.Eclipse: Ctrl+1 pour créer la méthode suivante:
- CanvasPartie.afficherFps

Dans CanvasPartie, ajouter le code suivant

public class CanvasPartie extends ResizableWorld2dCanvasFx {

    // ...

    public void afficherFps(String fps) {
        drawOnCanvas(gc -> {

            gc.fillText(fps, 0, 12);

        });
    }


}

S’assurer que AppPong s’exécute et affiche le monde 2d
```
$ sh gradlew pong
```
- NOTES
  - c’est normal que le compteur de FPS soit encore à 0

Coder un compteur de FPS (images par seconde) #

Ouvrir DonneesVuePartie et ajouter le code suivant:

public class DonneesVuePartie implements ViewData {

    // ajouter
    private static long CALCULER_FPS_A_CHAQUE_X_MILLISECONDES = 200;


    // ajouter
    private long horodatageDernierCalculFps = NtroCore.time().nowMilliseconds();
    private long imagesAfficheesDepuisDernierCalculFps = 0;


    public void afficherSur(VuePartie vuePartie) {
        // ajouter
        calculerFpsSiNecessaire();

        vuePartie.viderCanvas();
        vuePartie.afficherImagesParSeconde("FPS " + fpsCourant);
        vuePartie.afficherPong2d(mondePong2d);

        // ajouter
        imagesAfficheesDepuisDernierCalculFps++;
    }

    // ajouter la méthode
    private void calculerFpsSiNecessaire() {
        long horodatageMaintenant = NtroCore.time().nowMilliseconds();
        long millisecondesEcoulees = horodatageMaintenant - horodatageDernierCalculFps;

        if(millisecondesEcoulees > CALCULER_FPS_A_CHAQUE_X_MILLISECONDES) {
            calculerFpsMaintenant(millisecondesEcoulees);

            imagesAfficheesDepuisDernierCalculFps = 0;
            horodatageDernierCalculFps = horodatageMaintenant;
        }
    }

    // ajouter la méthode
    private void calculerFpsMaintenant(long millisecondesEcoulees) {
        double secondesEcoulees = millisecondesEcoulees / 1E3;
        double fps = imagesAfficheesDepuisDernierCalculFps / secondesEcoulees;
        fpsCourant = String.valueOf(Math.round(fps));
    }

}

S’assurer que AppPong s’exécute et affiche maintenant le compteur FPS
```
$ sh gradlew pong
```
- NOTE
  - La plupart des implentations de JavaFX bloque le FPS à 60