Hi, when I include “AtWiFi.h” Sprites stop working, even without actually using anything from the AtWiFi library. The LCD still works and I can use the TFT_eSPI() funtions but TFT_eSprite() does not work.
How can I use both?
Thanks
Hi, when I include “AtWiFi.h” Sprites stop working, even without actually using anything from the AtWiFi library. The LCD still works and I can use the TFT_eSPI() funtions but TFT_eSprite() does not work.
How can I use both?
Thanks
Hi @JohnF
Can you provide your example code so that i can figure what’s wrong with it please.
Thanks
Anson
It works for me but it slows down considerably.
I took the One_bit_Yin_Yang sprite example from the LCD library and included AtWiFi.h and it runs but very poor performance. It will run ok for 5 seconds and then slow down and almost stop… it then will speed up a little but then slow down again.
I do get a LOT of compiler warnings pertaining to macro redefinitions and an error in the function mdns_free() which is void but is returning a value anyway. Something very wrong with that.
// This sketch draws a rotating Yin and Yang symbol. It illustrates
// the drawimg and rendering of simple animated graphics using
// a 1 bit per pixel (1 bpp) Sprite.
// Note: TFT_BLACK sets the pixel value to 0
// Any other colour sets the pixel value to 1
// A square sprite of side = 2 x RADIUS will be created
// (80 * 80)/8 = 800 bytes needed for 1 bpp sprite
// 6400 bytes for 8 bpp
// 12800 bytes for 16 bpp
#define RADIUS 40 // Radius of completed symbol = 40
#define WAIT 0 // Loop delay
// 1bpp Sprites are economical on memory but slower to render
#define COLOR_DEPTH 1 // Colour depth (1, 8 or 16 bits per pixel)
// Rotation angle increment and start angle
#define ANGLE_INC 3
int angle = 0;
#include <AtWiFi.h>
#include <TFT_eSPI.h> // Hardware-specific library
TFT_eSPI tft = TFT_eSPI(); // Invoke library
TFT_eSprite img = TFT_eSprite(&tft); // Sprite class
// -------------------------------------------------------------------------
void setup(void) {
tft.begin();
tft.setRotation(0);
tft.fillScreen(TFT_BLUE);
img.setColorDepth(COLOR_DEPTH);
img.createSprite(RADIUS * 2 + 1, RADIUS * 2 + 1);
img.fillSprite(TFT_BLACK);
}
// -------------------------------------------------------------------------
// -------------------------------------------------------------------------
void loop() {
// Draw Yin and Yang symbol circles into Sprite
yinyang(RADIUS, RADIUS, angle, RADIUS);
// Set the 2 pixel palette colours that 1 and 0 represent on the display screen
img.setBitmapColor(TFT_WHITE, TFT_BLACK);
// Push Sprite image to the TFT screen at x, y
img.pushSprite(tft.width() / 2 - RADIUS, 0); // Plot sprite
angle += 3; //Increment angle to rotate circle positions
if (angle > 359) {
angle = 0; // Limit angle range
}
// Slow things down
delay(WAIT);
}
// -------------------------------------------------------------------------
// =========================================================================
// Draw circles for Yin and Yang - rotate positions to create symbol
// =========================================================================
// x,y == coordinate center within Sprite
// start_angle = 0 - 359
// r = radius
void yinyang(int x, int y, int start_angle, int r) {
int x1 = 0; // getCoord() will update these
int y1 = 0;
getCoord(x, y, &x1, &y1, r / 2, start_angle); // Get x1 ,y1
img.fillCircle(x1, y1, r / 2, TFT_WHITE);
img.fillCircle(x1, y1, r / 8, TFT_BLACK);
getCoord(x, y, &x1, &y1, r / 2, start_angle + 180);
img.fillCircle(x1, y1, r / 2, TFT_BLACK);
img.fillCircle(x1, y1, r / 8, TFT_WHITE);
img.drawCircle(x, y, r, TFT_WHITE);
}
// =========================================================================
// Get coordinates of end of a vector, pivot at x,y, length r, angle a
// =========================================================================
// Coordinates are returned to caller via the xp and yp pointers
#define RAD2DEG 0.0174532925
void getCoord(int x, int y, int* xp, int* yp, int r, int a) {
float sx1 = cos((a - 90) * RAD2DEG);
float sy1 = sin((a - 90) * RAD2DEG);
*xp = sx1 * r + x;
*yp = sy1 * r + y;
}
Here is an example. Only commenting or uncommenting #include “AtWiFi.h” stops the Sprite working.
#include"TFT_eSPI.h"
#include"Free_Fonts.h" //include the header file
#include “AtWiFi.h”
TFT_eSPI tft = TFT_eSPI(); // Declare object “tft”
TFT_eSprite spr = TFT_eSprite(&tft); // Declare Sprite object “spr” with pointer to “tft” object
int humi;
void setup()
{
tft.init();
tft.fillScreen(TFT_BLUE);
tft.setRotation(3);
tft.setFreeFont(FSS12); //select Free, Sans
tft.drawString(“Startup tft”,0,5);//prints string
delay(1000);
spr.createSprite(320, 240);// Create a sprite of defined size
spr.setFreeFont(FSS24); //select Free, Sans
spr.drawString(“Startup Sprite”,0,50);//prints string
spr.pushSprite(0, 0);//52ms
delay(1000);
}
void loop()
{
humi++;
spr.drawString("humi: " + String(humi) + " ",0,5);//prints string
spr.pushSprite(0, 0);//52ms
delay(1000);
}
We have just figured this bug, and we are working on this. Please stay tuned
@ansonhe97, do we have any update on the Compatibility issues between AtWiFi and TFT_eSPI.
Thanks.
Hi @salman
This was fixed a while ago, check commits here: https://github.com/Seeed-Studio/Seeed_Arduino_atUnified/commit/bf63f457e286ed03f2f130c02455706f8190181b
Simply go to Network wiki and go through and get all the new updates.
Hi @ansonhe97,
I update the Wio terminal board definitions, Wireless Core Firmware and added new libraries mentioned Wio terminal wiki page, and still facing the issue.
When I add the #include <AtWiFi.h> nothing comes in the display, and if i add spr.setColorDepth(1); , sprite is shows as black and white color.
Can you share your sketch and we test on our end?
@ansonhe97 Sure,
#include <TFT_eSPI.h>
#include <Multichannel_Gas_GMXXX.h>
#include <Wire.h>
#include <ArduinoJson.h>
#include "DHT.h"
#include <AtWiFi.h>
GAS_GMXXX<TwoWire> gas;
TFT_eSPI tft;
TFT_eSprite spr = TFT_eSprite(&tft);
#define DHTPIN 0
#define DHTTYPE DHT11
DHT dht(DHTPIN, DHTTYPE);
//ArduinoJson value
String gasValue;
void setup() {
Serial.begin(115200);
tft.begin();
tft.setRotation(3);
gas.begin(Wire, 0x08);
dht.begin();
spr.createSprite(tft.width(), tft.height());
}
void loop() {
int no2, c2h5ch, voc, co;
spr.fillSprite(TFT_BLACK);
spr.setFreeFont(&FreeSansBoldOblique18pt7b);
spr.setTextColor(TFT_WHITE);
spr.drawString("Gas Monitor", 60 - 15, 10 , 1);
for (int8_t line_index = 0; line_index < 5 ; line_index++)
{
spr.drawLine(0, 50 + line_index, tft.width(), 50 + line_index, TFT_GREEN);
}
spr.drawRoundRect(5, 60, (tft.width() / 2) - 20 , tft.height() - 65 , 10, TFT_WHITE); // L1
// VOC
voc = gas.getGM502B();
if (voc > 999) voc = 999;
Serial.print("VOC: ");
Serial.print(voc);
Serial.println(" ppm");
spr.setFreeFont(&FreeSansBoldOblique12pt7b);
spr.setTextColor(TFT_RED);
spr.drawString("VOC", 7 , 65 , 1);
spr.setFreeFont(&FreeSansBoldOblique12pt7b);
spr.setTextColor(TFT_WHITE);
spr.drawNumber(voc, 15, 100, 1);
spr.setTextColor(TFT_GREEN);
spr.drawString("ppm", 55, 108, 1);
//CO
co = gas.getGM702B();
if (co > 999) co = 999;
Serial.print("CO: ");
Serial.print(co);
Serial.println(" ppm");
spr.setFreeFont(&FreeSansBoldOblique12pt7b);
spr.setTextColor(TFT_RED);
spr.drawString("CO", 7 , 150 , 1);
spr.setFreeFont(&FreeSansBoldOblique12pt7b);
spr.setTextColor(TFT_WHITE);
spr.drawNumber(co, 15, 185, 1);
spr.setTextColor(TFT_GREEN);
spr.drawString("ppm", 55, 193, 1);
//Temp
float t = dht.readTemperature();
//int tem = round(t);
int tem = t;
Serial.print("Temperature: ");
Serial.print(tem);
Serial.println( "*C");
spr.drawRoundRect((tft.width() / 2) - 10 , 60, (tft.width() / 2) / 2 , (tft.height() - 65) / 2 , 10, TFT_BLUE); // s1
spr.setFreeFont(&FreeSansBoldOblique9pt7b);
spr.setTextColor(TFT_RED) ;
spr.drawString("Temp", (tft.width() / 2) - 1 , 70 , 1); // Print the test text in the custom font
spr.setTextColor(TFT_WHITE);
spr.drawNumber(t, (tft.width() / 2) - 1 , 100, 1);
spr.setTextColor(TFT_GREEN);
spr.drawString("o", (tft.width() / 2) + 20, 95, 1);
spr.drawString("C", (tft.width() / 2) + 30, 100, 1);
//NO2
no2 = gas.getGM102B();
if (no2 > 999) no2 = 999;
Serial.print("NO2: ");
Serial.print(no2);
Serial.println(" ppm");
spr.drawRoundRect(((tft.width() / 2) + (tft.width() / 2) / 2) - 5 , 60, (tft.width() / 2) / 2 , (tft.height() - 65) / 2 , 10, TFT_BLUE); // s2
spr.setFreeFont(&FreeSansBoldOblique9pt7b);
spr.setTextColor(TFT_RED) ;
spr.drawString("NO2", ((tft.width() / 2) + (tft.width() / 2) / 2) , 70 , 1); // Print the test text in the custom font
spr.setTextColor(TFT_WHITE);
spr.drawNumber(no2, ((tft.width() / 2) + (tft.width() / 2) / 2) , 100, 1);
spr.setTextColor(TFT_GREEN);
spr.drawString("ppm", ((tft.width() / 2) + (tft.width() / 2) / 2) + 30 , 110, 1);
//Humdity
float h = dht.readHumidity();
Serial.print("Humidity: ");
Serial.print(h);
Serial.println( "%");
spr.drawRoundRect((tft.width() / 2) - 10 , (tft.height() / 2) + 30, (tft.width() / 2) / 2 , (tft.height() - 65) / 2 , 10, TFT_BLUE); // s3
spr.setFreeFont(&FreeSansBoldOblique9pt7b);
spr.setTextColor(TFT_RED) ;
spr.drawString("Humi", (tft.width() / 2) - 1 , (tft.height() / 2) + 40 , 1); // Print the test text in the custom font
spr.setTextColor(TFT_WHITE);
spr.drawNumber(h, (tft.width() / 2) - 1 , (tft.height() / 2) + 70, 1);
spr.setTextColor(TFT_GREEN);
spr.drawString("%", (tft.width() / 2) + 21, (tft.height() / 2) + 70, 1);
//C2H5CH
c2h5ch = gas.getGM302B();
if (c2h5ch > 999) c2h5ch = 999;
Serial.print("C2H5CH: ");
Serial.print(c2h5ch);
Serial.println(" ppm");
spr.drawRoundRect(((tft.width() / 2) + (tft.width() / 2) / 2) - 5 , (tft.height() / 2) + 30, (tft.width() / 2) / 2 , (tft.height() - 65) / 2 , 10, TFT_BLUE); // s4
spr.setFreeFont(&FreeSansBoldOblique9pt7b);
spr.setTextColor(TFT_RED) ;
spr.drawString("Ethyl", ((tft.width() / 2) + (tft.width() / 2) / 2) , (tft.height() / 2) + 40 , 1); // Print the test text in the custom font
spr.setTextColor(TFT_WHITE);
spr.drawNumber(c2h5ch, ((tft.width() / 2) + (tft.width() / 2) / 2) , (tft.height() / 2) + 70, 1);
spr.setTextColor(TFT_GREEN);
spr.drawString("ppm", ((tft.width() / 2) + (tft.width() / 2) / 2) + 30 , (tft.height() / 2) + 80, 1);
const size_t capacity = JSON_OBJECT_SIZE(7) + 145;
DynamicJsonDocument doc(capacity);
doc["id"] = "wio#2";
doc["voc"] = voc;
doc["co"] = co;
doc["no2"] = no2;
doc["eth"] = c2h5ch;
doc["temp"] = tem;
doc["hum"] = h;
char buffer[256];
serializeJson(doc, buffer);
//client.publish("WTout", buffer);
Serial.println(buffer);
spr.pushSprite(0, 0);
Serial.println("--------------------------------------------------------");
delay(2000);
}
It will only display the sprite if I comment or remove the #include <AtWiFi.h>
Hi @salman,
I have tested the program and the main problem is not two conflicts library but because of the limited ram of WT. The sprite can be used with Wifi but it’s limited.
Wifi it self runs freertos underneath and it takes about 75kb of ram at least for it. If creating a sprite with 320x240 that would another 76kb. And you are using some others such as ArduinoJson which also takes some ram. Wio Terminal only has 192kb of RAM.
My suggestion is that to use simply lcd fuctions for text that dont change much and only small sprites for changing text. You may do spr.deleteSprite()
right after your pushSprite to save room too.
You may also check on this, I just altered the sprite size to 10x10 to test:
Hi @ansonhe97, Thanks for insights.
I made all the static components to normal text and dynamic content to sprite such as sensor value, but it shows the normal text components first then sprite components, not printing them together.
#include <TFT_eSPI.h>
#include <Multichannel_Gas_GMXXX.h>
#include <Wire.h>
#include <ArduinoJson.h>
#include "DHT.h"
#include <AtWiFi.h>
GAS_GMXXX<TwoWire> gas;
TFT_eSPI tft;
TFT_eSprite spr = TFT_eSprite(&tft); //sprite
#define DHTPIN 0
#define DHTTYPE DHT11
DHT dht(DHTPIN, DHTTYPE);
//ArduinoJson value
String gasValue;
void setup() {
Serial.begin(115200);
tft.begin();
tft.setRotation(3);
gas.begin(Wire, 0x08);
dht.begin();
//spr.setColorDepth(2);
spr.createSprite(tft.width(), tft.height());
}
void loop() {
int no2, c2h5ch, voc, co;
// spr.fillSprite(TFT_BLACK);
// spr.setFreeFont(&FreeSansBoldOblique18pt7b);
// spr.setTextColor(TFT_WHITE);
// spr.drawString("Gas Monitor", 60 - 15, 10 , 1);
tft.fillScreen(TFT_BLACK); //Black background
tft.setTextColor(TFT_WHITE);
tft.setFreeFont(&FreeSansBoldOblique12pt7b); //select Free, Sans, Bold, Oblique, 12p
tft.drawString("Gas Monitor", 60 - 15, 10); //prints string at (70,80)
// for (int8_t line_index = 0; line_index < 5 ; line_index++)
// {
// spr.drawLine(0, 50 + line_index, tft.width(), 50 + line_index, TFT_GREEN);
// }
//
// spr.drawRoundRect(5, 60, (tft.width() / 2) - 20 , tft.height() - 65 , 10, TFT_WHITE); // L1
for (int8_t line_index = 0; line_index < 5 ; line_index++)
{
tft.drawLine(0, 50 + line_index, tft.width(), 50 + line_index, TFT_GREEN);
}
tft.drawRoundRect(5, 60, (tft.width() / 2) - 20 , tft.height() - 65 , 10, TFT_WHITE); // L1
// VOC
voc = gas.getGM502B();
if (voc > 999) voc = 999;
Serial.print("VOC: ");
Serial.print(voc);
Serial.println(" ppm");
// spr.setFreeFont(&FreeSansBoldOblique12pt7b);
// spr.setTextColor(TFT_RED);
// spr.drawString("VOC", 7 , 65 , 1);
spr.setFreeFont(&FreeSansBoldOblique12pt7b);
spr.setTextColor(TFT_WHITE);
spr.drawNumber(voc, 15, 100, 1);
// spr.setTextColor(TFT_GREEN);
// spr.drawString("ppm", 55, 108, 1);
tft.setFreeFont(&FreeSansBoldOblique12pt7b);
tft.setTextColor(TFT_RED);
tft.drawString("VOC", 7 , 65 );
// tft.setFreeFont(&FreeSansBoldOblique12pt7b);
// tft.setTextColor(TFT_WHITE);
// tft.drawNumber(voc, 15, 100, 1);
tft.setTextColor(TFT_GREEN);
tft.drawString("ppm", 55, 108, 1);
//CO
co = gas.getGM702B();
if (co > 999) co = 999;
Serial.print("CO: ");
Serial.print(co);
Serial.println(" ppm");
// spr.setFreeFont(&FreeSansBoldOblique12pt7b);
// spr.setTextColor(TFT_RED);
// spr.drawString("CO", 7 , 150 , 1);
spr.setFreeFont(&FreeSansBoldOblique12pt7b);
spr.setTextColor(TFT_WHITE);
spr.drawNumber(co, 15, 185, 1);
// spr.setTextColor(TFT_GREEN);
// spr.drawString("ppm", 55, 193, 1);
tft.setFreeFont(&FreeSansBoldOblique12pt7b);
tft.setTextColor(TFT_RED);
tft.drawString("CO", 7 , 150 , 1);
// tft.setFreeFont(&FreeSansBoldOblique12pt7b);
// tft.setTextColor(TFT_WHITE);
// tft.drawNumber(co, 15, 185, 1);
tft.setTextColor(TFT_GREEN);
tft.drawString("ppm", 55, 193, 1);
//Temp
float t = dht.readTemperature();
//int tem = round(t);
int tem = t;
Serial.print("Temperature: ");
Serial.print(tem);
Serial.println( "*C");
tft.drawRoundRect((tft.width() / 2) - 10 , 60, (tft.width() / 2) / 2 , (tft.height() - 65) / 2 , 10, TFT_BLUE); // s1
// spr.setFreeFont(&FreeSansBoldOblique9pt7b);
// spr.setTextColor(TFT_RED) ;
// spr.drawString("Temp", (tft.width() / 2) - 1 , 70 , 1); // Print the test text in the custom font
spr.setTextColor(TFT_WHITE);
spr.drawNumber(t, (tft.width() / 2) - 1 , 100, 1);
// spr.setTextColor(TFT_GREEN);
// spr.drawString("o", (tft.width() / 2) + 20, 95, 1);
// spr.drawString("C", (tft.width() / 2) + 30, 100, 1);
tft.setFreeFont(&FreeSansBoldOblique9pt7b);
tft.setTextColor(TFT_RED) ;
tft.drawString("Temp", (tft.width() / 2) - 1 , 70 , 1); // Print the test text in the custom font
// tft.setTextColor(TFT_WHITE);
// tft.drawNumber(t, (tft.width() / 2) - 1 , 100, 1);
tft.setTextColor(TFT_GREEN);
tft.drawString("o", (tft.width() / 2) + 20, 95, 1);
tft.drawString("C", (tft.width() / 2) + 30, 100, 1);
//NO2
no2 = gas.getGM102B();
if (no2 > 999) no2 = 999;
Serial.print("NO2: ");
Serial.print(no2);
Serial.println(" ppm");
tft.drawRoundRect(((tft.width() / 2) + (tft.width() / 2) / 2) - 5 , 60, (tft.width() / 2) / 2 , (tft.height() - 65) / 2 , 10, TFT_BLUE); // s2
// spr.setFreeFont(&FreeSansBoldOblique9pt7b);
// spr.setTextColor(TFT_RED) ;
// spr.drawString("NO2", ((tft.width() / 2) + (tft.width() / 2) / 2) , 70 , 1); // Print the test text in the custom font
spr.setTextColor(TFT_WHITE);
spr.drawNumber(no2, ((tft.width() / 2) + (tft.width() / 2) / 2) , 100, 1);
// spr.setTextColor(TFT_GREEN);
// spr.drawString("ppm", ((tft.width() / 2) + (tft.width() / 2) / 2) + 30 , 110, 1);
tft.setFreeFont(&FreeSansBoldOblique9pt7b);
tft.setTextColor(TFT_RED) ;
tft.drawString("NO2", ((tft.width() / 2) + (tft.width() / 2) / 2) , 70 , 1); // Print the test text in the custom font
// tft.setTextColor(TFT_WHITE);
// tft.drawNumber(no2, ((tft.width() / 2) + (tft.width() / 2) / 2) , 100, 1);
tft.setTextColor(TFT_GREEN);
tft.drawString("ppm", ((tft.width() / 2) + (tft.width() / 2) / 2) + 30 , 110, 1);
//Humdity
float h = dht.readHumidity();
Serial.print("Humidity: ");
Serial.print(h);
Serial.println( "%");
tft.drawRoundRect((tft.width() / 2) - 10 , (tft.height() / 2) + 30, (tft.width() / 2) / 2 , (tft.height() - 65) / 2 , 10, TFT_BLUE); // s3
// spr.setFreeFont(&FreeSansBoldOblique9pt7b);
// spr.setTextColor(TFT_RED) ;
// spr.drawString("Humi", (tft.width() / 2) - 1 , (tft.height() / 2) + 40 , 1); // Print the test text in the custom font
spr.setTextColor(TFT_WHITE);
spr.drawNumber(h, (tft.width() / 2) - 1 , (tft.height() / 2) + 70, 1);
// spr.setTextColor(TFT_GREEN);
// spr.drawString("%", (tft.width() / 2) + 21, (tft.height() / 2) + 70, 1);
tft.setFreeFont(&FreeSansBoldOblique9pt7b);
tft.setTextColor(TFT_RED) ;
tft.drawString("Humi", (tft.width() / 2) - 1 , (tft.height() / 2) + 40 , 1); // Print the test text in the custom font
// tft.setTextColor(TFT_WHITE);
// tft.drawNumber(h, (tft.width() / 2) - 1 , (tft.height() / 2) + 70, 1);
tft.setTextColor(TFT_GREEN);
tft.drawString("%", (tft.width() / 2) + 21, (tft.height() / 2) + 70, 1);
//C2H5CH
c2h5ch = gas.getGM302B();
if (c2h5ch > 999) c2h5ch = 999;
Serial.print("C2H5CH: ");
Serial.print(c2h5ch);
Serial.println(" ppm");
tft.drawRoundRect(((tft.width() / 2) + (tft.width() / 2) / 2) - 5 , (tft.height() / 2) + 30, (tft.width() / 2) / 2 , (tft.height() - 65) / 2 , 10, TFT_BLUE); // s4
// spr.setFreeFont(&FreeSansBoldOblique9pt7b);
// spr.setTextColor(TFT_RED) ;
// spr.drawString("Ethyl", ((tft.width() / 2) + (tft.width() / 2) / 2) , (tft.height() / 2) + 40 , 1); // Print the test text in the custom font
spr.setTextColor(TFT_WHITE);
spr.drawNumber(c2h5ch, ((tft.width() / 2) + (tft.width() / 2) / 2) , (tft.height() / 2) + 70, 1);
// spr.setTextColor(TFT_GREEN);
// spr.drawString("ppm", ((tft.width() / 2) + (tft.width() / 2) / 2) + 30 , (tft.height() / 2) + 80, 1);
tft.setFreeFont(&FreeSansBoldOblique9pt7b);
tft.setTextColor(TFT_RED) ;
tft.drawString("Ethyl", ((tft.width() / 2) + (tft.width() / 2) / 2) , (tft.height() / 2) + 40 , 1); // Print the test text in the custom font
// tft.setTextColor(TFT_WHITE);
// tft.drawNumber(c2h5ch, ((tft.width() / 2) + (tft.width() / 2) / 2) , (tft.height() / 2) + 70, 1);
tft.setTextColor(TFT_GREEN);
tft.drawString("ppm", ((tft.width() / 2) + (tft.width() / 2) / 2) + 30 , (tft.height() / 2) + 80, 1);
const size_t capacity = JSON_OBJECT_SIZE(7) + 145;
DynamicJsonDocument doc(capacity);
doc["id"] = "wio#2";
doc["voc"] = voc;
doc["co"] = co;
doc["no2"] = no2;
doc["eth"] = c2h5ch;
doc["temp"] = tem;
doc["hum"] = h;
char buffer[256];
serializeJson(doc, buffer);
//client.publish("WTout", buffer);
Serial.println(buffer);
spr.pushSprite(0, 0);
Serial.println("--------------------------------------------------------");
delay(2000);
}
You are still creating the full size buffer by this:
spr.createSprite(tft.width(), tft.height());
you may check this example for some reference:
Create what you need and delete after.
Hi @ansonhe97, Thanks, I moved all the static elements to basic LCD and dynamic elements to sprite like you mentioned, but still there is a problem. now the display and wifi is not working, do we have any practise or way to optimize the SRAM?
Can you share your code again pls?
@ansonhe97 Sure.
#include <TFT_eSPI.h>
#include <Multichannel_Gas_GMXXX.h>
#include <Wire.h>
#include <PubSubClient.h>
#include <ArduinoJson.h>
#include <AtWiFi.h>
#include "DHT.h"
GAS_GMXXX<TwoWire> gas;
TFT_eSPI tft;
TFT_eSprite spr = TFT_eSprite(&tft); //sprite
unsigned int no2, c2h5ch, voc, co;
// Update these with values suitable for your network.
const char* ssid = "********"; // WiFi Name
const char* password = "********"; // WiFi Password
const char* mqtt_server = "********"; // MQTT Broker URL
#define DHTPIN 0
#define DHTTYPE DHT11
DHT dht(DHTPIN, DHTTYPE);
WiFiClient wioClient;
PubSubClient client(wioClient);
//ArduinoJson value
char gasValue[256];
void setup_wifi() {
Serial.println();
Serial.print("Connecting to ");
Serial.println(ssid);
WiFi.begin(ssid, password); // Connecting WiFi
while (WiFi.status() != WL_CONNECTED) {
delay(500);
Serial.print(".");
}
Serial.println("");
Serial.println("WiFi connected");
Serial.println("IP address: ");
Serial.println(WiFi.localIP()); // Display Local IP Address
}
void reconnect() {
// Loop until we're reconnected
while (!client.connected()) {
// Serial.print("Attempting MQTT connection...");
// Create a random client ID
String clientId = "WioTerminal-";
clientId += String(random(0xffff), HEX);
// Attempt to connect
if (client.connect(clientId.c_str())) {
//Serial.println("connected");
// Once connected, publish an announcement...
} else {
// Serial.print("failed, rc=");
// Serial.print(client.state());
// Serial.println(" try again in 5 seconds");
// Wait 5 seconds before retrying
delay(5000);
}
}
}
void setup() {
Serial.begin(115200);
tft.begin();
tft.setRotation(3);
setup_wifi();
gas.begin(Wire, 0x08);
dht.begin();
//Head
tft.fillScreen(TFT_BLACK);
tft.setFreeFont(&FreeSansBoldOblique18pt7b);
tft.setTextColor(TFT_WHITE);
tft.drawString("Air Quality", 70, 10 , 1);
//Line
for (int8_t line_index = 0; line_index < 5 ; line_index++)
{
tft.drawLine(0, 50 + line_index, tft.width(), 50 + line_index, TFT_GREEN);
}
//VCO & CO Rect
tft.drawRoundRect(5, 60, (tft.width() / 2) - 20 , tft.height() - 65 , 10, TFT_WHITE); // L1
//VCO Text
tft.setFreeFont(&FreeSansBoldOblique12pt7b);
tft.setTextColor(TFT_RED);
tft.drawString("VOC", 7 , 65 , 1);
tft.setTextColor(TFT_GREEN);
tft.drawString("ppm", 55, 108, 1);
//CO Text
tft.setFreeFont(&FreeSansBoldOblique12pt7b);
tft.setTextColor(TFT_RED);
tft.drawString("CO", 7 , 150 , 1);
tft.setTextColor(TFT_GREEN);
tft.drawString("ppm", 55, 193, 1);
// Temp rect
tft.drawRoundRect((tft.width() / 2) - 10 , 60, (tft.width() / 2) / 2 , (tft.height() - 65) / 2 , 10, TFT_BLUE); // s1
tft.setFreeFont(&FreeSansBoldOblique9pt7b);
tft.setTextColor(TFT_RED) ;
tft.drawString("Temp", (tft.width() / 2) - 1 , 70 , 1); // Print the test text in the custom font
tft.setTextColor(TFT_GREEN);
tft.drawString("o", (tft.width() / 2) + 30, 95, 1);
tft.drawString("C", (tft.width() / 2) + 40, 100, 1);
//No2 rect
tft.drawRoundRect(((tft.width() / 2) + (tft.width() / 2) / 2) - 5 , 60, (tft.width() / 2) / 2 , (tft.height() - 65) / 2 , 10, TFT_BLUE); // s2
tft.setFreeFont(&FreeSansBoldOblique9pt7b);
tft.setTextColor(TFT_RED);
tft.drawString("NO2", ((tft.width() / 2) + (tft.width() / 2) / 2) , 70 , 1); // Print the test text in the custom font
tft.setTextColor(TFT_GREEN);
tft.drawString("ppm", ((tft.width() / 2) + (tft.width() / 2) / 2) + 30 , 120, 1);
//Humi Rect
tft.drawRoundRect((tft.width() / 2) - 10 , (tft.height() / 2) + 30, (tft.width() / 2) / 2 , (tft.height() - 65) / 2 , 10, TFT_BLUE); // s3
tft.setFreeFont(&FreeSansBoldOblique9pt7b);
tft.setTextColor(TFT_RED) ;
tft.drawString("Humi", (tft.width() / 2) - 1 , (tft.height() / 2) + 40 , 1); // Print the test text in the custom font
tft.setTextColor(TFT_GREEN);
tft.drawString("%", (tft.width() / 2) + 30, (tft.height() / 2) + 70, 1);
//c2h5ch Rect
tft.drawRoundRect(((tft.width() / 2) + (tft.width() / 2) / 2) - 5 , (tft.height() / 2) + 30, (tft.width() / 2) / 2 , (tft.height() - 65) / 2 , 10, TFT_BLUE); // s4
tft.setFreeFont(&FreeSansBoldOblique9pt7b);
tft.setTextColor(TFT_RED) ;
tft.drawString("Ethyl", ((tft.width() / 2) + (tft.width() / 2) / 2) , (tft.height() / 2) + 40 , 1); // Print the test text in the custom font
tft.setTextColor(TFT_GREEN);
tft.drawString("ppm", ((tft.width() / 2) + (tft.width() / 2) / 2) + 30 , (tft.height() / 2) + 90, 1);
setup_wifi();
}
void loop() {
if (!client.connected()) {
reconnect();
}
// VOC
voc = gas.getGM502B();
if (voc > 999) voc = 999;
// Serial.print("VOC: ");
// Serial.print(voc);
// Serial.println(" ppm");
spr.createSprite(40, 30);
spr.fillSprite(TFT_BLACK);
spr.setFreeFont(&FreeSansBoldOblique12pt7b);
spr.setTextColor(TFT_WHITE);
spr.drawNumber(voc, 0, 0, 1);
spr.pushSprite(15, 100);
spr.deleteSprite();
//CO
co = gas.getGM702B();
if (co > 999) co = 999;
// Serial.print("CO: ");
// Serial.print(co);
// Serial.println(" ppm");
spr.createSprite(40, 30);
spr.setFreeFont(&FreeSansBoldOblique12pt7b);
spr.setTextColor(TFT_WHITE);
spr.drawNumber(co, 0, 0, 1);
spr.setTextColor(TFT_GREEN);
spr.pushSprite(15, 185);
spr.deleteSprite();
//Temp
float t = dht.readTemperature();
//int tem = round(t);
int tem = t;
// Serial.print("Temperature: ");
// Serial.print(tem);
// Serial.println( "*C");
spr.createSprite(30, 30);
spr.setFreeFont(&FreeSansBoldOblique12pt7b);
spr.setTextColor(TFT_WHITE);
spr.drawNumber(t, 0, 0, 1);
spr.setTextColor(TFT_GREEN);
spr.pushSprite((tft.width() / 2) - 1, 100);
spr.deleteSprite();
//NO2
no2 = gas.getGM102B();
if (no2 > 999) no2 = 999;
// Serial.print("NO2: ");
// Serial.print(no2);
// Serial.println(" ppm");
spr.createSprite(45, 30);
spr.setFreeFont(&FreeSansBoldOblique12pt7b);
spr.setTextColor(TFT_WHITE);
spr.drawNumber(no2, 0, 0, 1);
spr.pushSprite(((tft.width() / 2) + (tft.width() / 2) / 2), 97);
spr.deleteSprite();
//Humidity
float h = dht.readHumidity();
if (h > 99) h = 99;
// Serial.print("Humidity: ");
// Serial.print(h);
// Serial.println( "%");
spr.createSprite(30, 30);
spr.setFreeFont(&FreeSansBoldOblique12pt7b);
spr.setTextColor(TFT_WHITE);
spr.drawNumber(h, 0, 0, 1);
spr.pushSprite((tft.width() / 2) - 1, (tft.height() / 2) + 67);
spr.deleteSprite();
//C2H5CH
c2h5ch = gas.getGM302B();
if (c2h5ch > 999) c2h5ch = 999;
// Serial.print("C2H5CH: ");
// Serial.print(c2h5ch);
// Serial.println(" ppm");
spr.createSprite(45, 30);
spr.setFreeFont(&FreeSansBoldOblique12pt7b);
spr.setTextColor(TFT_WHITE);
spr.drawNumber(c2h5ch, 0 , 0, 1);
spr.pushSprite(((tft.width() / 2) + (tft.width() / 2) / 2), (tft.height() / 2) + 67);
spr.deleteSprite();
const size_t capacity = JSON_OBJECT_SIZE(7) + 145;
DynamicJsonDocument doc(capacity);
doc["id"] = "wio#2";
doc["voc"] = voc;
doc["co"] = co;
doc["no2"] = no2;
doc["eth"] = c2h5ch;
doc["temp"] = tem;
doc["hum"] = h;
serializeJson(doc, gasValue);
Serial.println(gasValue);
client.publish("WTout", "hello");
delay(2000);
}
But I need the MQTT to send to the data to server! Is there any other way?
Thanks.I saw that, so is there anyway save some SRAM?