How do i code to grow Circles gradually?

Using Arduino Programming Questions
1

I'm new to coding and I have a chunk of code that makes a circle with a radius of 30 and gradually gets bigger by 10 radius each time. I've written the code individually with delays in between each line of code. However, I have other animations that get interrupted because I have so man delays. Is there a way to write a code that gets circles to get bigger without delays?

The output of the animation is through a tft lcd monitor as well. model ili9486 to be exact.

This is the code I have so far

if (volts >= .5 && vibe>=.5){
tft.fillCircle(circleX, circleY, 20, tft.color565(240, 3, 20));
delay(10);
tft.drawCircle(circleX, circleY, 30, tft.color565(137, 207, 240));
delay(10);
tft.drawCircle(circleX, circleY, 40, tft.color565(137, 207, 240));
delay(10);
tft.drawCircle(circleX, circleY, 50, tft.color565(137, 207, 240));
delay(10);
tft.drawCircle(circleX, circleY, 60, tft.color565(137, 207, 240));
delay(10);
tft.drawCircle(circleX, circleY, 70, tft.color565(137, 207, 240));
delay(10);
tft.drawCircle(circleX, circleY, 80, tft.color565(137, 207, 240));
delay(10);
tft.drawCircle(circleX, circleY, 90, tft.color565(137, 207, 240));
delay(10);
tft.drawCircle(circleX, circleY, 100, tft.color565(137, 207, 240));
delay(10);
tft.drawCircle(circleX, circleY, 110, tft.color565(137, 207, 240));
delay(10);
tft.drawCircle(circleX, circleY, 120, tft.color565(137, 207, 240));
delay(10);
tft.drawCircle(circleX, circleY, 130, tft.color565(137, 207, 240));
delay(10);
tft.drawCircle(circleX, circleY, 140, tft.color565(137, 207, 240));
delay(10);
tft.drawCircle(circleX, circleY, 150, tft.color565(137, 207, 240));
delay(10);
tft.drawCircle(circleX, circleY, 160, tft.color565(137, 207, 240));
delay(10);
tft.drawCircle(circleX, circleY, 170, tft.color565(137, 207, 240));
delay(10);
tft.drawCircle(circleX, circleY, 180, tft.color565(137, 207, 240));
delay(10);
tft.drawCircle(circleX, circleY, 190, tft.color565(137, 207, 240));
delay(10);
tft.drawCircle(circleX, circleY, 200, tft.color565(137, 207, 240));
delay(10);
tft.drawCircle(circleX, circleY, 210, tft.color565(137, 207, 240));
delay(10);
tft.drawCircle(circleX, circleY, 220, tft.color565(137, 207, 240));
delay(10);
tft.drawCircle(circleX, circleY, 230, tft.color565(137, 207, 240));
delay(10);
tft.drawCircle(circleX, circleY, 240, tft.color565(137, 207, 240));
delay(10);
tft.drawCircle(circleX, circleY, 250, tft.color565(137, 207, 240));
delay(10);
tft.drawCircle(circleX, circleY, 260, tft.color565(137, 207, 240));
delay(10);
tft.drawCircle(circleX, circleY, 270, tft.color565(137, 207, 240));
delay(10);
tft.drawCircle(circleX, circleY, 280, tft.color565(137, 207, 240));
delay(10);
tft.drawCircle(circleX, circleY, 290, tft.color565(137, 207, 240));
delay(10);}

2

First read the first message of this board. It will teach you exactly what you want to know.

You should use a for loop and a subroutine to do this:

unsigned long chrono = 0;as global.

  if (volts >= .5 && vibe>=.5){
    chrono = millis();
    radius = 20;
    while (radius < 300) {
      bool circleIsDrawn = drawCircle (circleX, circleY, radius, 240, 3, 20);
// do other things here
      if (circleIsDrawn) radius += 10;
      }
    }
  }

And:

bool drawCircle (int centerX, int CenterY, int radius, int R, int G, int B) {
  if (millis() - chrono < 10) return 0;
  chrono = millis();
  tft.fillCircle(centerX, centerY, radius, tft.color565(R,G,B));
  return 1;
}

I think this should do the trick. But I don't know if drawing the circle only is shorter than 10ms...