# Controlling drawing speed

**URL:** <https://discourse.processing.org/t/controlling-drawing-speed/31929>\
**Category:** Coding Questions\
**Created:** [August 25, 2021, 9:30pm UTC](https://discourse.processing.org/t/controlling-drawing-speed/31929 "2021-08-25T21:30:00Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![mews](https://avatars.discourse-cdn.com/v4/letter/m/b9e5f3/32.png) [@mews](https://discourse.processing.org/u/mews)\
**Post date:** [August 25, 2021, 9:30pm UTC](https://discourse.processing.org/t/controlling-drawing-speed/31929/1 "2021-08-25T21:30:00Z")

</div>

Hi Folks,

I’m having a bit of an issue which I feel is probably simple but I’m just not getting it. I’m trying to make a simple Missile Control clone where missiles are drawn via a basic line drawing algorithm. They come down from the top of the screen to the bottom. This is the code I have created just as a proof of concept at this stage:

```auto
void drawMissiles() {
  stroke(255);
  float startX = random(0, width); //starting location of missile
  float targetX = random(0, width); //target location of the missle
  float dx = targetX-startX;
  float dy = GROUND-0; //ground is the bottom of the screen which is size(800, 600)
  PVector position = new PVector(startX, 0);
  PVector finish = new PVector(dx, dy);
  PVector speed = finish.setMag(0.01);
  while (position.y < GROUND) {
    point(position.x, position.y);
    position.add(speed);
  }
}

```

This is called from my game method which itself is called by the draw method. The problem is the speed control isn’t working. It just causes the whole game to slow down while each line still flashes on the screen like a lightning bolt. What I’m trying to do is make the points draw more slowly as they head towards the ground. Can anyone advise what I’m doing wrong here please?

Cheers!

---

<div class="post-metadata">

**Author:** ![josephh](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/josephh/32/210_2.png) [@josephh](https://discourse.processing.org/u/josephh)\
**Post date:** [August 25, 2021, 9:55pm UTC](https://discourse.processing.org/t/controlling-drawing-speed/31929/2 "2021-08-25T21:55:24Z")

</div>

Hi @mews,

Welcome to the forum! 🙂

Let’s suppose you have the following Processing program:

```processing
void drawMissiles() {
  // Loops infinitely
  while (true) {}
}

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

void draw() {
  drawMissiles();

  // This is never reached
  circle(50, 50, 10);
}

```

The execution steps are:

- The `setup()` function gets called at the beginning

- At the first draw loop, the `drawMissiles()` function gets called and does a `while` loop that never finish (true is always true).

- The `circle` function is never called since the draw() function is waiting for the `drawMissiles` function to finish.

This is to explain that if you call any function inside the `draw()` loop, it will wait until the function returns a value or finishes.

So in your code, you are increasing the position and drawing a point in the while loop but you see it flash on the screen because it does the while loop at each draw loop which is not what you want.

The draw loop is actually the main loop of your program so you need to use it in order to animate objects at each frame (since it’s called roughly 60 times per second). The update code is then called once every loop.

Check this other program:

```processing
PVector ballLocation;

void setup() {
  size(500, 500);
  
  ballLocation = new PVector(0, height / 2);
}

void draw() {
  background(255);
  
  // Move the ball
  ballLocation.x += 5;
  
  // Make it wrap when it goes out of screen
  if (ballLocation.x > width) ballLocation.x = 0;
  
  // Draw the ball
  fill(255, 0, 0);
  circle(ballLocation.x, ballLocation.y, 100);
}

```

![ball_anim](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/d/d33b0e2eeff709485921ac51dfe5bb747028600b.gif)

So rather than making a while loop where I update the location of my ball, the draw loop does the job for me 😉

One more thing is that you should use Object Oriented Programming which makes program structure more easy to work with. You can check an old post I wrote on this subject:

> [@Problems with my mini game](https://discourse.processing.org/t/problems-with-my-mini-game/21949/2):
>
> Hi, Welcome to the community! slight_smile Before trying to solve your problem, you are facing a well known problem where the structure of your code is actually describing [object oriented programming](https://en.wikipedia.org/wiki/Object-oriented_programming) : So object oriented programming is a way to structure your code by using objects to model the data that your are manipulating. In this special case, your are creating Balls, and a Ball is described as : a position (x and y coordinates on the screen) a speed (described as a vector, xDir and y…

---

<div class="post-metadata">

**Author:** ![mews](https://avatars.discourse-cdn.com/v4/letter/m/b9e5f3/32.png) [@mews](https://discourse.processing.org/u/mews)\
**Post date:** [August 26, 2021, 1:13am UTC](https://discourse.processing.org/t/controlling-drawing-speed/31929/3 "2021-08-26T01:13:04Z")

</div>

Thanks Josephh, this helped a lot. The bit I was really having trouble getting my head around was that any sub-method of draw() is going to be called every frame. I’ve since created a missile array and Missile class and only create Missile objects when there are under a certain amount. They’re dots rather than lines now but I’m sure I can fix that with a couple of arrays to store the historical position.

Cheers!