Differences

This shows you the differences between two versions of the page.

--- en:iot-open:practical:hardware:sut:esp32:emb6_1 [2024/02/26 14:11] – [Steps] pczekalski
+++ en:iot-open:practical:hardware:sut:esp32:emb6_1 [2024/04/05 09:24] (current) – [Steps] pczekalski
@@ Line 33: / Line 33: @@
 <caption>IOT-OPEN.EU Reloaded favicon 60px x 60px</caption>
 </figure>
-The corresponding converted code for the logo in Figure {{ref>iotopenfavicon}} (Horizontal 1 bit per pixel, as suitable for ePaper Display) is present below:
+==== Steps ====
+Remember to include the source array in the code when drawing an image.\\
+The corresponding generated C array for the logo in Figure {{ref>iotopenfavicon}} (horizontal 1 bit per pixel, as suitable for ePaper Display) is present below:
 <code c>
 // 'logo 60', 60x60px
 const unsigned char epd_bitmap_logo_60 [] PROGMEM = {
 xff, 0xff, 0xff, 0x80, 0x1f, 0xff, 0xff, 0xf0, 0xff, 0xff, 0xf8, 0x00, 0x01, 0xff, 0xff, 0xf0,
 xff, 0xff, 0xc0, 0x00, 0x00, 0x3f, 0xff, 0xf0, 0xff, 0xff, 0x01, 0xff, 0xf8, 0x0f, 0xff, 0xf0,
 xff, 0xfc, 0x0f, 0xff, 0xff, 0x03, 0xff, 0xf0, 0xff, 0xf8, 0x3f, 0xff, 0xff, 0xc1, 0xff, 0xf0,
 xff, 0xe0, 0xff, 0xff, 0xff, 0xf0, 0x7f, 0xf0, 0xff, 0xc3, 0xff, 0xff, 0xff, 0xfc, 0x3f, 0xf0,
 xff, 0x87, 0xff, 0xf0, 0xff, 0xfe, 0x1f, 0xf0, 0xff, 0x0f, 0xfe, 0x00, 0x07, 0xff, 0x0f, 0xf0,
 xfe, 0x1f, 0xf8, 0x7f, 0xe1, 0xff, 0x87, 0xf0, 0xfc, 0x3f, 0xe3, 0xff, 0xfc, 0x7f, 0xc3, 0xf0,
 xfc, 0x7f, 0x8f, 0xff, 0xff, 0x1f, 0xe3, 0xf0, 0xf8, 0xff, 0x3f, 0xff, 0xff, 0xcf, 0xf1, 0xf0,
 xf1, 0xfe, 0x7f, 0xff, 0xff, 0xe7, 0xf8, 0xf0, 0xf1, 0xfc, 0xff, 0xff, 0xff, 0xf3, 0xf8, 0xf0,
 xe3, 0xf9, 0xff, 0xfc, 0x7f, 0xf9, 0xfc, 0x70, 0xe3, 0xf3, 0xff, 0xfc, 0x0f, 0xfc, 0xfc, 0x70,
 xc7, 0xf7, 0xff, 0xff, 0xc3, 0xfe, 0xfe, 0x30, 0xc7, 0xe7, 0xff, 0xff, 0xf1, 0xfe, 0x7e, 0x30,
 xcf, 0xef, 0xff, 0xff, 0xfc, 0xff, 0x7f, 0x30, 0x8f, 0xcf, 0xff, 0xff, 0xfe, 0x7f, 0x3f, 0x10,
 x8f, 0xdf, 0xff, 0xff, 0xff, 0x3f, 0xbf, 0x10, 0x9f, 0x9f, 0xff, 0xff, 0xff, 0x3f, 0x9f, 0x90,
 x9f, 0x9f, 0xff, 0xff, 0xff, 0x9f, 0x9f, 0x90, 0x1f, 0xbf, 0xff, 0xff, 0xff, 0x9f, 0xdf, 0x80,
 x1f, 0xbf, 0xff, 0xf9, 0xff, 0xdf, 0xdf, 0x80, 0x1f, 0xbf, 0xff, 0xe0, 0x7f, 0xcf, 0xdf, 0x80,
 x1f, 0x3f, 0xff, 0xe0, 0x7f, 0xcf, 0xcf, 0x80, 0x1f, 0x3f, 0xff, 0xc0, 0x3f, 0xcf, 0xcf, 0x80,
 x1f, 0xff, 0xff, 0xc0, 0x3f, 0xff, 0xff, 0xf0, 0x1f, 0xff, 0xff, 0xe0, 0x7f, 0xff, 0xff, 0xf0,
 x1f, 0xff, 0xff, 0xe0, 0x7f, 0xff, 0xff, 0xf0, 0x1f, 0xff, 0xff, 0xf9, 0xff, 0xff, 0xff, 0xf0,
 x1f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xfd, 0xf0, 0x9f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xfd, 0xf0,
 x9f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xf9, 0xf0, 0x8f, 0xff, 0xff, 0xf9, 0xfc, 0x03, 0xf0, 0x10,
 x8f, 0xff, 0xff, 0xf9, 0xf8, 0x01, 0xe0, 0x10, 0xcf, 0xff, 0xff, 0xf9, 0xf0, 0xf0, 0xf9, 0xf0,
 xc7, 0xff, 0xff, 0xf9, 0xf3, 0xfc, 0xf9, 0xf0, 0xc7, 0xff, 0xff, 0xf9, 0xe3, 0xfc, 0x79, 0xf0,
 xe3, 0xff, 0xff, 0xf9, 0xe3, 0xfc, 0x79, 0xf0, 0xe3, 0xff, 0xff, 0xf9, 0xe3, 0xfc, 0x79, 0xf0,
 xf1, 0xff, 0xff, 0xf9, 0xe3, 0xfc, 0x79, 0xf0, 0xf1, 0xff, 0xff, 0xf9, 0xf3, 0xfc, 0x79, 0xf0,
 xf8, 0xff, 0xff, 0xf9, 0xf1, 0xf8, 0xf9, 0xf0, 0xfc, 0x7f, 0xff, 0xf9, 0xf8, 0x61, 0xf8, 0xc0,
 xfc, 0x3f, 0xff, 0xf9, 0xfc, 0x03, 0xf8, 0x00, 0xfe, 0x1f, 0xff, 0xf9, 0xff, 0x0f, 0xfe, 0x10,
 xff, 0x0f, 0xff, 0xff, 0xff, 0xff, 0xff, 0xf0, 0xff, 0x87, 0xff, 0xff, 0xff, 0xff, 0xff, 0xf0,
 xff, 0xc3, 0xff, 0xff, 0xff, 0xff, 0xff, 0xf0, 0xff, 0xe0, 0xff, 0xff, 0xff, 0xff, 0xff, 0xf0,
 xff, 0xf8, 0x3f, 0xff, 0xff, 0xff, 0xff, 0xf0, 0xff, 0xfc, 0x0f, 0xff, 0xff, 0xff, 0xff, 0xf0,
 xff, 0xff, 0x01, 0xff, 0xff, 0xff, 0xff, 0xf0, 0xff, 0xff, 0xc0, 0x00, 0x00, 0x00, 0x00, 0x00,
 xff, 0xff, 0xf8, 0x00, 0x00, 0x00, 0x00, 0x00, 0xff, 0xff, 0xff, 0x80, 0x00, 0x00, 0x00, 0x00
 };
