# Recreating pong, I need help though

**URL:** https://discourse.processing.org/t/recreating-pong-i-need-help-though/35166
**Category:** Coding Questions
**Created:** [February 14, 2022, 4:30pm UTC](https://discourse.processing.org/t/recreating-pong-i-need-help-though/35166 "2022-02-14T16:30:48Z")
**Posts on this page:** 7
**Page:** 1

<div class="post-metadata">

### Author: ![Adrian\_vargas42](https://avatars.discourse-cdn.com/v4/letter/a/e495f1/32.png) [@Adrian\_vargas42](https://discourse.processing.org/u/Adrian_vargas42)
#### Post date: [February 14, 2022, 4:30pm UTC](https://discourse.processing.org/t/recreating-pong-i-need-help-though/35166/1 "2022-02-14T16:30:48Z")

</div>

Hello, I need help with recreating the game, “Pong”. I have gotten both of the paddles and the divider betwen which side is which, I need to get help with getting, the score, and the ball to move on its own, the mouse moves the left paddle and the arrow keys move the right paddle, up and down,  
heres my code,  
float leftScore;  
float rx;  
float rightScore;  
float ball;

void setup(){  
size(1000, 1000);  
}

void draw(){  
background(0, 0, 0);  
rect(10, mouseY, 20, 100);  
rect(970, rx, 20, 100);  
rect(500, 0, 5, 1000);  
if (keyPressed == true && keyCode == UP) {  
rx-=25;  
}

if (keyPressed == true && keyCode == DOWN) {  
rx+=25;  
}  
if (rx \< 0){  
rx=0;  
}  
if (rx \> 970){  
rx=970;  
}  
if(rx \< 10){  
rx=10;  
}  
}

---

<div class="post-metadata">

### Author: ![th75](https://avatars.discourse-cdn.com/v4/letter/t/ebca7d/32.png) [@th75](https://discourse.processing.org/u/th75)
#### Post date: [February 15, 2022, 12:44am UTC](https://discourse.processing.org/t/recreating-pong-i-need-help-though/35166/2 "2022-02-15T00:44:08Z")

</div>

hi Adrian,  
you already did half of the job, nice !

(first, side comment, when you paste code here select it and click \</\> icon, it’ s more easy for readers)

you’re not that far, you need a ball, manage ball’s movements, check if a paddle is on its way,  
so let’s start first with the ball and basic moves,  
see how you manage the right paddle, it s not that different, you had rx (wich is vertical y position of the paddle in fact), you need for the ball two variables, ballX and ballY for eg, draw a ball there,  
then update those values  
so, each frame you recalculate the new position of the ball, it will be last position+movement  
this movement is defined by an angle and a speed so, for eg, ballX will be updated each frame like `ballX=ballX+dx;`  
where  
`dx=speed*cos(angle);`  
i let you do the same for ballY  
angle will change when the ball hit a wall or a paddle and speed will be the difficulty

may be start to implement this without interaction with paddles

as you did in

```auto
if (rx > 970){
rx=970;
}

```

you have to manage when the ball hit the borders  
so it will be the same, if(ballY\<10) change the angle  
i let you think here how the angle have to change on this case…

i tried to not give you too much code, but don t hesitate to ask if needed

have fun

---

<div class="post-metadata">

### Author: ![Adrian\_vargas42](https://avatars.discourse-cdn.com/v4/letter/a/e495f1/32.png) [@Adrian\_vargas42](https://discourse.processing.org/u/Adrian_vargas42)
#### Post date: [February 15, 2022, 3:49pm UTC](https://discourse.processing.org/t/recreating-pong-i-need-help-though/35166/3 "2022-02-15T15:49:00Z")

</div>

> [@th75](#):
>
> dx=speed\*cos(angle);

so, I entered in the command just now and it says speed cannot be resolved to a variable, (it also said it had a problem with dx but i resolved that with a float command, would that be the same thing? or??)

---

<div class="post-metadata">

### Author: ![Adrian\_vargas42](https://avatars.discourse-cdn.com/v4/letter/a/e495f1/32.png) [@Adrian\_vargas42](https://discourse.processing.org/u/Adrian_vargas42)
#### Post date: [February 15, 2022, 3:49pm UTC](https://discourse.processing.org/t/recreating-pong-i-need-help-though/35166/4 "2022-02-15T15:49:42Z")

</div>

(heres what the code looks like now)

```auto
float leftScore;
float rx;
float rightScore;
float ballX;
float dx;

void setup(){
  size(1000, 1000);
}

void draw(){
  background(0, 0, 0);
  rect(10, mouseY, 20, 100);
  rect(970, rx, 20, 100);
  rect(500, 0, 5, 1000);
  if (keyPressed == true && keyCode == UP) {
    rx-=25;
  }
  
  if (keyPressed == true && keyCode == DOWN) {
    rx+=25;
  }
  if (rx < 0){
    rx=0;
  }
  if (rx > 970){
    rx=970;
   }
   if(rx < 10){
     rx=10;
   }
  ballX = ballX + dx;{
  dx = speed* cos (angle);
  }
}

```

---

<div class="post-metadata">

### Author: ![th75](https://avatars.discourse-cdn.com/v4/letter/t/ebca7d/32.png) [@th75](https://discourse.processing.org/u/th75)
#### Post date: [February 15, 2022, 6:08pm UTC](https://discourse.processing.org/t/recreating-pong-i-need-help-though/35166/5 "2022-02-15T18:08:52Z")

</div>

ok, when you run do you see the errors about variables?  
(you already added on declarations ballX and dx  
but speed and angle are variables too, they are needed)  
about:

```auto
ballX = ballX + dx;{
  dx = speed* cos (angle);
  }

```

you don ’ t need { } here

so now lets draw a ball at ballX,ballY coordinates  
ballX will be the horizontal position, you need a ballY too for vertical position [you can use ellipse()](https://processing.org/reference/ellipse_.html)

then update movement, so calculate amount of mouvement it will be,  
horizontally: dx=… as you did , and vertically dy=…  
then update coordinates

```auto
ballX=ballx+dx;
ballY=ballY+dy;

```

something else: when you write  
`float ballX;`  
you say to software that you will use a variable named ballX, by default here it will be set to 0.0, but it s not working for all kind of variable , and it s not the default value you want i think (the game shouldn’t start with a ball at 0,0 coordinates (up left part of the screen)  
so, it s good to always set the default value you want  
for eg:

```auto
float ballX=500.0, ballY=500.0;
float dx=0.0,dy=0.0;
float angle=PI/6, speed=1.0;

```

(note too, you can, in the same line , declare few variables separated with a comma)

tell me when you get your ball 😉

---

<div class="post-metadata">

### Author: ![Adrian\_vargas42](https://avatars.discourse-cdn.com/v4/letter/a/e495f1/32.png) [@Adrian\_vargas42](https://discourse.processing.org/u/Adrian_vargas42)
#### Post date: [February 23, 2022, 4:05pm UTC](https://discourse.processing.org/t/recreating-pong-i-need-help-though/35166/6 "2022-02-23T16:05:05Z")

</div>

ok, sorry it has taken me so long to reply back! thank you for the answer, I have been taking a small break from pong haha. I got the code, put it in there and looks like this

```auto
float leftScore;
float rx;
float rightScore;
float ballX=500.0, ballY=500.0;
float dx=0.0, dy=500.0;
float angle=PI/6, speed=1.0;

void setup(){
  size(1000, 1000);
}

void draw(){
  background(0, 0, 0);
  rect(10, mouseY, 20, 100);
  rect(970, rx, 20, 100);
  rect(500, 0, 5, 1000);
  ellipse(ballX, ballY, 50, 50);
  if (keyPressed == true && keyCode == UP) {
    rx-=25;
  }
  
  if (keyPressed == true && keyCode == DOWN) {
    rx+=25;
  }
  if (rx < 0){
    rx=0;
  }
  if (rx > 970){
    rx=970;
   }
   if(rx < 10){
     rx=10;
   }
  ballX=ballX+dx;
  ballY=ballY+dy;
  dx = speed* cos (angle);
}

```

still havent gotten the ball though lol!

---

<div class="post-metadata">

### Author: ![th75](https://avatars.discourse-cdn.com/v4/letter/t/ebca7d/32.png) [@th75](https://discourse.processing.org/u/th75)
#### Post date: [March 1, 2022, 9:53am UTC](https://discourse.processing.org/t/recreating-pong-i-need-help-though/35166/7 "2022-03-01T09:53:13Z")

</div>

hi,  
sorry i took a long time too

you’re really close

> [@Adrian\_vargas42](#):
>
> ```auto
> float ballX=500.0, ballY=500.0;
> float dx=0.0, dy=500.0;
> 
> ```

problem is there, i let you do the maths  
you draw a ball at ballX, ballY  
then, each frame, you update ballY = ballY+dy  
do you see the problem?  
then , next , when you see the ball, you need to calculate dy same than what you did for dx = speed\* cos (angle);
