Générateur de visuels sur Processing

C’est exact, ça fait 10 ans que je n’ai plus tapé “Vector” dans une ligne de code, elle n’est là que pour des raisons de compatibilité (mais fonctionne bien si tu en acceptes les limitations).

C’est moi Julien (et je comprends rien à ce thread) :D.

1 « J'aime »

Ca colle avec la dernière fois que j’ai dev en Java :smiley:

Merci pour les infos en tout cas :smile:

Bonsoir à tous,
merci pour vos réponses, j’ai remanié le code mais je ne pense pas y être encore, par ailleurs processing m’affiche l’erreur “the constructor Shape(int,int)” does not exist" et je ne comprends pas pourquoi.
Donc pour l’instant je suis bloquée là déjà parce qu’il m’est impossible d’exécuter le programme.

J’attends vos lumières pour ça, et pour la résolution du problème dans son ensemble haha ^^ merci merci merci !

ArrayList shapeArray; 
int mouseXold=displayWidth/2;
int mouseYold=displayHeight/2;

void setup() {
 
 size(displayWidth, displayHeight);
 background (255);
 smooth();
 //initialisation
 shapeArray = new ArrayList(); 

}


void draw() {
  
  Shape myShape = new Shape(mouseX, mouseY);
  shapeArray.add(myShape);
 
if(mouseXold != mouseX ||mouseYold != mouseY  ){
      
      mouseXold = mouseX;
      mouseYold = mouseY;
      Shape myShape = new Shape(200,200);
      shapeArray.add(myShape);

          for(int i = 0; i < shapeArray.size(); i++) {
          Shape nb = (Shape) shapeArray.get(i);
          nb.run();
          shapeArray=shapeArray+1; 
          shapeArray=shapeArray+1;  }
      }
}

Mon onglet de classe nommé “Shape”

class Shape
{ 
  color colour; 
  float shapeWidth=5; // largeur du carré 
  float shapeHeight=5; //hauteur du carré
  int j=0; //variable d'incrémentation carré dans carré
  int max=1; //nombre d'itération, soit le nb de carrés dans le carré
  
  //constructeur
  Shape (color colour, float shapeWidth, float shapeHeight)  { 
    this.colour = colour; 
    this.shapeWidth = shapeWidth; 
    this.shapeHeight = shapeHeight; 
  } 
  
  void display() 
  { 
    smooth(); 
    stroke(random(255),random(255),random(255)); 
    strokeWeight(1);
    noFill();
    rectMode(CENTER); 
    rect(mouseX, mouseY, shapeWidth, shapeHeight); 
    
    for(j=0;j<max;j++){
    shapeWidth=shapeWidth+1; 
    shapeHeight=shapeHeight+1;    
  } 
    
   
  } 
}

tu as cette ligne

Shape myShape = new Shape(200,200).

“new Shape( x, y )” c’est faire appel a ce que l’on nomme un constructeur. En l’occurence, tu appelles un constructeur avec 2 arguments qui sont de type entier, et qui ont comme valeur 200 et 200. Du coup, Processing s’attend a trouver un constructeur dans la classe Shape qui correspond a cette signature: Shape(int, int).

Or, dans Shape, on voit que le constructeur a la signature suivante: Shape(colour, float, float). Du coup, Processing il pige pas, il ne sait pas quoi creer vu que rien ne correspond.

Soit tu remplaces ton new Shape par quelque chose plus proche de la signature existante:
new Shape( , 200f, 200f);

Soit tu implementes un nouveau constructeur, avec la signature Shape(int, int), et tu fais les conversions et initialisations necessaires dans ce constructeur (une couleur, transformer les int en float, etc)

Merci Ravine, ça fonctionne! Cependant je n’arrive toujours pas à faire grandir tous les carrés indéfiniment.
De plus je n’arrive pas à faire en sorte que chaque carré créé par un nouveau mouseX, mouseY soit petit (tout grandit proportionellement), alors que j’avais réussi à le faire sans les Arraylist. Je sais que c’est un soucis « d’emboitement » mais là je bloque vraiment… Je suis novice en code et j’ai une formation limitée en mathématiques et je galère depuis 3 jours :confused:
Si quelqu’un pouvait m’aider à mettre les chose à la bonne place je lui serais ultra reconnaissante :pray:

