Le cadran

Dessiner le fond d'une horloge : un disque blanc cerclé de noir, les chiffres 12, 3, 6 et 9, et un point au centre.

Notions :toilecerclelabel

Le résultat final du parcours : L'horloge et le chronomètre — Le résultat final du projet

Ce qu'il faut savoir

La toile mesure 300 × 300 pixels : son centre est donc le point (150, 150). Tout le cadran est construit autour de ce point.

Un cercle avec un bord

Il n'y a pas d'option « bordure » : on dessine un grand disque foncé, puis un disque blanc un peu plus petit par-dessus. Il reste un anneau de 8 pixels :

cercle(cadran, 150, 150, 135, #2D3436)
cercle(cadran, 150, 150, 127, #FFFFFF)

Dans cercle(toile, x, y, rayon, couleur), (x, y) est le centre du cercle.

Les chiffres

label(toile, x, y, texte, couleur, taille) écrit un texte. Attention, y est la ligne de base du texte, c'est-à-dire le bas des chiffres, et x son bord gauche. Pour que « 12 » soit centré en haut, il faut donc le décaler un peu vers la gauche et vers le bas.

Placer les chiffres à la main, c'est faisable pour 4… mais pour 12, ce serait fastidieux et peu précis. L'étape suivante va les placer par le calcul.

Code de départ

Ouvrez CoddyRun et partez d'un programme vide : tout commence ici.

Besoin d'aide ?

Indice 1

Commencez par dimension(cadran, 300, 300) et un fond gris très clair : remplir(cadran, #F5F6FA).

Indice 2

Le « 3 » se place à droite, vers (250, 158) ; le « 9 » à gauche, vers (38, 158).

Indice 3

Le point central se dessine en dernier, pour être au-dessus de tout : cercle(cadran, 150, 150, 6, #2D3436).

Voir la solution complète

Essayez d'abord par vous-même : c'est en cherchant qu'on apprend. La solution sert à vérifier ou à se débloquer.

@ Les déclarations
cadran est une toile

@ Le cadran
dimension(cadran, 300, 300)
remplir(cadran, #F5F6FA)
cercle(cadran, 150, 150, 135, #2D3436)
cercle(cadran, 150, 150, 127, #FFFFFF)

@ Les chiffres
label(cadran, 138, 50, "12", #2D3436, 22)
label(cadran, 250, 158, "3", #2D3436, 22)
label(cadran, 144, 268, "6", #2D3436, 22)
label(cadran, 38, 158, "9", #2D3436, 22)

cercle(cadran, 150, 150, 6, #2D3436)
affiche cadran