How loop 2 diferent images

Processing Coding Questions
1

Hey guys. I’m a student and I have a processing class. I have to do a game to pass.
I just started and I can’t make one of the png image moving.
So the clouds are moving to the right side, and I want the airplane to come from the left side and stop in the middle to start the mousePressed. I’m stuck in this point. Can you guys help me?

2

You have two variables, x and y. One of them is the x position of the cloud. The other is the x position of the plane.

… That’s right. You have a variable called y that is an x position.

That’s confusing!

A good first step, I think, would be to give your variables better names. Maybe one could be cloud_x? What about the other?

2 Likes
3

Hey TfGuy44!

Thank you so much for the fast answer

you mean like this?

float cloud_x;
float plane_y;
int value = 0;
PImage fundo;
PImage nuvens;
PImage aviao;


void setup() {
  size (950, 560);
  fundo = loadImage("gamebackground2.png");
  
  nuvens = loadImage("nuvens.png");
  cloud_x=-1000;
  
  aviao =loadImage ("aviao.png");
  plane_y=700;
  
}

void draw() {
image(fundo, 0, 0);

image(aviao,plane_y, 20, 950, 560);//posição
    plane_y = plane_y + 4;//velocidade
  if(plane_y<width){
    plane_y=0;//onde começa
    
  image(nuvens,cloud_x, 20, 950, 560);//posição
  cloud_x = cloud_x + 2;//velocidade
  if(cloud_x>width){
    cloud_x=-1000;//onde começa
  } 
  }
}

btw what is your email?

4

i found it. I send you an email

5

A good start. Now we can see that one variable is for the plane, and the other is for the cloud. The plane’s variable is still called plane_y, but it is an x position, but we can fix that in a second.

The next thing to do it to press Ctrl + t in the Processing editor to auto-format your code. Then post your code on the forums, formatted properly.

You can tell to forums to format your code by putting it between two sets of three back-ticks: ``` code ```

Or just highlight your code and hit the format like code button, which looks like this: </>

1 Like
6 
float cloud_x;
float plane_y;
int value = 0;
PImage fundo;
PImage nuvens;
PImage aviao;


void setup() {
  size (950, 560);
  fundo = loadImage("gamebackground2.png");

  nuvens = loadImage("nuvens.png");
  cloud_x=-1000;

  aviao =loadImage ("aviao.png");
  plane_y=700;
}

void draw() {
  image(fundo, 0, 0);

  image(aviao, 20, plane_y, 950, 560);//posição
  plane_y = plane_y + 4;//velocidade
  if (plane_y<width) {
    plane_y=0;//onde começa

    image(nuvens, cloud_x, 20, 950, 560);//posição
    cloud_x = cloud_x + 2;//velocidade
    if (cloud_x>width) {
      cloud_x=-1000;//onde começa
    }
  }
}

yeah the position make sense. but stills dont move

7

please check the email

8

Great! Now that we can see your code formatted properly, does anything unusual stand out to you about it?

Look at the lines of code that move and draw the cloud. What conditions must be true for those lines to run? Is that the right condition, even?

9

you mean about his?
plane_y = plane_y + 4;//velocidade
if (plane_y<width) {
plane_y=20;//onde começa```
type or paste code here

10

Yes. Where does that conditional statement end? Which closing brace, }, matches with that if statement’s opening brace, {?

11

it ends here right?

    image(nuvens, cloud_x, 20, 950, 560);//posição
    cloud_x = cloud_x + 2;//velocidade
    if (cloud_x>width) {
      cloud_x=-1000;//onde começa
    } //here
  }
}
12

Yep! So if the plane’s x position is less than width (that is, the plane is on the screen), you set the plane’s position to 0 and then move and draw the cloud. Is that right?