-// Array of all bitmaps for convenience. (Total bytes used to store images in PROGMEM = 496)
+// Total bytes used to store images in PROGMEM = 496
 const int epd_bitmap_allArray_LEN = 1;
 const unsigned char* epd_bitmap_allArray[1] = {
@@ Line 75: / Line 78: @@
 };
 </code>
-==== Steps ====
-Remember to include the source array in the code if you plan to draw an image from the bitmap:
 === Step 1 ===
 Include necessary libraries.
@@ Line 85: / Line 85: @@
 #include <GxEPD2_BW.h>
 //Fonts
-#include <Fonts/FreeMonoBold9pt7b.h>
+#include <Fonts/FreeMonoBold12pt7b.h>
 </code>
 The code above also includes a font to draw text on the ePaper Display. There are many fonts one can use, and a non-exhaustive list is present below (files are located in the ''Adafruit GFX Library'', subfolder ''Fonts''):
-   * ''FreeMono12pt7b.h''
+<code>
-  * ''FreeMono18pt7b.h''
+   FreeMono12pt7b.h
-  * ''FreeMono24pt7b.h''
+   FreeMono18pt7b.h
-  * ''FreeMono9pt7b.h''
+   FreeMono24pt7b.h
-  * ''FreeMonoBold12pt7b.h''
+   FreeMono9pt7b.h
-  * ''FreeMonoBold18pt7b.h''
+   FreeMonoBold12pt7b.h
-  * ''FreeMonoBold24pt7b.h''
+   FreeMonoBold18pt7b.h
-  * ''FreeMonoBold9pt7b.h''
+   FreeMonoBold24pt7b.h
-  * ''FreeMonoBoldOblique12pt7b.h''
+   FreeMonoBold9pt7b.h
-  * ''FreeMonoBoldOblique18pt7b.h''
+   FreeMonoBoldOblique12pt7b.h
-  * ''FreeMonoBoldOblique24pt7b.h''
+   FreeMonoBoldOblique18pt7b.h
-  * ''FreeMonoBoldOblique9pt7b.h''
+   FreeMonoBoldOblique24pt7b.h
-  * ''FreeMonoOblique12pt7b.h''
+   FreeMonoBoldOblique9pt7b.h
-  * ''FreeMonoOblique18pt7b.h''
+   FreeMonoOblique12pt7b.h
-  * ''FreeMonoOblique24pt7b.h''
+   FreeMonoOblique18pt7b.h
-  * ''FreeMonoOblique9pt7b.h''
+   FreeMonoOblique24pt7b.h
-  * ''FreeSans12pt7b.h''
+   FreeMonoOblique9pt7b.h
-  * ''FreeSans18pt7b.h''
+   FreeSans12pt7b.h
-  * ''FreeSans24pt7b.h''
+   FreeSans18pt7b.h
-  * ''FreeSans9pt7b.h''
+   FreeSans24pt7b.h
-  * ''FreeSansBold12pt7b.h''
+   FreeSans9pt7b.h
-  * ''FreeSansBold18pt7b.h''
+   FreeSansBold12pt7b.h
-  * ''FreeSansBold24pt7b.h''
+   FreeSansBold18pt7b.h
-  * ''FreeSansBold9pt7b.h''
+   FreeSansBold24pt7b.h
-  * ''FreeSansBoldOblique12pt7b.h''
+   FreeSansBold9pt7b.h
-  * ''FreeSansBoldOblique18pt7b.h''
+   FreeSansBoldOblique12pt7b.h
-  * ''FreeSansBoldOblique24pt7b.h''
+   FreeSansBoldOblique18pt7b.h
-  * ''FreeSansBoldOblique9pt7b.h''
+   FreeSansBoldOblique24pt7b.h
-  * ''FreeSansOblique12pt7b.h''
+   FreeSansBoldOblique9pt7b.h
-  * ''FreeSansOblique18pt7b.h''
+   FreeSansOblique12pt7b.h
-  * ''FreeSansOblique24pt7b.h''
+   FreeSansOblique18pt7b.h
-  * ''FreeSansOblique9pt7b.h''
+   FreeSansOblique24pt7b.h
-  * ''FreeSerif12pt7b.h''
+   FreeSansOblique9pt7b.h
-  * ''FreeSerif18pt7b.h''
+   FreeSerif12pt7b.h
-  * ''FreeSerif24pt7b.h''
+   FreeSerif18pt7b.h
-  * ''FreeSerif9pt7b.h''
+   FreeSerif24pt7b.h
-  * ''FreeSerifBold12pt7b.h''
+   FreeSerif9pt7b.h
-  * ''FreeSerifBold18pt7b.h''
+   FreeSerifBold12pt7b.h
-  * ''FreeSerifBold24pt7b.h''
+   FreeSerifBold18pt7b.h
-  * ''FreeSerifBold9pt7b.h''
+   FreeSerifBold24pt7b.h
-  * ''FreeSerifBoldItalic12pt7b.h''
+   FreeSerifBold9pt7b.h
-  * ''FreeSerifBoldItalic18pt7b.h''
+   FreeSerifBoldItalic12pt7b.h
-  * ''FreeSerifBoldItalic24pt7b.h''
+   FreeSerifBoldItalic18pt7b.h
-  * ''FreeSerifBoldItalic9pt7b.h''
+   FreeSerifBoldItalic24pt7b.h
-  * ''FreeSerifItalic12pt7b.h''
+   FreeSerifBoldItalic9pt7b.h
-  * ''FreeSerifItalic18pt7b.h''
+   FreeSerifItalic12pt7b.h
-  * ''FreeSerifItalic24pt7b.h''
+   FreeSerifItalic18pt7b.h
-  * ''FreeSerifItalic9pt7b.h''
+   FreeSerifItalic24pt7b.h
+   FreeSerifItalic9pt7b.h
+</code>
 === Step 2 ===
 Declare GPIOs and some configurations needed to handle the ePaper display properly:
@@ Line 188: / Line 190: @@
     digitalWrite(EPAPER_SPI_CS_PIN,HIGH);
 </code>
-=== Step n ===
-//Describe activities done in Step n.//
+=== Step 5 ===
+Set display rotation, font and text colour:
+<code c>
+digitalWrite(EPAPER_SPI_CS_PIN,LOW);
+display.setRotation(1);
+display.setFont(&FreeMonoBold12pt7b);
+display.setTextColor(GxEPD_BLACK);
+</code>
+then get the external dimensions of the string to be printed:
+<code c>
+int16_t tbx, tby; uint16_t tbw, tbh;
+display.getTextBounds(HelloWorld, 0, 0, &tbx, &tby, &tbw, &tbh);
+uint16_t x = ((display.width() - tbw) / 2) - tbx;
+uint16_t y = ((display.height() - tbh) / 2) - tby;
+</code>
+=== Step 6 ===
+Then display contents of the image and the text in the ePaper display:
+<code c>
+display.setFullWindow();
+display.firstPage();
+do
+  {
+    display.drawImage((uint8_t*)epd_bitmap_logo_60,0,0,60,60);
+    display.setCursor(x, y);
+    display.print(HelloWorld);
+  }
+while (display.nextPage());
+digitalWrite(EPAPER_SPI_CS_PIN,HIGH);
+</code>
 ==== Result validation ====
 You should be able to see an image and a text on the ePaper Display.
-===== FAQ =====
-This section is to be extended as new questions appear. \\
-When using the printed version of this manual, please refer to the latest online version of this document to obtain the valid and up-to-date list of the FAQ.
-//Provide some FAQs in the following form:\\
-**Question?**: Answer.
-//
+<WRAP noprint>
 ===== Project information =====
 {{:en:iot-open:logo_iot_200_px.png?200|}}\\
@@ Line 217: / Line 246: @@
 {{:en:iot-open:ccbync.png?100|}}
 </figure>
+</WRAP>

en/iot-open/practical/hardware/sut/esp32/emb6_1.1708956685.txt.gz · Last modified: 2024/02/26 14:11 by pczekalski