ArrayList shapeArray; 
int mouseXold=displayWidth/2;
int mouseYold=displayHeight/2;
float shapeWidth=10; // largeur du carré 
float shapeHeight=10;

void setup() {
 
 size(displayWidth, displayHeight);
 background (255);
 smooth();
 //initialisation
 shapeArray = new ArrayList(); 

}


void draw() {
  
  Shape myShape = new Shape(int(10), int(10));
  shapeArray.add(myShape);
 
if(mouseXold != mouseX ||mouseYold != mouseY  ){
      
      mouseXold = mouseX;
      mouseYold = mouseY;
      shapeWidth=5;
      shapeHeight=5;
    }
   
      
      shapeArray.add(myShape);

          for(int i = 0; i < shapeArray.size(); i++) {
          Shape carre = (Shape) shapeArray.get(i);
          carre.run();
            }
      }

Onglet classe shape

class Shape
{ 
  float shapeWidth=5; // largeur du carré 
  float shapeHeight=5; //hauteur du carré
  int j=0; //variable d'incrémentation carré dans carré
  int max=1; //nombre d'itération, soit le nb de carrés dans le carré
  
  //constructeur
  Shape (float shapeWidth, float shapeHeight)  { 
    this.shapeWidth = shapeWidth; 
    this.shapeHeight = shapeHeight; 
  } 
  
  void run() {
    display();
    growth();
  }
  
  void display() 
  { 
    smooth(); 
    stroke(random(255),random(255),random(255)); 
    strokeWeight(1);
    noFill();
    rectMode(CENTER); 
    rect(mouseX, mouseY, shapeWidth, shapeHeight); 
  }
  
  void growth() {
    for(j=0;j<max;j++){
    shapeWidth=shapeWidth+1; 
    shapeHeight=shapeHeight+1;    
  } 
    
   
  } 
}

En fait, il y a plusieurs petits points qui ne sont pas à leur place :

  • Tu ajoutes des carrés à ta liste deux fois dans draw(); et deux fois le meme carré.
  • Tu utilises un constructeur avec une taille, mais finalement tu as aussi une taille de defini dans les membres de ta classe, et tu la passes en dur, c’est pas utile.
  • Tu memorises pas la position des tes carrées dans la classe. C’est ca qu’il faut passer au constructeur, pas la taille.

Essaye ca :

Main

ArrayList shapeArray; 
int mouseXold=displayWidth/2;
int mouseYold=displayHeight/2;

void setup() {
 
 size(displayWidth, displayHeight);
 background (255);
 smooth();
 //initialisation
 shapeArray = new ArrayList(); 
}


void draw() {
   if(mouseXold != mouseX ||mouseYold != mouseY  ){
         // on ajoute un carre que si on bouge la souris, à la nouvelle position, de taille initiale
         Shape myShape = new Shape(mouseX, mouseY); 
         shapeArray.add(myShape);
         mouseXold = mouseX;
         mouseYold = mouseY;
    }
    for(int i = 0; i < shapeArray.size(); i++) {
       Shape carre = (Shape) shapeArray.get(i);
        carre.run();
     }
 }

Onglet classe shape

class Shape
{ 
  float _shapeWidth=5; // largeur du carré 
  float _shapeHeight=5; //hauteur du carré
  int _posX, _posY;
  
  //constructeur
  Shape (float mouseX, float mouseY)  { 
    _posX= mouseX; 
    _posY = mouseY; 
  } 
  
  void run() {
    display();
    growth();
  }
  
  void display() 
  { 
    smooth(); 
    stroke(random(255),random(255),random(255)); 
    strokeWeight(1);
    noFill();
    rectMode(CENTER); 
    rect(_posX, _posY, _shapeWidth, _shapeHeight); 
  }
  
  void growth() {
    _shapeWidth++; 
    _shapeHeight++;    
  } 
    
   
  } 
}

