# Problème d'animation

**URL:** https://discourse.processing.org/t/probleme-danimation/24372
**Category:** Coding Questions
**Created:** [October 5, 2020, 10:10pm UTC](https://discourse.processing.org/t/probleme-danimation/24372 "2020-10-05T22:10:31Z")
**Posts on this page:** 6
**Page:** 1

<div class="post-metadata">

### Author: ![nina](https://avatars.discourse-cdn.com/v4/letter/n/e68b1a/32.png) [@nina](https://discourse.processing.org/u/nina)
#### Post date: [October 5, 2020, 10:10pm UTC](https://discourse.processing.org/t/probleme-danimation/24372/1 "2020-10-05T22:10:31Z")

</div>

Bonsoir , j’ai un problème avec mon programme j’ai fait une maison mais, je n’arrive pas à intégrer la pluie (comme animation). Ce sont les codes mit en commentaire dans mon programme .  
Pouvez-vous m’aidez à corriger ce problème, s’il vous plait.  
je vous remercie d’avance .  
cordialement,  
Nina  
//------------------------  
void setup(){  
size(500,500);  
background(196);  
//------------------------

//maison  
pushStyle();  
fill(66,67,72);  
rectMode(CORNERS);  
rect(40,250,200,100);  
quad(200,100,200,250,245,230,245,138);  
stroke(0);

//-------------------------  
//les fenêtres

pushStyle();  
fill(255);

pushStyle();  
fill(227,227,227);  
tint(0,153,204,126);  
rect(60,120,100,170,2);  
fill(255);  
rect(180,120,100,170);  
fill(227,227,227);

rect(180,120,140,170,2);

int deplacementY=150;  
int deplacementY2=deplacementY-5;  
line(60,deplacementY2,100,deplacementY2);  
line(140,deplacementY2,180,deplacementY2);  
popStyle();

//---------------------------------  
pushStyle();  
// la porte  
fill(160);  
rect(110,250,140,190);  
popStyle();  
pushStyle();  
fill(227,227,229);  
rect(150,249,140,190);  
rect(100,249,110,190);  
popStyle();

//------------------------  
//LE TOIT  
pushStyle();  
fill(132,52,53);

triangle(40,100,200,100,150,10);  
triangle(200,100,247,141.5,150,10);  
popStyle();

line(78,70,182,70);  
int constructionY=70;  
constructionY=constructionY-15;  
line(95,constructionY,175,constructionY);  
constructionY=constructionY-15;  
line(115,constructionY,165,constructionY);  
constructionY=constructionY-15;  
line(131,constructionY,159,constructionY);

constructionY=constructionY+60;  
line(60,constructionY,190,constructionY);

line(185,70,200,80);  
line(175,75-20,190,80-15);  
line(168,70-30,180,70-20);  
line(160,70-45,168,70-35);  
line(193,66+20,223,80+30);

//------------------------------

//côté gauche de la maison

pushStyle();  
fill(132,52,53);  
rect(1,70,39,250);  
triangle(55,89,40,99,40,69);  
popStyle();  
pushStyle();  
fill(242,241,247);  
triangle(1,70,20,30,40,70);  
line(40,70,55,89);  
triangle(54,87,20,30,40,70);  
popStyle();

//------------------------------

//la fenêtre de la maison de gauche

//pushStyle();  
fill(115,115 , 125);  
rectMode(CORNER);  
rect(7,80,25,60,2);  
strokeWeight(2);  
fill(255);  
rect(10,80,19,60,2);  
stroke(0);

//fill(255);  
line(20,140,20,80);  
line(30,110,9,110);  
//stroke(0);  
strokeWeight(1);  
;  
ellipse(20,55,10,20);  
//stroke(255);  
strokeWeight(2);  
line(24,55,15,55);  
line(20,45,20,65);  
strokeWeight(1);  
//stroke(0);  
//popStyle();

//--------------------------

//fill(255);  
//pierre maison principal  
stroke(255);  
for(int i=100; i \<250 ; i= i+ 16) {  
rect(40,i,10,5);  
}  
for(int i=100; i \<250 ; i= i+ 16) {  
rect(190,i,10,5);  
}  
stroke(0);  
//---------------------------------

//les pierres maison de gauche celle du bas  
for(int i=150; i \<250 ; i= i+ 15) {  
rect(30,i,10,5);  
}  
for(int i=150; i \<250 ; i= i+ 15) {  
rect(0,i,10,5);  
}  
//--------------------------------

// pierres contours de la fenêtre  
rect(0,140,10,5);  
rect(10,140,10,5);  
rect(20,140,10,5);  
rect(30,140,10,5);  
for(int i=80; i \<132 ; i= i+ 10){  
rect(0,i,6,10);  
}  
for(int i=80; i \<132 ; i= i+ 10){  
rect(32,i,6,10);  
}  
//-------------------------------

//pierre du haut de la fenêtre  
rect(0,70,10,5);  
rect(10,70,10,5);  
rect(20,70,10,5);  
rect(30,70,10,5);  
//-------------------------------

//garage

rectMode(CENTER);  
fill(242,241,247);  
rect(300,195,190,110);  
fill(23,24,28);  
stroke(0);  
rectMode(CENTER);  
rect(300,200,130,100);

fill(242,241,247);  
quad(396,140,396,250,420,220,420,150);  
//------------------------------------

//les pierres sur le garage  
stroke(255);  
for(int i = 150; i \< 255 ; i = i + 20) {  
line(365, i, 235, i);  
}  
stroke(0);  
for(int i=147; i \< 260; i= i+ 32 ) {  
rect(380,i,30,15);  
}

for(int i=255; i \< 380; i= i+ 45 ) {  
rect(i,145,20,10);  
}

for(int i=147; i \< 260; i= i+ 32 ) {

rect(220,i,30,15);  
}

quad(396,235,396,250,420,220,420,210);  
quad(396,219,396,250,420,220,420,195);  
quad(396,202,396,250,420,220,420,180);  
quad(396,185,396,250,420,220,420,165);  
quad(396,170,396,250,420,220,420,150);  
fill(255);  
line(396,155,410,145);  
noStroke();  
ellipse(300,230,10,10);  
stroke(0);  
//-----------------------------------

//le chemin  
pushStyle();  
fill(184,183,188);  
stroke(184,183,188);  
quad(150,250,100,250,50,450,250,450);  
popStyle();  
//----------------------------------

// barriere  
fill(23,24,28);  
rect(200,399,90,100);  
rect(109,399,90,100);  
//-----------------------------

//stylisation du portails  
pushStyle();  
stroke(255);  
for(int i=250; i \< 320; i= i+ 34 ) {  
rect(i,448,30,15);  
}  
for(int i=350; i \< 400; i= i+ 15 ) {  
line(78,i,152,i);  
}

for(int i=380; i \< 452; i= i+ 15 ) {  
line(78,i,152,i);  
}

for(int i=410; i \< 450; i= i+ 15 ) {  
line(158,i,252,i);  
}

for(int i=350; i \< 400; i= i+ 15 ) {  
line(158,i,250,i);  
}  
fill(255);  
rect(0,400,150,110);  
rect(390,400,310,110);  
popStyle();

//----------------------------------  
stroke(19);  
fill(160);  
//pierre LES MURS DU PORTAIL  
for(int i=251; i \< 500; i= i+ 34 ) {  
rect(i,448,30,15);  
}  
for(int i=252; i \< 500; i= i+ 34) {  
rect(i,448,30,15);  
}

for(int i=251; i \< 500; i= i+ 34) {  
rect(i,430,30,15);  
}  
for(int i=252; i \< 500; i= i+ 34) {  
rect(i,430,30,15);  
}  
for(int i=251; i \< 500; i= i+ 34) {  
rect(i,412,30,15);  
}  
for(int i=252; i \< 500; i= i+ 34) {  
rect(i,412,30,15);  
}

for(int i=251; i \< 500; i= i+ 34) {  
rect(i,393,30,15);  
}  
for(int i=252; i \< 500; i= i+ 34) {  
rect(i,393,30,15);  
}

for(int i=251; i \< 500; i= i+ 34) {  
rect(i,374,30,15);  
}  
for(int i=252; i \< 500; i= i+ 34) {  
rect(i,374,30,15);  
}

for(int i=251; i \< 500; i= i+ 34) {  
rect(i,354,30,15);  
}

for(int i=252; i \< 500; i= i+ 34) {  
rect(i,354,30,15);  
}

for(int i=-9; i \<85; i= i+ 34) {  
rect(i,354,30,15);  
}  
for(int i=-10; i \<85; i= i+ 34) {  
rect(i,354,30,15);  
}  
for(int i=-9; i \<80; i= i+ 34) {  
rect(i,375,30,15);  
}  
for(int i=-10; i \<85; i= i+ 34) {  
rect(i,375,30,15);  
}  
for(int i=-9; i \<80; i= i+ 34) {  
rect(i,380+20-5,30,15);  
}  
for(int i=-10; i \<80; i= i+ 34) {  
rect(i,380+20-5,30,15);  
}  
for(int i=-9; i \<80; i= i+ 34) {  
rect(i,380+40-5,30,15);  
}  
for(int i=-10; i \<80; i= i+ 34) {  
rect(i,380+40-5,30,15);  
}  
for(int i=-9; i \<80; i= i+ 34) {  
rect(i,380+51,30,12);  
}  
for(int i=-10; i \<80; i= i+ 34) {  
rect(i,380+51,30,12);  
}  
for(int i=-9; i \<80; i= i+ 34) {  
rect(i,380+68,30,15);  
}  
for(int i=-10; i \<80; i= i+ 34) {  
rect(i,380+68,30,15);  
}

noFill();  
quad(396,235,396,250,420,220,420,210);  
quad(396,219,396,250,420,220,420,195);  
quad(396,202,396,250,420,220,420,180);  
quad(396,185,396,250,420,220,420,165);  
quad(396,170,396,250,420,220,420,150);

fill(255);  
//--------------------------------------

//le gazon  
fill(31,136,13);  
stroke(16,68,6);  
quad(198,344,500,345,500,250,150,250);  
quad(0,345,75,345,100,250,0,250);  
//quad(235,350,235,345,198,345,200,350);  
stroke(0);  
fill(255);

stroke(0);  
strokeWeight(1);  
//-----------------------------------  
//la pornet

fill(35);  
rect(115,225,10,3,2);  
rect(113,225,5,15);

//----------------------------------  
//le jardin  
fill(156,204,45);  
stroke(16,68,6);  
quad(500,220,420,220,397,250,500,250);  
fill(255);  
stroke(0);  
//---------------------------------

//trottoir  
stroke(114,120,129);  
fill(114,120,129);  
quad(0,500,0,454,500,454,500,500);  
//--------------------------------

//l’arbre et arbustre  
fill(29,63,28);  
stroke(29,63,28);  
arc(480,220,40,40,-PI,0);  
arc(440,220,40,40,-PI,0);  
fill(81,40,0);  
stroke(81,40,0);  
rect(455,195,15,50);  
stroke(0);  
fill(29,63,28);  
stroke(29,63,28);  
triangle(420,170,450,50,495,170);  
stroke(0);  
fill(29,63,28);  
arc(470,220,20,20,-PI,0);  
arc(440,220,20,20,-PI,0);

arc(455,222,20,20,-PI,0);  
fill(255);

stroke(0);  
noFill();  
//---------------------------

int decalageX=185;  
arc(decalageX,255,50,55,-PI,0);  
int decalageX2=170+65;  
arc(decalageX2,255,50,55,-PI,0);  
int decalageX3=decalageX2+50;  
arc(decalageX3,255,50,55,-PI,0);  
int decalageX4=decalageX3+50;  
arc(decalageX4,255,50,55,-PI,0);  
int decalageX5=decalageX4+50;  
arc(decalageX5,255,50,55,-PI,0);  
int decalageX6=decalageX5+50;  
arc(decalageX6,255,50,55,-PI,0);  
int decalageX7=decalageX6+50;  
arc(decalageX7,255,50,55,-PI,0);

int decalageX\_=65;  
arc(decalageX\_,255,50,55,-PI,0);  
int decalageX\_1=decalageX\_-50;  
arc(decalageX\_1,255,50,55,-PI,0);

}  
//------------------------------  
void draw(){

pushStyle();  
strokeWeight(5);  
frameRate(5);  
fill(random(255));  
stroke(255,255,170);  
rect(102,250,10,20);  
rect(102-7,250+30,10,20);  
rect(102-14,250+60,10,20);  
rect(102-20,250+85,10,20);

rect(150,250,10,20);  
rect(150+15,250+30,10,20);  
rect(150+30,250+60,10,20);  
rect(150+40,250+85,10,20);  
popStyle();  
}  
// goutte de pluie  
/\*  
class Drop {  
float x= random(width);  
float y=random(-200,-50);  
float z= random(0,20);  
float len=map(z,0,20,10,20);  
float yspeed=map(z,0,20,4,10);  
void fall(){  
y=y + yspeed;  
yspeed= yspeed+0.05;  
if(y\> height){  
y=random(-200,-100);  
yspeed=map(z,0,20,4,10);  
}  
}  
void show(){  
stroke(0);  
line(x,y,x,y+len);  
Drop [] drops =new Drop[500];  
void setup(){

for(int i=0;i\<drops.length;i++){  
drops[i]=new Drop();  
}  
}  
void draw(){  
background(196);  
for(int i=0;i\<drops.length;i++){  
drops[i].fall();  
drops[i].show();  
}  
}  
}  
}  
_/  
//les flaques d’eau  
/_  
float dropSize;  
float dropX, dropY;  
//-----------------------------  
void setup() {  
size(400, 400);  
dropSize = 50;  
dropX = 0;  
dropY = 0;  
}  
//-----------------------------  
void draw() {  
noStroke();  
fill(0, 255, 255, 8);  
rect(0, 0, width, height);  
dropSize = random(10, 50);  
dropX = random(0, width);  
dropY = random(0, height);  
stroke(120, 160, 180,128);  
fill(120, 160, 180,64);  
ellipse(dropX, dropY, dropSize, dropSize);  
}\*/

---

<div class="post-metadata">

### Author: ![Chrisir](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/chrisir/32/45_2.png) [@Chrisir](https://discourse.processing.org/u/Chrisir)
#### Post date: [October 5, 2020, 10:13pm UTC](https://discourse.processing.org/t/probleme-danimation/24372/2 "2020-10-05T22:13:05Z")

</div>

Do you have void draw() ?

Only this function allows for animation

Basically after the size() command say

} // fin de setup()

