Question about how to update only part of the screen in tft_eSPI library

Using Arduino Programming Questions
#1

Hello, I am not sure if I should have posted this in the programming forum or the LCD display forum. Please move this thread if this should have been elsewhere.

I have an ILI9341 display with 320*240 resolution that I am using with an esp8266 nodemcu board.

I am using the tft_eSPI library. I am trying to update the value of a variable on the screen without updating the entire screen, as doing the latter causes flicker.

After doing some reading I got to know that I need to clear the area of the screen first and then rewrite the new value. After a lot of trial and error I realized that writing an empty string in this library does not clear that portion of the screen. What I did instead was that I printed a rectangle with a color - that effectively clears that area of the screen and then I write the new value.

So this works -

static int i = 0;
char buffer[20] = "";
void loop() {
   tft.drawString("Hello world", my_x_pos + 100, my_y_pos + 100,2);
  if(i>20)
  {
    i=0;
  }
  sprintf(buffer,"%d",i);
  Serial.println(buffer);
  i++;
  tft.fillRect(my_x_pos,my_y_pos,16,16,TFT_BLACK); //height and width of rectangle in pixels
  tft.drawString(buffer,my_x_pos,my_y_pos,2);
  

  delay(200);
}

but this doesn't -

static int i = 0;
char buffer[20] = "";
void loop() {
   tft.drawString("Hello world", my_x_pos + 100, my_y_pos + 100,2);
  if(i>20)
  {
    i=0;
  }
  sprintf(buffer,"%d",i);
  Serial.println(buffer);
  i++;
  tft.drawString("    ",my_x_pos,my_y_pos,2);
  tft.drawString(buffer,my_x_pos,my_y_pos,2);
  

  delay(200);
}

Am I doing this right? If I am, is there a better way of doing this? By doing it this way I need to know the pixel values of the height and width of each text size. I got the current values using trial and error.

I looked at the example programs in the library repo, and I don't see this method being used there.

#2

Going from the point of view that you are also using the adafruit_GFX.h, there is a way more elegant and less visually disturbing method. tft.setTextColor( FOREGROUND, BAcKGROUND) if you add a background color as an argument to setTextColor() any left open pixel of a character that is being printed is going to be filled with that color. So not only will you second method work, but if the display-size of your variable is the same it will just ‘overwrite & cover-over’ (adding required white before or after will solve different sizes)
If you look in the adafruit_GFX.cpp you will find the functions responsible for doing ‘drawChar’ and if you would prefer you could also find a way of extracting the pixel-size per font (but why would you want to ?)

#3

Ah, thank you! I think that's the method used in the library examples - I've seen that function used all over but I did not know what it did before.

The reason I made this post was basically that I did not want to have to know the font size and the exact pixel values for each font size when I'm printing. Otherwise I would have to readjust everything every time I changed the font size.

I suppose I should look at guides for the adafruit library, seeing as the functions are the same.

#4

I looked into the library once and then i do think there was a condition that no 'custom space font' would be used, but i actually didn't see that condition anymore, but i may have just removed it (me and most people anyway just use the standard font but with different sizes and that does work just fine.)

#5

You are right - I read this in their library guide:

Note that the text background color is not supported for custom fonts. For these, you will need to determine the text extents and explicitly draw a filled rectangle before drawing the text.

I won’t need custom fonts either. I do want to try out anti aliased fonts in the tft_eSPI library some time, and those shouldn’t be used for frequently updating stuff so this shouldn’t be a problem any way.

#6