|
|
| (65 révisions intermédiaires par 2 utilisateurs non affichées) |
| Ligne 1 : |
Ligne 1 : |
| − | =={{Bleu|Td 2}}==
| + | __NOTOC__ __NOEDITSECTION__ |
| | | | |
| − | ==={{Vert|Exercice 1 : Couleurs}}=== | + | =ide= |
| | | | |
| − | Nous allons découvrir la gestion des couleurs dans processing. | + | Nous écrirons des programmes en c++ et utiliserons un ide en ligne, par exemple : |
| | + | *[https://www.onlinegdb.com/online_c++_compiler OnlineGDB] |
| | + | *[https://replit.com/languages/cpp replit] |
| | | | |
| − | Une couleur est entièrement définie par 3 paramètres. Diverses représentation sont possibles, nous nous intéresserons ici à la représentation RGB.
| |
| | | | |
| − | On initialisera l'espace de couleur par une ligne :
| + | =Enoncés de td= |
| − | <source lang=c>
| |
| − | colorMode(RGB, nbValeurs);
| |
| − | </source>
| |
| − | Une couleur est donc représentée par un triplet (Rouge,Vert,Bleu), avec nbValeur pour chaque composante.
| |
| | | | |
| − | Le choix de la couleur s'effectue avec la fonction [https://processing.org/reference/stroke_.html stroke]
| + | *[[Cours:Cin/Cout|TD 1 : Entrée-sortie en C++]] |
| − | <source lang=c>
| + | *[[Cours:Caisse|TD 2 : Caisse enregistreuse]] |
| − | stroke(Rouge,Vert,Bleu);
| + | *[[Cours:tabChar|TD 3 : Chaînes de caractères]] |
| − | </source>
| + | *[[Cours:TdComplexe|TD 4 : Utilisation d'une structure]] |
| | + | *[[Cours:TdFonctionsTableaux|TD 5 : Travail sur les fonctions et tableaux]] |
| | | | |
| − | {{Todo|Exécuter le code suivant}}
| + | =liens= |
| − | <source lang=c>
| |
| − | noStroke();
| |
| − | colorMode(RGB, 100);
| |
| − | for (int i = 0; i < 100; i++)
| |
| − | {
| |
| − | for (int j = 0; j < 100; j++)
| |
| − | {
| |
| − | stroke(i, j, 0);
| |
| − | point(i, j);
| |
| − | }
| |
| − | }
| |
| − | </source>
| |
| | | | |
| − | On prendra par la suite un écran de taille 400x200.
| + | *[[Media:InfoS1ReferencesPointeurs.pdf]] |
| | | | |
| − | {{Question|En vous inspirant du code précédent, tracez des lignes verticales dans un dégradé de bleu}}
| + | =Archives= |
| − | | + | [[Cours:historiqueInfoS1]] |
| − | {{Question|Puis, tracez des lignes verticales dans un dégradé de vert}}
| |
| − | | |
| − | {{Question|Faire ensuite un dégradé de rouge à partir de l'angle supérieur gauche dans les 2 directions}}
| |
| − | | |
| − | | |
| − | ==={{Vert|Exercice 2 : setup/draw}}===
| |
| − | | |
| − | | |
| − | <source lang=c>
| |
| − | int i = 0;
| |
| − | | |
| − | void setup()
| |
| − | {
| |
| − | noStroke();
| |
| − | colorMode(RGB, 100);
| |
| − | }
| |
| − | | |
| − | void draw()
| |
| − | {
| |
| − | for (int j = 0; j < 100; j++)
| |
| − | {
| |
| − | stroke(i, j, 0);
| |
| − | point(i, j);
| |
| − | }
| |
| − | if (i==99) i=0; else i++;
| |
| − | }
| |
| − | </source>
| |
| − | | |
| − | {{Todo|Exécuter le code précédent}}
| |
| − | | |
| − | '''Explications''' :
| |
| − | *La fonction setup() est exécutée une seule fois au démarrage
| |
| − | *La fonction draw est ensuite exécutée en boucle :<br> Dès qu'elle est terminée, l'écran est mis à jour et on recommence la fonction draw().
| |
| − | | |
| − | {{Question|Faire un programme qui remplit complètement l'écran en dégradés successifs de Bleu}}
| |
| − | | |
| − | Vous pouvez utiliser la fonction [https://processing.org/reference/background_.html background].
| |
| − | | |
| − | {{Question|Remplir ensuite l'écran avec un dégradé de Vert, et à chaque itération modifiez la quantité de Bleu}}
| |
| − | | |
| − | ==={{Vert|Exercice 3 : Déplacement}}===
| |
| − | | |
| − | {{Question|Faire un programme répondant au cahier des charges suivant :}}
| |
| − | * Remplir l'écran en blanc
| |
| − | * Définissez 2 variable posX et posY correspondant à la position d'une balle, que l'on initialise au milieu de l'écran
| |
| − | * Tracez une balle ([https://processing.org/reference/ellipse_.html ellipse()]) à ces coordonnées de couleur violette (regarder la fonction [https://processing.org/reference/fill_.html fill()])
| |
| − | * Déplacer la balle verticalement
| |
| − | | |
| − | =={{Bleu|Td 3}}==
| |
| − | [http://profgra.org/lycee/activite_prise_en_main_Processing.html Guide à suivre et à compléter]
| |
| − | | |
| − | =={{Bleu|Td 4}} Tracé de fonction==
| |
| − | | |
| − | | |
| − | On cherche à tracer les variations d’une fonction f telle que:f: [xmin,xmax] → y=f(x). Par exemple, on veut tracer y = sin(x)pour x compris entre 0 et π.
| |
| − | Préparation du tracé
| |
| − | Pour pouvoir tracer une courbe sur un écran, quatre étapes sontnécessaires:
| |
| − | l’échantillonnagela recherche des extrema en y: ymin et ymaxla mise à l’échelle de la courbele tracé sur l’écran.Echantillonnage
| |
| − | On cherche à prendre un certain nombre de points régulièrement espacésentre xmin et xmax.
| |
| − | La formule suivante: x[i]=xmin+i*(xmax-xmin)/N permet un échantillonnagesur N+1 points.
| |
| − | L’algorithme du calcul est alors le suivant:
| |
| − | Pour i variant de 0 à N { x[i]=xmin+i*(xmax-xmin)/N ; y[i]=sin(x[i]) ; // si on veut tracer sinus, sinon changer ici }Recherche des extrema
| |
| − | On pourra s’inspirer de l’algorithme suivant:
| |
| − | ymin=y[0] ; ymax=y[0] ;pour i variant de 1 à N { si (y[i] < ymin) ymin=y[i] ; si (y[i] > ymax) ymax=y[i] ; }Mise à l’échelle de la courbe
| |
| − | Pour tracer une courbe sur un écran d’ordinateur, il faut utiliser cetécran en mode graphique, c’est-à-dire sous forme de points (pixels)adressables individuellement. En mode VGA standard, le coin en haut àgauche a pour coordonnées (0,0) et le coin diamétralement opposé (enbas à droite) (639,479). On dispose donc de 640 points en horizontalet 480 points en vertical.
| |
| − | Or, le tracé de la courbe consiste à placer les points de coordonnées(x,y=f(x)). Sur l’intervalle [xmin, xmax], où la fonction f possèdedes extrema ymin et ymax.
| |
| − | Il nous faut donc déterminer une transformation qui permet le tracé surcet écran. Montrer que la transformation est la suivante:
| |
| − | xp = 639*(x-xmin)/(xmax-xmin)yp = 479 *(y-ymin)/(ymax-ymin)
| |
| − | Ce sont ces coordonnées (xp,yp) qui vont nous permettre de tracer lacourbe sur l’écran.
| |
| − | Tracé de la courbe
| |
| − | Pour pouvoir tracer une courbe sur l’écran en langage C, il faututiliser une librairie graphique. Bien évidemment, plusieurs librairiesgraphiques existent (et petit détail, ne sont bien sûr pas compatiblesentre elles). Ce qui suit présente un exemple avec la librairie SDL qui est principalementutilisée pour écrire des jeux.
| |
