Annonce

>>> Bienvenue sur codelab! >>> Première visite ? >>> quelques mots sur codelab //// une carte des membres//// (apéros) codelab


#1 2016-03-17 00:07:14 générer une forme au clic

tm49
nouveau membre
Date d'inscription: 2016-03-16
Messages: 6

générer une forme au clic



bonjour,
Je débute avec Processing et la méthode draw() me pose problème : je souhaite générer 4 ronds suite à 4 clics.
Soit je ne mets pas de boucle while et cela ne s'arrête jamais du fait que draw tourne à l'infini, soit je mets la boucle while et il ne se passe rien.
Dans la suite de mon travail, les cercles devront être tracés en fonction de la position de la souris au moment de cliquer.
Merci pour vos éclairages.

1 void setup(){
2    size(500,500); 
3 }
4  
5 void draw(){
6   int i=0;
7   while (i<5) {
8     if(mousePressed==true){
9       ellipse(mouseX,mouseY,20,20);
10      i=i+1;
11      }
12   }
13 }

Hors ligne

 

#2 2016-03-17 09:10:50 Re : générer une forme au clic

Mushussu
membre
Lieu: Orléans
Date d'inscription: 2012-05-24
Messages: 802

Re: générer une forme au clic



Bonjour,

Il faut voir la méthode draw() comme une boucle qui affiche ce qu'il y a dans son corps juste à la fin. Il faut dessiner les objets à chaque tour. Dans ton cas il faut sauvegarder les coordonnées de chaque disque. Pour cela j'utilise un tableau. Il existe un objet idéal pour stocker des coordonnées, c'est le PVector.
J'utilise aussi la méthode mousePressed() qui est appelée à chaque fois que le bouton de la souris est pressé.
Si tu as d'autres questions n'hésite pas.

PVector[] tableau;
int taille;

void setup() {
  size(500, 500); 
  tableau = new PVector[4];
  taille = 0;
  fill(255, 0, 0);
  noStroke();
}

void draw() {
  background(255);
  for (int i = 0; i < taille; i++) {
    ellipse(tableau[i].x, tableau[i].y, 50, 50);
  }
}

void mousePressed() {
  if (taille < tableau.length) {
    tableau[taille] = new PVector(mouseX, mouseY);
    taille++;
  }
}

Hors ligne

 

#3 2016-03-17 12:52:34 Re : générer une forme au clic

tm49
nouveau membre
Date d'inscription: 2016-03-16
Messages: 6

Re: générer une forme au clic



merci pour cette réponse rapide, je regarde cela.

Dernière modification par tm49 (2016-03-17 12:56:41)

Hors ligne

 

#4 2016-03-18 18:28:57 Re : générer une forme au clic

tm49
nouveau membre
Date d'inscription: 2016-03-16
Messages: 6

Re: générer une forme au clic



