====== 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 :
{{ :icn:codeorg:couleur01.png |}}
* 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** :
* [[https://studio.code.org/projects/applab/SDbk5g6SV9_M7am_9WpKzg|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)
{{ :icn:codeorg:couleur03.png |}}
* 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** :
{{ :icn:codeorg:couleur04.png |}}
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"
{{ :icn:codeorg:dessine07.png |}}
* ce qui donne setFilColor("rgb(" + rouge + ",0,0");
{{ :icn:codeorg:dessine08.png |}}
====== 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====
* [[:icn:codeorg:imagecouleur|Activité Code.org : la codification des couleurs dans les images]]