Introduction
When working on projects, to make them appear more advanced, we can display inspirational quotes on an OLED screen, for example as a desktop ornament, hanging decoration, or secondary screen.
This time, I’ll share how to use the ESP32/ESP8266, or any microcontroller that can connect to the internet, fully compatible with a 0.96-inch OLED screen without complex programming.
Project Resources
(1) ESP32 module (various types of internet-connected microcontrollers)
(2) 0.96-inch OLED screen (SSD1306, 4-pin IIC)
(3) Inspirational quotes API (automatically wraps for 0.96 OLED)
Example: http://api.xemowo.top/api/yan/yan.php?oled=1
Principle
(1) Internet-connected chip accesses API website, retrieves inspirational quotes from the API, which contains over 12,000 quotes to avoid repeating the same quote in a short period.
(2) Adapting to the OLED screen
In the code, we use a standard Chinese library of 12, allowing us to divide the screen into 4 lines, with 10 characters per line, thus displaying a total of 40 characters on the screen at once.
Therefore, we first select quotes within 40 characters from the API, and then group them into sets of 10 characters each.
As shown, ‘one’ displays 10 characters, and the remainder goes to ‘two’, and so on, dividing the quotes into several groups.
Although we could also group the entire sentence in the code, it greatly increases the workload. If we group it in the API, we only need to parse the JSON in the code.
(3) JSON Parsing
The content parsed from the API is in JSON format, so we need to parse the JSON to extract the required content in the code.
① First, load the built-in JSON parsing library
② Declare four variables for the JSON content
③ If the API is accessed successfully
Then, declare a JsonDocument object with StaticJsonDocument<500> doc
String json = http.getString(); Read API information
deserializeJson(doc, json); Deserialize JSON data
Then, we can store the json data in the four variables.
(4) OLED Display
For the SSD1306 4-pin OLED screen, I generally use the U8G2 library, which is easy to use and has a built-in Chinese library, allowing direct display of Chinese characters (over 3000 common characters).
Then declare the IIC hardware pins and set the U8G2 display direction R0 for normal display.
Set the Chinese font and start U8G2.
u8g2.setCursor (0, 55); Set the position of the text on the screen.
u8g2.println(four); Set the content to display.
u8g2.sendBuffer(); Upload the content to the buffer.
After obtaining the API information and parsing the JSON, the four segments of content are placed on each line of the OLED, with a spacing of about 15, which can be adjusted according to your screen.
(5) Internet Settings
For different chips and code platforms, this part may vary. I’ll use the ESP32 as an example.
Use two libraries, one for WiFi connection and the other for HTTP access.
Set the WiFi account password.
The HTTP library needs to be declared.
In the SETUP part, it continuously connects to WiFi, refreshing every 10 seconds (not too fast, otherwise it may refresh before connecting).
After connecting successfully, set the URL address (API address).
In the LOOP part, continuously access the API, with a delay of 5 seconds after each end.
Project Code
Please remember to credit the source when reposting the code.
Download link: https://wwmg.lanzouj.com/itMSC28l2gqb
#include //wifi library
#include //json parsing library
#include //http connection library
#include
#include //u8g2oled library
#include
#define BOARD_I2C_SCL 22
#define BOARD_I2C_SDA 21
U8G2_SSD1306_128X64_NONAME_F_SW_I2C u8g2(U8G2_R0, /* clock=*/ BOARD_I2C_SCL, /* data=*/ BOARD_I2C_SDA, /* reset=*/ U8X8_PIN_NONE);
// All Boards without Reset of the Display
const char * ID = "XEMOWO_PC";//wifi account
const char * PASSWORD = "1SUNjiajun";//wifi password
const char* one;//api first line content
const char* two;//api second line content
const char* three;//api third line content
const char* four;//api fourth line content
String API = "";
String url_xinzhi = "";
String WeatherURL = "";
HTTPClient http;
String GitURL(String api){
url_xinzhi = "http://api.xemowo.top/api/yan/yan.php?oled=1";//oled=1 indicates using oled-specific format
return url_xinzhi;
}
void ParseWeather(String url){
http.begin(url);
int httpGet = http.GET();
if(httpGet > 0) {
Serial.printf("HTTPGET is %d",httpGet);
if(httpGet == HTTP_CODE_OK) {
StaticJsonDocument<500> doc;
String json = http.getString();
Serial.println("Parsing");
Serial.println(json);
deserializeJson(doc, json);
one = doc["one"]; // "Life is a train heading towards a grave"
two = doc["two"]; // "On the way, there will be many stops, and it is difficult for anyone to accompany you from start to finish."
three = doc["three"]; // ""
four = doc["four"]; // ""
} else {
Serial.printf("ERROR1!!");
ParseWeather(WeatherURL);
}
} else {
Serial.printf("ERROR2!!");
ParseWeather(WeatherURL);
}
http.end();
}
void setup() {
// put your setup code here, to run once:
u8g2.setFont( u8g2_font_wqy12_t_gb2312 );//set to Chinese font
u8g2.begin();
u8g2.enableUTF8Print();
Serial.begin(115200);
Serial.println("Init u8g2 ....");
Serial.println("WiFi:");
Serial.println(ID);
Serial.println("PASSWORD:");
Serial.println(PASSWORD);
WiFi.begin(ID,PASSWORD);
u8g2.setCursor (0, 10);
u8g2.println("Connecting to WiFi...");
u8g2.sendBuffer();
while(WiFi.status()!=WL_CONNECTED) {
delay(10000);//delay a bit, otherwise it won't connect!
Serial.println("Connecting...");
u8g2.setCursor (0, 10);
u8g2.println("Connecting to WiFi...");
u8g2.sendBuffer();
}
Serial.println("Connected successfully!"); //==================WiFi Connection==================
u8g2.clearBuffer();
WeatherURL = GitURL(API);
delay(100);
}
void loop() {
ParseWeather(WeatherURL);
Serial.println(WeatherURL);
u8g2.clearBuffer();//clear the screen
delay(10);
u8g2.setCursor (0, 10);
u8g2.println(one);
u8g2.setCursor (0, 25);
u8g2.println(two);
u8g2.setCursor (0, 40);
u8g2.println(three);
u8g2.setCursor (0, 55);
u8g2.println(four);
u8g2.sendBuffer();//upload content to the buffer
delay(5000);
}
Author: Xiao Evil Demon owo, Source: Breadboard Community
Free application for development board
(Please indicate your intention, for joining groups please indicate city-name-industry job information)