#WioTerminal – Display a countdown progress bar 🚥 for the next #AzureIoT ☁️ refresh data call

Hi !

In today’s post I’ll share an scenario about:

Display a custom progress bar in the Wio Terminal display. The progress bar is a count down until the next request to the Azure Function interacting with Azure Digital Twin.

This is mostly working with strings to create a specific String() that represent the Progress Bar. Here is a working sample, with the countdown at the bottom left of the screen.

In order to do this, I declare a couple of variables. Here I manage how many blocks per second will be used in the progress bar. In example, the refresh interval is 10 seconds, and the progress bar will change the blocks every 2 seconds.

// Refresh Countdown Progress bar
unsigned long lastTimeCounter = 0;
int countdownCounter     = 0;
int blocksPerSecond      = 2000;
String progressBarPrefix = "@> ";

And in the loop() function, if I’m not retrieving data from Azure, I’ll call this function to show the progress bar.

void displayRefreshProgressBar() {
  // display progress timer to next get info
  if ((millis() - lastTimeCounter) > blocksPerSecond) {
    lastTimeCounter = millis();

    int prefixLength = progressBarPrefix.length();
    int progressBarLength = prefixLength + (timerDelay / blocksPerSecond);
    String progressBar = prefix;
    for(int i = prefixLength; i <= progressBarLength - 1 ; i++) {
      if (i <= (countdownCounter + prefixLength) - 1){
        progressBar += '0';
      else {
        progressBar += '.';  

    // draw progress bar
    tftPrintLineNoClean(row7, progressBar, "");  

Super easy, and with a visual clue to check if the app is running. And when the Wio Terminal will request new data from Azure IoT !

I’m close to finish the Wio Terminal application. Next step, let’s interact with the Digital Twin using the Wio Terminal buttons.

Happy coding!


El Bruno


¿Con ganas de ponerte al día?

En Lemoncode te ofrecemos formación online impartida por profesionales que se baten el cobre en consultoría:

Leave a comment

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

This site uses Akismet to reduce spam. Learn how your comment data is processed.

%d bloggers like this: