Je teste l'app et je la termine

Mon application doit me permettre de colorier un rectangle en choisissant les valeurs de rouge, de vert et de bleu.

Pour cela, je dois utiliser un canevas, en anglais canvas, pour pouvoir dessiner.

l'interface de mon application doit me permettre de choisir la valeur des couleurs rouge, vert et bleu. Voici l'interface de mon app que je dois réaliser :

J'utilise les noms de composants suivant :

Nom des couleurs	Nom du slider	Nom des labels affichant les valeurs
labeRouge	sliderRouge	labelRougeValeur
labeVert	sliderVert	labelVertValeur
labeBleu	sliderBleu	labelBleuValeur

Par défaut, le composant slider génère un nombre compris entre 0 et 100. Il est alors nécessaire de modifier les propriétés des composants slider pour définir 255 comme valeur maximale.

Tester l'app

Voici le lien vers l'app partiellement réalisée et qui est à finir :

App à tester puis à finir

Commentaires du code de l'app

J'active le canevas,

et je dessine un grand rectangle de couleur noire : rgb(0,0,0)

dès que le slider gérant l'intensité du rouge est modifié, je redessine mon rectangle avec la nouvelle couleur. La valeur numérique du slider est mémorisée dans une variable qui est ici appelé rouge :

Attention, le composant slider génère un chiffre de 0 à 100. Il est important de modifier les propriétés des composants slider pour que la valeur maximale soit 255.

Quelques explications ...

La fonction setFillColor() permet de définir la couleur de remplissage des dessins. En paramètre, on définit une couleur au format rgb de la manière suivante : setFillColor(“rgb(0,0,0)”).

Pour définir le paramètre couleur de la fonction setFilColor() en fonction de l'intensité du rouge, je concatène des caractères et le contenu de la variable rouge : “rgb(” + rouge + “,0,0” ce qui donne setFilColor(“rgb(” + rouge + “,0,0”);

Je termine l'app

Je clique sur le bouton Make my own pour enregistrer l'application,

je modifie l'application pour pouvoir définir l'intensité des autres couleurs verte et bleue.

Retour à l'activité : la codification des couleurs dans les images

Activité Code.org : la codification des couleurs dans les images