void draw(){

---

<div class="post-metadata">

### Author: ![nina](https://avatars.discourse-cdn.com/v4/letter/n/e68b1a/32.png) [@nina](https://discourse.processing.org/u/nina)
#### Post date: [October 5, 2020, 10:13pm UTC](https://discourse.processing.org/t/probleme-danimation/24372/3 "2020-10-05T22:13:06Z")

</div>

je précise les codes que je veux intégrer sont à partir de class Drop

---

<div class="post-metadata">

### Author: ![nina](https://avatars.discourse-cdn.com/v4/letter/n/e68b1a/32.png) [@nina](https://discourse.processing.org/u/nina)
#### Post date: [October 5, 2020, 10:15pm UTC](https://discourse.processing.org/t/probleme-danimation/24372/4 "2020-10-05T22:15:19Z")

</div>

je l’ai mis mais il y a un problème mais je ne sais pas ou

---

<div class="post-metadata">

### Author: ![Chrisir](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/chrisir/32/45_2.png) [@Chrisir](https://discourse.processing.org/u/Chrisir)
#### Post date: [October 5, 2020, 11:08pm UTC](https://discourse.processing.org/t/probleme-danimation/24372/5 "2020-10-05T23:08:33Z")

</div>

> [@nina](#):
>
> dropX = random(0, width);  
> dropY = random(0, height);

Into setup please

In draw dropY+=3;

---

<div class="post-metadata">

### Author: ![nina](https://avatars.discourse-cdn.com/v4/letter/n/e68b1a/32.png) [@nina](https://discourse.processing.org/u/nina)
#### Post date: [October 6, 2020, 4:20pm UTC](https://discourse.processing.org/t/probleme-danimation/24372/6 "2020-10-06T16:20:36Z")

</div>

re: ok merci beaucoup!!!