La programmation, ca parait complique comme ca, mais au final ecrire un programme, ce n’est ni plus ni moins qu’ecrire une recette de cuisine. Le plus chiant etant bien souvent de determiner quelles sont les etapes dont tu vas avoir besoin pour arriver a ton resultat.

Si tu es bloquee, et si tu veux apprendre par toi meme sans avoir la frustration de ne pas voir ton projet avancer aussi rapidement que tu le souhaites, tu peux suivre les cours dispos sur le site KhanAcademy en parallele

Garde bien en tete que ce n’est pas exactement le meme langage (JS et Java sont cousins eloignes, mais ont quelques differences assez fondamentales), mais ce que tu y apprendras restera applicable quelle que soit la technologie/le langage que tu aborderas. Les principes de base de programmation sont commun a quasi toutes les techs (les types, definir tes types, les structures de donnees, les collections, les algorithmes, etc).

En esperant que ca te debloque.

1 « J'aime »

Bon alors, ca marche ?

Je suis désolée de pas avoir répondu plutôt, j’ai chopée une gastro et bcp de boulot cette semaine. Bref.

C’est génial!! Oui c’est exactement ça que je cherchais. Bon maintenant je me rend compte que les lignes se croisent entre elles et que j’aimerais que chaque carré s’arrêtent là où un autre commence donc je suis repartie dans des recherches. Je regarde les forces sur java, je me dis que ça peut peut être être une solution. A moins que vous ayez une meilleure idée?

Je m’entraine sur https://codeacademy.com mais je vais aller voir du côté de Khan aussi alors :smile:

Merci beaucoup en tout cas, vous m’avez énormément aidée! :beers:

Moi je te conseille les cours de l’Ecole Polytechnique de Lausanne sur Coursera que je trouve vraiment pas mal. Il y a en plus des exercices pour s’entrainer.
Part 1 : https://www.coursera.org/course/initprogjava
Part 2 : https://www.coursera.org/course/intropoocpp

Pas de soucis :smile:

A bah super, content que ca fasse ce que tu voulais.

Si tu veux pas que les lignes se croisent et que chaque carré s’arrête où un autre commence, c’est plus complexe : il faut, avant de faire grossir le carré en cours, que tu verifies s’il ne va pas couper un autre carré, et donc parcourir tous les autres carrés pour tester leurs positions.
C’est un gros cran au dessus, mais c’est bien sur faisable :wink:

You’re welcome :smile:

Hello! Je suis de retour!
Je suis en train de connecter mon Arduino à Processing et je reçois ce message d’erreur quand je lance le programme : ArrayIndexOutOfBoundsException: 1
Il me semble que ça doit être un problème avec mon tableau qui n’est pas assez grand, mais je m’en sors pas trop. Une idée?

import glitchP5.*; //import Glitch P5
String portName = "/dev/cu.usbmodem1421"; 
String serial;   //déclaration de serial comme résultat de la communication
import processing.serial.*;
Serial myPort;
int linefeed = 10; 
int numSensors = 3; 
float sensors[]; 
float pSensors[];
float bornexinf=0; 
float bornexsup=0;
float borneyinf=0; 
float borneysup=0; 
float rotxold=0; 
float rotyold=0; 
//chaine pour la vibration
int end = 10;    //Le nombre 10 en ASCII pour linefeed marquant la fin du serial.println
GlitchP5 glitchP5;
int j=0; //variable d'incrémentation carré dans carré
int max=1; //nombre d'itération, soit le nb de carrés dans le carré
int longueur=10; // longueur du carré 
int largeur=10; //largeur du carré
float value=0; //variable pour la rotation
float mouseXold=displayWidth/2;
float mouseYold=displayHeight/2;

void setup() {
 
 size(displayWidth, displayHeight);
 background (255);
 smooth();

  myPort = new Serial(this, portName, 9600);
  myPort.bufferUntil(linefeed);
  serial = myPort.readStringUntil(end); // fonction qui lit la chaine de caractères depuis le port série jusqu'à println et ensuite assigne string à notre variable qui appelle serial
  serial = null; // initialisation de serial
 //noiseSeed(0);
 glitchP5 = new GlitchP5(this); // initiate the glitchP5 instance;
}


