Graphismes avec Java FX

Dessins dans le canevas

Les dessins se font à l'aide des (très nombreuses) méthodes de la classe GraphicsContext, dont vous pouvez trouver la liste ici.

En gros les méthodes commençant par "stroke" permettent de tracer une ligne ou un contour, tandis que celles commençant par "fill" permettent de dessiner une forme pleine.

Nous devons ajouter dans la classe EchantillonController le code permettant de dessiner le cadran du chronomètre.. Le but est d'obtenir ceci :

Pour que le cadran soit bien ajusté à la taille du canevas, nous allons définir un certain nombre de constante, calculées à partir de la taille du canevas, que l'on peut connaître à l'aide des méthodes getWidth() et getHeight().
Dans la classe EchantillonController, ajouter les déclarations de variable suivantes:

double largeur;
double hauteur;
double rayon;
double lAiguille;

Les variables largeur et hauteur vont contenir la largeur et la hauteur du canevas.
La variable rayon va contenir le rayon du cercle sur lequel sont placé les petits disques repère.
La variable lAiguille va contenir la longueur de l'aiguille.

Les valeurs de ces variables doivent être déterminés au lancement du programme. Nous allons donc les déterminer dans la méthode "initialize".
Ajouter dans la classe EchantillonController le code suivant :

@FXML void initialize(){			
		largeur=fond.getWidth();
		hauteur=fond.getHeight();
		rayon=largeur/2.5;
		lAiguille=rayon*4/5;
		gc=fond.getGraphicsContext2D();
		gc.translate(largeur/2,hauteur/2);				
		}

La première ligne permet d'affecter à largeur la valeur de la largeur du canevas fond, obtenue grâce à la méthode getWidth().
La deuxième ligne fait de même pour la hauteur.
La troisième ligne calcule le rayon du cercle pour qu'il soit un peu plus petit que la moitié du canevas.
La quatrième ligne calcule la longueur de l'aiguille pour qu'elle soit un peu plus petite que le rayon du cercle.
La cinquième ligne relie le GraphicsContext gc au canevas où l'on veut dessiner.
La sixème ligne déplace l'origine des coordonnées de gc pour qu'elle soit au milieu par défaut elle est en haut à gauche). Cela rendra plus simples les calculs de position par la suite.

Nous pouvons maintenant utiliser toutes ces variables pour dessiner le cadran du chronomètre.