Modifier Fiche Idée : CoCos

Documentation:

== Mode d'emploi == * Le slider du haut gère un coef1 tel que l'ordonnée d'un petit carré = cos(angle)*coef1 * Le slider du milieu gère un coef2 tel que l’abscisse d'un petit carré = cos(angle)*coef2 * Le slider du bas gère l'écart entre les angles respectifs de chaque carré, sachant que tous les angles s'incrémentent de 1 à chaque frame. * La barre d'espace vous permets de passer d'une ligne à un carré. [[File:Cocos1.gif]] [[File:Cocos2.gif]] == Code == Il existe 3 versions différentes : === Version en Processing JS === Cette version est visible en ligne [http://openatelier.labomedia.org/BitDeDieu/CoCos/ ici]. ControlP5 n'étant pas porté en JS, j'ai utilisé la class [http://processingjs.org/learning/topic/scrollbar/ HScrollbar] <syntaxhighlight lang="javascript"> import controlP5.*; HScrollbar hs1, hs2, hs3, hs4; // Two scrollbars Ronde[] groupe; int nbPart, versCentre; boolean oneOrAll; void setup() { size(500, 500); noStroke(); frameRate(60); hs1 = new HScrollbar(70, 20, 360, 8, 1, 280); hs2 = new HScrollbar(70, 40, 360, 8, 1, 370); hs3 = new HScrollbar(70, 60, 360, 8, 1, 79); oneOrAll = false; nbPart = 51; versCentre = height/4; groupe = new Ronde[2601]; for (int i = 0; i < groupe.length; i++) { groupe[i] = new Ronde(i); } } void draw() { background(255); for (int i = 0; i < nbPart; i++) { groupe[i].affiche(hs1.getPos()-180, hs2.getPos()-180, hs3.getPos(), versCentre); } hs1.update(); hs2.update(); hs3.update(); hs1.display(); hs2.display(); hs3.display(); } void keyPressed () { if (key == ' ') { oneOrAll = !oneOrAll; if (oneOrAll) { nbPart = 2601; versCentre = 0; } else { nbPart = 51; versCentre = height/4; } for (int i = 0; i < nbPart; i++) { groupe[i].reset(); } } } class Ronde { float angle = 0; float decalage = 0; int ID; float X, Y; int xInit, yInit, compteur; int taille, nbParLigne; int fromSlider; Ronde(int num) { ID = num; taille = 5; nbParLigne = 51; xInit = num%nbParLigne * taille; yInit = (int) (num/nbParLigne) * taille; compteur = 0; angle = 0; } void affiche(int val1, int val2, int val3, int versCentre) { angle = ID*val3 + frameCount%360; decalage = cos(radians(angle)); X = width/4 + xInit + decalage*val1; Y = height/4 + yInit + decalage*val2 + versCentre; fill(255, 50, 100, 180); rect(X, Y, taille, taille); } void reset() { compteur = 0; } } class HScrollbar { int swidth, sheight; // width and height of bar float xpos, ypos; // x and y position of bar float spos, newspos; // x position of slider float sposMin, sposMax; // max and min values of slider int loose; // how loose/heavy boolean over; // is the mouse over the slider? boolean locked; float ratio; HScrollbar (float xp, float yp, int sw, int sh, int l, int init) { swidth = sw; sheight = sh; int widthtoheight = sw - sh; ratio = (float)sw / (float)widthtoheight; xpos = xp; ypos = yp-sheight/2; spos = init; newspos = spos; sposMin = xpos; sposMax = xpos + swidth - sheight; loose = l; } void update() { if (overEvent()) { over = true; } else { over = false; } if (mousePressed && over) { locked = true; } if (!mousePressed) { locked = false; } if (locked) { newspos = constrain(mouseX-sheight/2, sposMin, sposMax); } if (abs(newspos - spos) > 1) { spos = spos + (newspos-spos)/loose; } } float constrain(float val, float minv, float maxv) { return min(max(val, minv), maxv); } boolean overEvent() { if (mouseX > xpos && mouseX < xpos+swidth && mouseY > ypos && mouseY < ypos+sheight) { return true; } else { return false; } } void display() { noStroke(); fill(255, 200, 200); rect(xpos, ypos, swidth, sheight); if (over || locked) { fill(160, 0, 80); } else { fill(255, 50, 100); } rect(spos, ypos, sheight, sheight); } int getPos() { // Convert spos to be values between // 0 and the total width of the scrollbar return int(spos - 70); } } </syntaxhighlight> === Version en Processing === Cette version présente en plus la possibilité de sauvegarder les trois valeurs des sliders "sous" chaque touche alpha du clavier. * Une pression sur l'une des 26 lettres de l'alphabet, recharge le preset. * Maj+Touche pour sauvegarder le preset sur cette touche. <syntaxhighlight lang="java"> import controlP5.*; Ronde[] groupe; ControlP5 cp5; int coef1, coef2, coef3, banque; int nbPart, versCentre; boolean oneOrAll; String[] contenu_sauvegarde; void setup() { size(600, 600); noStroke(); frameRate(60); oneOrAll = false; nbPart = 61; versCentre = height/4; banque = 32; contenu_sauvegarde = loadStrings("sauvegarde.txt"); cp5 = new ControlP5(this); cp5.addSlider("coef1") .setPosition(5, 10) .setColorBackground(0) .setColorActive(color(255, 0, 0)) .setColorForeground(color(150, 150, 150)) .setColorCaptionLabel(color(150, 150, 150)) .showTickMarks(true) .setRange(-100, 100) .setWidth(width-40) .setValue(50) ; cp5.addSlider("coef2") .setPosition(5, 20) .setColorBackground(0) .setColorActive(color(255, 0, 0)) .setColorForeground(color(150, 150, 150)) .setColorCaptionLabel(color(150, 150, 150)) .showTickMarks(true) .setRange(-100, 100) .setWidth(width-40) .setValue(100) ; cp5.addSlider("coef3") .setPosition(5, 30) .setColorBackground(0) .setColorActive(color(255, 0, 0)) .setColorForeground(color(150, 150, 150)) .setColorCaptionLabel(color(150, 150, 150)) .showTickMarks(true) .setRange(0, 360) .setWidth(width-40) .setValue(6) ; groupe = new Ronde[3721]; for (int i = 0; i < groupe.length; i++) { groupe[i] = new Ronde(i); } } void draw() { background(0); for (int i = 0; i < nbPart; i++) { groupe[i].affiche(coef1, coef2, coef3, versCentre); } fill(255); text(char(banque), 10, 590); } void keyPressed() { if (key == ' ') { oneOrAll = !oneOrAll; if (oneOrAll) { nbPart = 3721; versCentre = 0; } else { nbPart = 61; versCentre = height/4; } for (int i = 0; i < nbPart; i++) { groupe[i].reset(); } } //// Gestion du chargement et de la sauvegarde for (int i=0; i < 27; i++) { if (key == i+65) { sauvegarde(i); banque = i+65; } if (key == i+97) { chargement(i); banque = i+97; } } //// } void chargement(int place) { int rang = place * 3; contenu_sauvegarde = loadStrings("sauvegarde.txt"); cp5.getController("coef1").setValue(int(contenu_sauvegarde[rang])); cp5.getController("coef2").setValue(int(contenu_sauvegarde[rang+1])); cp5.getController("coef3").setValue(int(contenu_sauvegarde[rang+2])); } void sauvegarde(int place) { int rang = place * 3; contenu_sauvegarde[rang] = String.valueOf(cp5.getController("coef1").getValue()); contenu_sauvegarde[rang+1] = String.valueOf(cp5.getController("coef2").getValue()); contenu_sauvegarde[rang+2] = String.valueOf(cp5.getController("coef3").getValue()); saveStrings("sauvegarde.txt", contenu_sauvegarde); } class Ronde { float angle = 0; float decalage = 0; int ID; float X, Y; int xInit, yInit, compteur; int taille, nbParLigne; int fromSlider; Ronde(int num) { ID = num; taille = 5; nbParLigne = 61; xInit = num%nbParLigne * taille; yInit = num/nbParLigne * taille; compteur = 0; angle = 0; } void affiche(int val1, int val2, int val3, int versCentre) { angle = ID*val3 + frameCount%360; decalage = cos(radians(angle)); X = width/4 + xInit + decalage*val1; Y = height/4 + yInit + decalage*val2 + versCentre; fill(255, 255, 0, 126); rect(X, Y, taille, taille); } void reset() { compteur = 0; } } </syntaxhighlight> === Version en Processing avec de la vidéo === <syntaxhighlight lang="java"> import controlP5.*; import processing.video.*; Ronde[] groupe; ControlP5 cp5; int coef1, coef2, coef3; int nbPart, versCentre; boolean oneOrAll; Capture cam; int Longg = 320; int Largg = 240; int nbPix = Longg*Largg; void setup() { size(600, 600); noStroke(); frameRate(60); oneOrAll = false; nbPart = Longg; versCentre = height/4; cp5 = new ControlP5(this); cp5.addSlider("coef1") .setPosition(5, 10) .setColorBackground(0) .setColorActive(color(255, 0, 0)) .setColorForeground(color(150, 150, 150)) .setColorCaptionLabel(color(150, 150, 150)) .showTickMarks(true) .setRange(-100, 100) .setWidth(width-40) //.setValue(0) ; cp5.addSlider("coef2") .setPosition(5, 20) .setColorBackground(0) .setColorActive(color(255, 0, 0)) .setColorForeground(color(150, 150, 150)) .setColorCaptionLabel(color(150, 150, 150)) .showTickMarks(true) .setRange(-100, 100) .setWidth(width-40) .setValue(50) ; cp5.addSlider("coef3") .setPosition(5, 30) .setColorBackground(0) .setColorActive(color(255, 0, 0)) .setColorForeground(color(150, 150, 150)) .setColorCaptionLabel(color(150, 150, 150)) .showTickMarks(true) .setRange(0, 360) .setWidth(width-40) .setValue(9) ; groupe = new Ronde[nbPix]; for (int i = 0; i < groupe.length; i++) { groupe[i] = new Ronde(i); } cam = new Capture(this, Longg, Largg, "/dev/video0", 20); cam.start(); } void draw() { if (cam.available() == true) { cam.read(); } background(255); for (int i = 0; i < nbPart; i++) { color couleur = cam.pixels[i]; groupe[i].affiche(coef1, coef2, coef3, versCentre, couleur); } } void keyPressed () { if (key == ' ') { oneOrAll = !oneOrAll; if (oneOrAll) { nbPart = nbPix; versCentre = 0; } else { nbPart = Longg; versCentre = height/4; } for (int i = 0; i < nbPart; i++) { groupe[i].reset(); } } } class Ronde { float angle = 0; float decalage = 0; int ID; float X, Y; int xInit, yInit, compteur; int taille, nbParLigne; int fromSlider; Ronde(int num) { ID = num; taille = 1; nbParLigne = 320; xInit = num%nbParLigne * taille; yInit = num/nbParLigne * taille; compteur = 0; angle = 0; } void affiche(int val1, int val2, int val3, int versCentre, color couleur) { angle = ID*val3 + frameCount%360; decalage = cos(radians(angle)); X = width/4 + xInit + decalage*val1; Y = height/4 + yInit + decalage*val2 + versCentre; fill(couleur); rect(X, Y, taille, taille); } void reset() { compteur = 0; } } </syntaxhighlight> [Mon projet | test] [[Catégorie:Processing]]

Résumé :

Modification mineure Suivre cette page

Annuler