void draw() {
  
  while (myPort.available() > 0) { //tant qu'il n'y a pas de données provenant du port  on lit l'entrée série
    serial = myPort.readStringUntil(end);
  }
    if (serial != null) {  
      String[] a = split(serial, ','); //on créé un tableau qui définit une chaine séparée par des virgules. 
      println(a[0]); //on affiche la première valeur du tableau
      
    }
  
  if((pSensors != null)&&(sensors != null)) { 
    float  rotx = (sensors[0]*10);
    float  roty = (sensors[1]*10);
    float  rotz = (sensors[2]*PI)/180;
    
strokeWeight(1);
noFill(); 
stroke(random(255),random(255),random(255));
translate(500,150);
rectMode(CENTER);

for(j=0;j<max;j++){
    longueur=longueur+1; 
    largeur=largeur+1; 
    translate(width/2, height/2);
    rotate(value);
    translate(-width/2, -height/2);
    rect(rotx,roty,longueur,largeur); 
    redraw();
    bornexinf=rotxold-5; 
    bornexsup=rotxold+5;
    borneyinf=rotyold-5; 
    borneysup=rotyold+5; 
    if(bornexinf>rotx || rotx>bornexsup || borneyinf>roty || roty>borneysup){
    longueur=5;
    largeur=5;
    }
    rotxold=rotx;
    rotyold=roty;
}
  }
 glitchP5.run(); 
}


void serialEvent(Serial myPort) {

  String myString = myPort.readStringUntil(linefeed);
       if (myString != null) {
       myString = trim(myString);
       pSensors = sensors;
       sensors = float(split(myString, ','));

            for (int sensorNum = 0; sensorNum < sensors.length; sensorNum++) {
            print("Sensor " + sensorNum + ": " + sensors[sensorNum] + "\t");
    }
       println();
  }
}

void mousePressed()
{
 // trigger a glitch: glitchP5.glitch(  posX,       // 
 //                               posY,       // position on screen(int)
 //          posJitterX,     // 
 //          posJitterY,     // max. position offset(int)
 //          sizeX,       // 
 //          sizeY,       // size (int)
 //          numberOfGlitches,   // number of individual glitches (int)
 //          randomness,     // this is a jitter for size (float)
 //          attack,     // max time (in frames) until indiv. glitch appears (int)
 //          sustain      // max time until it dies off after appearing (int)
 //              );

 glitchP5.glitch(mouseX, mouseY, 200, 400, 200, 60, 120, 10.0f, 20, 1);
}

a première vu, il manque initialisation du tableau : float sensors = new float[6]; par exemple

Je pense que ca vient de la. L’erreur ArrayOutOfBoundException veut dire que tu veux acceder à un element d’un tableau qui n’existe pas.
Or cette partie de code ne teste pas le retour de ton split. Si le tableau est vide, ton sensors[sensorNum] tape dans une zone qui n’existe pas, et qui va te renvoyer une exception.

Rajoute un test sur sensors avant ton for.

Je comprends pas trop ce que tu me suggères :confused:

Cette ligne est censé te retourner dans le tableau sensors une liste de float séparé par des virgules.

Derrière, tu parcours le tableau (la boucle for) pour faire des trucs avec ces chiffres.
Tout marche bien si ta variable myString contient bien des floats séparés par des virgules.

Mais si il y a une erreur sur le contenu de myString (typiquement, il y a rien ou autre chose que des float séparé par des virgules), ton tableau sensors va etre vide, et ton sensors[sensorNum] va te renvoyer l’erreur ArrayIndexOutOfBoundsException.

Donc regarde partout dans ton code ou tu accèdes a des tableaux.

Avant d’utiliser le tableau “sensors”, apres le split il faut s’assurer avec sensors.length qu’il y a bien le nombre d’éléments souhaité

Ok, je me replonge dedans! Merci!

hmmm ca fait une paye que je n’ai pas fait de java, mais la syntaxe ne serait pas plutot du style

float[] sensors;

les [] se declarent sur le type d’abord (en l’occurence, on declare ici un tableau de floats, qui s’appelle “sensors”), et ensuite on y accede en faisant sensors[index] ?