acid-drop

- Hacking the planet from a LilyGo T-Deck using custom firmware
git clone git://git.acid.vegas/acid-drop.git
Log | Files | Refs | Archive | README | LICENSE

Font_Demo_2.ino (7106B)

      1 /*
      2   There are four different methods of plotting anti-aliased fonts to the screen.
      3 
      4   This sketch uses method 2, using graphics calls plotting direct to the TFT:
      5     tft.drawString(string, x, y);
      6     tft.drawNumber(integer, x, y);
      7     tft.drawFloat(float, dp, x, y); // dp = number of decimal places
      8 
      9   setTextDatum() and setTextPadding() functions work with those draw functions.
     10 
     11   This method is good for static text that does not change often because changing
     12   values may flicker.
     13   
     14 */
     15 //  The fonts used are in the sketch data folder, press Ctrl+K to view.
     16 
     17 //  Upload the fonts and icons to LittleFS (must set at least 1M for LittleFS) using the
     18 //  "Tools"  "ESP8266 LittleFS Data Upload" menu option in the IDE.
     19 //  To add this option follow instructions here for the ESP8266:
     20 //  https://github.com/earlephilhower/arduino-esp8266littlefs-plugin
     21 
     22 //  Close the IDE and open again to see the new menu option.
     23 
     24 // A processing sketch to create new fonts can be found in the Tools folder of TFT_eSPI
     25 // https://github.com/Bodmer/TFT_eSPI/tree/master/Tools/Create_Smooth_Font/Create_font
     26 
     27 // This sketch uses font files created from the Noto family of fonts:
     28 // https://www.google.com/get/noto/
     29 
     30 #define AA_FONT_SMALL "NotoSansBold15"
     31 #define AA_FONT_LARGE "NotoSansBold36"
     32 
     33 // Font files are stored in Flash FS
     34 #include <FS.h>
     35 #include <LittleFS.h>
     36 #define FlashFS LittleFS
     37 
     38 #include <SPI.h>
     39 #include <TFT_eSPI.h>       // Hardware-specific library
     40 
     41 TFT_eSPI tft = TFT_eSPI();
     42 
     43 void setup(void) {
     44 
     45   Serial.begin(250000);
     46 
     47   tft.begin();
     48 
     49   tft.setRotation(1);
     50 
     51   if (!LittleFS.begin()) {
     52     Serial.println("Flash FS initialisation failed!");
     53     while (1) yield(); // Stay here twiddling thumbs waiting
     54   }
     55   Serial.println("\n\Flash FS available!");
     56 
     57   bool font_missing = false;
     58   if (LittleFS.exists("/NotoSansBold15.vlw")    == false) font_missing = true;
     59   if (LittleFS.exists("/NotoSansBold36.vlw")    == false) font_missing = true;
     60 
     61   if (font_missing)
     62   {
     63     Serial.println("\nFont missing in Flash FS, did you upload it?");
     64     while(1) yield();
     65   }
     66   else Serial.println("\nFonts found OK.");
     67 }
     68 
     69 void loop() {
     70 
     71   tft.fillScreen(TFT_BLACK);
     72 
     73   tft.setTextColor(TFT_WHITE, TFT_BLACK); // Set the font colour and the background colour
     74 
     75   tft.setTextDatum(TC_DATUM); // Top Centre datum
     76 
     77   int xpos = tft.width() / 2; // Half the screen width
     78   int ypos = 10;
     79 
     80 
     81   // >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>
     82   // Small font
     83   // >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>
     84 
     85   tft.loadFont(AA_FONT_SMALL, LittleFS); // Must load the font first
     86 
     87   tft.drawString("Small 15pt font", xpos, ypos);
     88 
     89   ypos += tft.fontHeight();   // Get the font height and move ypos down
     90 
     91   tft.setTextColor(TFT_GREEN, TFT_BLACK);
     92 
     93   // If the string does not fit the screen width, then the next character will wrap to a new line
     94   tft.drawString("Ode To A Small Lump Of Green Putty I Found In My Armpit One Midsummer Morning", xpos, ypos);
     95 
     96   tft.setTextColor(TFT_GREEN, TFT_BLUE); // Background colour does not match the screen background!
     97   tft.drawString("Anti-aliasing causes odd looking shadow effects if the text and screen background colours are not the same!", xpos, ypos + 60);
     98 
     99   tft.unloadFont(); // Remove the font to recover memory used
    100 
    101   delay(5000);
    102 
    103   // >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>
    104   // Large font
    105   // >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>
    106 
    107   tft.loadFont(AA_FONT_LARGE, LittleFS); // Load another different font
    108 
    109   tft.fillScreen(TFT_BLACK);
    110 
    111   // The "true" parameter forces background drawing for smooth fonts
    112   tft.setTextColor(TFT_GREEN, TFT_BLUE, true); // Change the font colour and the background colour
    113 
    114   tft.drawString("36pt font", xpos, ypos);
    115 
    116   ypos += tft.fontHeight();  // Get the font height and move ypos down
    117 
    118   // Set text padding to 100 pixels wide area to over-write old values on screen
    119   tft.setTextPadding(100);
    120 
    121   // Draw changing numbers - likely to flicker using this plot method!
    122   for (int i = 0; i <= 20; i++) {
    123     tft.drawFloat(i / 10.0, 1, xpos, ypos);
    124     delay (200);
    125   }
    126 
    127   // Turn off text padding by setting value to 0
    128   tft.setTextPadding(0);
    129 
    130   tft.unloadFont(); // Remove the font to recover memory used
    131 
    132   delay(5000);
    133 
    134   // >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>
    135   // Setting the 12 datum positions works with free fonts
    136   // >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>
    137 
    138   // Integer numbers, floats and strings can be drawn relative to a x,y datum, e.g.:
    139   // tft.drawNumber( 123, x, y);
    140   // tft.drawFloat( 1.23, dp, x, y); // Where dp is number of decimal places to show
    141   // tft.drawString( "Abc", x, y);
    142 
    143   tft.fillScreen(TFT_BLACK);
    144 
    145   tft.setTextColor(TFT_DARKGREY, TFT_BLACK, false);
    146 
    147   // Use middle of screen as datum
    148   xpos = tft.width() /2;
    149   ypos = tft.height()/2;
    150 
    151   tft.loadFont(AA_FONT_SMALL, LittleFS);
    152   tft.setTextDatum(TL_DATUM);
    153   tft.drawString("[Top left]", xpos, ypos);
    154   drawDatumMarker(xpos, ypos);
    155   delay(1000);
    156 
    157   tft.fillScreen(TFT_BLACK);
    158   tft.setTextDatum(TC_DATUM);
    159   tft.drawString("[Top centre]", xpos, ypos);
    160   drawDatumMarker(xpos, ypos);
    161   delay(1000);
    162 
    163   tft.fillScreen(TFT_BLACK);
    164   tft.setTextDatum(TR_DATUM);
    165   tft.drawString("[Top right]", xpos, ypos);
    166   drawDatumMarker(xpos, ypos);
    167   delay(1000);
    168 
    169   tft.fillScreen(TFT_BLACK);
    170   tft.setTextDatum(ML_DATUM);
    171   tft.drawString("[Middle left]", xpos, ypos);
    172   drawDatumMarker(xpos, ypos);
    173   delay(1000);
    174 
    175   tft.fillScreen(TFT_BLACK);
    176   tft.setTextDatum(MC_DATUM);
    177   tft.drawString("[Middle centre]", xpos, ypos);
    178   drawDatumMarker(xpos, ypos);
    179   delay(1000);
    180 
    181   tft.fillScreen(TFT_BLACK);
    182   tft.setTextDatum(MR_DATUM);
    183   tft.drawString("[Middle right]", xpos, ypos);
    184   drawDatumMarker(xpos, ypos);
    185   delay(1000);
    186 
    187   tft.fillScreen(TFT_BLACK);
    188   tft.setTextDatum(BL_DATUM);
    189   tft.drawString("[Bottom left]", xpos, ypos);
    190   drawDatumMarker(xpos, ypos);
    191   delay(1000);
    192 
    193   tft.fillScreen(TFT_BLACK);
    194   tft.setTextDatum(BC_DATUM);
    195   tft.drawString("[Bottom centre]", xpos, ypos);
    196   drawDatumMarker(xpos, ypos);
    197   delay(1000);
    198 
    199   tft.fillScreen(TFT_BLACK);
    200   tft.setTextDatum(BR_DATUM);
    201   tft.drawString("[Bottom right]", xpos, ypos);
    202   drawDatumMarker(xpos, ypos);
    203   delay(1000);
    204 
    205   tft.fillScreen(TFT_BLACK);
    206   tft.setTextDatum(L_BASELINE);
    207   tft.drawString("[Left baseline]", xpos, ypos);
    208   drawDatumMarker(xpos, ypos);
    209   delay(1000);
    210 
    211   tft.fillScreen(TFT_BLACK);
    212   tft.setTextDatum(C_BASELINE);
    213   tft.drawString("[Centre baseline]", xpos, ypos);
    214   drawDatumMarker(xpos, ypos);
    215   delay(1000);
    216 
    217   tft.fillScreen(TFT_BLACK);
    218   tft.setTextDatum(R_BASELINE);
    219   tft.drawString("[Right baseline]", xpos, ypos);
    220   drawDatumMarker(xpos, ypos);
    221   delay(1000);
    222 
    223   tft.unloadFont(); // Remove the font to recover memory used
    224 
    225   delay(4000);
    226 
    227 }
    228 
    229 // Draw a + mark centred on x,y
    230 void drawDatumMarker(int x, int y)
    231 {
    232   tft.drawLine(x - 5, y, x + 5, y, TFT_GREEN);
    233   tft.drawLine(x, y - 5, x, y + 5, TFT_GREEN);
    234 }