Bonjour,
J'ai compris le principe... je crois.
Mais comment gère-t-on les boucles et les conditions dans ce cas ? Par exemple, je veux tracer 4 cercles sur une même ligne puis, selon une condition (un test, l'appui sur une touche, la position de la souris...), en tracer 4 autres sur une deuxième ligne, etc...
Où doit-on mettre les boucles et le test ?
Je mets un essai, dans lequel je suis passé à un tableau à deux dimensions
Merci

PVector[][] tabCercle;
int taillei,taillej,i,j;
int xr=10;
  int yr=10;
void setup() {
  
  size(330,560); 
  tabCercle = new PVector[4][10];
  taillei = 0;
  taillej=0;
  fill(255, 0, 0);
}

void draw() {
  background(255);
  for (j = 0; j < taillej; j++) {
    for (i = 0; i < taillei; i++) {
      ellipse(tabCercle[i][j].x, tabCercle[i][j].y, 20, 20);
    }
  }  
}

void mousePressed() {
  if (taillei < 4) {
    tabCercle[taillei][taillej] = new PVector(xr+20+30*i,yr+20+50*j);
    taillei++;
  }
  else if (taillej<10) {
    taillei=0;
    taillej++;
  }
    else if (taillej==10){
      noLoop();
    }
}

Dernière modification par tm49 (2016-03-18 18:52:49)

Hors ligne

 

#5 2016-03-18 23:26:59 Re : générer une forme au clic

Mushussu
membre
Lieu: Orléans
Date d'inscription: 2012-05-24
Messages: 802

Re: générer une forme au clic



Bonsoir,

Pas besoin de passer avec un tableau en deux dimensions. Il suffit bien indiquer dans les PVector la ligne qu'ils doivent prendre.
Comme je n'ai pas bien saisi ta demande, je te propose ceci :

ArrayList<PVector> tableau;
int taille;

void setup() {
  size(500, 500); 
  tableau = new ArrayList<PVector>();
  taille = 0;
  fill(255, 0, 0);
  noStroke();
}

void draw() {
  background(255);
  for (PVector p : tableau) {
    ellipse(p.x, p.y, 50, 50);
  }
}

void mousePressed() {
  PVector p = new PVector(mouseX, (taille / 4) * 60 + 30);
  tableau.add(p);
  taille++;
}

J'ai utiliser un ArrayList qui est un tableau dynamique.

Hors ligne

 

#6 2016-03-19 08:52:58 Re : générer une forme au clic

tm49
nouveau membre
Date d'inscription: 2016-03-16
Messages: 6

Re: générer une forme au clic



bonjour,
En effet ma demande n'est pas clair. Donc au départ je veux tracer 4 ronds sur une même ligne suite à 4 clics de souris.  Grâce à ton premier code j'ai compris comment faire.

Pour aller pus loin, je veux qu'au 5ème clic, on démarre le traçage des ronds sur une autre ligne, en conservant à l'écran ceux déjà tracés. Dans le code que j'ai proposé le 18/03 (hier), je n'y arrive que partiellement. Je remets le code que j'ai corrigé, mais qui ne fait pas encore ce que je veux. J'ai mis en commentaires ce qui ne marche pas et j'ai fait des tests avec print pour voir où j'en suis dans le programme.

De plus, je ne sais pas bien comment gérer des conditions : dans draw ou dans mousePressed ? Par exemple, on trace un rond que si on clique dans une zone définie.

J'espère avoir été plus clair. Merci encore.

PVector[][] tabCercle;
int taillei,taillej,i,j;
int xr=10;
int yr=10;

void setup() {
  
  size(330,560); 
  tabCercle = new PVector[4][10];

  taillei = 0;
  taillej=0;
  fill(255, 0, 0);
}

void draw() {
  background(255);
    for (j = 0; j < taillej+1; j++) {
    for (i = 0; i < taillei; i++) {
      //ellipse(tabCercle[i][j].x, tabCercle[i][j].y, 20, 20);
     ellipse(20+30*i, 20+50*j,20,20);
    }
    }
}

void mousePressed() {
 
 if (taillei < 4) {
    //tabCercle[taillei][taillej] = new PVector(xr+20+30*i,yr+20+50*j);
    print(taillei);
    taillei++;
  }
 else if (taillej<10) {
    taillei=0;
    taillej++;
    println();
    println("taillei = "+taillei);
    println("taillej = "+taillej);
  }
  /*  else if (taillej==10){
      noLoop();
    }*/
}

Dernière modification par tm49 (2016-03-19 08:54:53)

Hors ligne

 

#7 2016-03-19 13:53:29 Re : générer une forme au clic

Mushussu
membre
Lieu: Orléans
Date d'inscription: 2012-05-24
Messages: 802

Re: générer une forme au clic



Bonjour,

Tu as deux possibilités alors soit stocker les coordonnées des disques dans un tableau et ensuite les afficher, soit stocker le nombre de disques présent et à l'affichage placer les disques en fonction du nombre. Pour la zone sensible, il faut tester la présence de la souris dans une zone.

ArrayList<PVector> tableau;

void setup() {
  size(330, 560); 
  tableau = new ArrayList<PVector>();
}

void draw() {
  background(255);
  fill(255, 0, 0);
  for (PVector p : tableau) {
    ellipse(p.x, p.y, 20, 20);
  }
  fill(0, 255, 0);
  ellipse(3 * width / 4, height / 2, 100, 100);
}

void mousePressed() {
  if (dist(mouseX, mouseY, 3 * width / 4, height / 2) < 50) { // Verifie si la souris est dans le cercle
    PVector p = new PVector(30 * (tableau.size() % 4) + 20, (tableau.size() / 4) * 50 + 20);
    tableau.add(p);
  }
}

Hors ligne

 

#8 2016-03-19 14:49:10 Re : générer une forme au clic

tm49
nouveau membre
Date d'inscription: 2016-03-16
Messages: 6

Re: générer une forme au clic



Merci beaucoup pour tes éclairages et tes réponses rapides ! J'obtiens exactement ce que je voulais.

Peux-tu me confirmer une chose : un tableau dynamique se construit au fur et à mesure, sans avoir à déclarer une dimension.

J'ai une autre question (besoin de faire un autre post ?) : comment faire une saisie (d'un nombre, par exemple demander l'âge d'une personne, ou d'un mot) avec le clavier ? Il n'existe pas de fonction genre read()...

Hors ligne

 

#9 2016-03-19 19:13:58 Re : générer une forme au clic

Mushussu
membre
Lieu: Orléans
Date d'inscription: 2012-05-24
Messages: 802

Re: générer une forme au clic



Effectivement, un tableau dynamique a une taille nulle à l'initialisation et à chaque fois que tu ajoutes un élément la taille s'ajuste.

Pour la méthode read que tu souhaites, il existe une librairie ControlP5 qui a un objet TextField. Une fois que tu as ajouter la librairie, tu peux explorer les exemples pour te familiariser avec elle;

Hors ligne

 

fil rss de cette discussion : rss

Pied de page des forums

Powered by FluxBB

codelab, graphisme & code : emoc / 2008-2024