Annonce

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


#1 2017-11-26 16:31:51 (Débutante) mettre des formes en mouvement

Cocoht
nouveau membre
Date d'inscription: 2017-11-26
Messages: 2

(Débutante) mettre des formes en mouvement



Bonjour, je viens de commencer sur processing du coup je m'entraine à faire des petits exo simples. Juste là je suis bloquée: j'ai tracé des carrés blanc mais j'aimerais les faire défiler horizontalement, par exemple, comment faire?

J'ai déjà codé ça:

void setup()
{
  size(1000, 1000, FX2D);
  background(0);
  rectMode(CENTER);
  frameRate(1);
    background(0);
  stroke(255);

  /*-------------------------------------

   ---------------------------------------*/

  for (int posX=0; posX<10; posX++) {
    for (int posY=0; posY<10; posY++) {
      fill(255);
      rect(50+posX*100, 50+posY*100, 50, 50);
     
    }
  }
}

Hors ligne

 

#2 2017-11-27 00:02:19 Re : (Débutante) mettre des formes en mouvement

Nnylf
membre
Date d'inscription: 2013-11-30
Messages: 10

Re: (Débutante) mettre des formes en mouvement



Yo,
Je me suis un peu amusé rapidement, et j'ai commenté mon code... Normalement tout est assez explicite.
Lis de la doc et pleins d'autres codes source, et puis fait tourner ton imagination...
Bonne continuation

citation :

void setup() { //setup correspond à l'initialisation du sketch, on peut y faire tout ce qu'on veut, cela sera exécuté une seule fois avant le début de l'application
  size(1000, 1000);  //taille de la fenêtre
  rectMode(CENTER); //mode d'affichage des rect
  strokeWeight(3); //épaisseur des contours
}

//on définit quelques variables globales


float offsetX = 0; //disons l'offsetX pour faire bouger les carrés afficher selon l'axe x
float offsetY = 0; //idem selon l'axe y

float alpha = 0; //un angle qu'on incrémentera à chaque itération pour récupérer son sinus ou cosinus

float colorValue; //pour éviter d'utiliser deux fois la même formule dans draw

void draw() { //la boucle "principale" du code, qui va s'executer à chaque frame, c'est là où l'on va faire notre affichage
 
  colorValue = 255*pow(cos(alpha),2); //valeurs qui évoluent continuellement de 0 à 255
 
  background(colorValue); //background de cette couleur
  stroke(255-colorValue); //les contours des carrés seront de la couleur opposée au background
 
  for (int i=0; i<13; i++) { //on va de 0 à 12 pour bénéficier d'une marge qui laissera un carré affiché lorsque ce dernier arrive vers le bord de l'écran
    for (int j=0; j<13; j++) {
      if (i % 2 == j % 2) { //on colorie un carré sur deux en blanc
        fill(255);
      } else { //l'autre en noir
        fill(0);
      }
      pushMatrix(); // on va effectuer différente modification uniquement sur le carré courant
      translate(((i-2)*100)+offsetX, ((j-2)*100)+offsetY); //on le place à la bonne position sur l'écran
      rotate(-PI*cos(alpha*1.3)); //on le tourne de manière rigolote
      rect(0, 0, 75+25*cos(alpha), 75+25*cos(alpha)); //on l'affiche, pourquoi pas en faisant aussi évoluer sa taille
      popMatrix(); // on passe au carré suivant, donc on ne tient pas compte des translate et rotate précédents
    }
  }
  offsetX = 300*cos(alpha); //l'offsetX évolue continuellement de -300 à 300
  offsetY = 300*sin(alpha); //l'offsetY évolue continuellement de -300 à 300 avec un déphasage par rapport à X de pi/2
  offsetX = ((offsetX%200)+200)%200; //on veut que les valeurs d'offset soient telles qu'elles ne fassent pas sortir les carrés de l'écran, on applique un modulo "au bon moment" pour créer l'illusion d'une transition fluide
  offsetY = ((offsetY%200)+200)%200; //idem en y
  alpha+=PI/200; //et bien sûr pour que tout cela soit effectivement animé il faut faire varier la valeur de alpha à chaque frame
}

Dernière modification par Nnylf (2017-11-27 00:03:42)


Les questions importantes doivent être traitées légèrement,
Les questions sans importance doivent être traitées sérieusement.

Hors ligne

 

#3 2017-12-09 11:02:47 Re : (Débutante) mettre des formes en mouvement

leonaE115
nouveau membre
Date d'inscription: 2017-12-09
Messages: 1

Re: (Débutante) mettre des formes en mouvement



Cocoht a écrit:

Bonjour, je viens de commencer sur processing du coup je m'entraine à faire des petits exo simples. Juste là je suis bloquée: j'ai tracé des carrés répartiteurs de charge blanc mais j'aimerais les faire défiler horizontalement, par exemple, comment faire?

Bonjour,
Vous êtes déjà sur la bonne voie je trouve!
Et je vous encourage a bien vouloir continuer!

Hors ligne

 

fil rss de cette discussion : rss

Pied de page des forums

Powered by FluxBB

codelab, graphisme & code : emoc / 2008-2018