- 1 Connecting the SSD1306 display to the NodeMCU
- 2 Configuration
- 3 Displaying text on the display SSD1306
- 4 NTP configuration in ESP Easy, or "setting the ESP8266 to time".
- 5 Step-by-step video instructions
- 6 Even more options "Display - OLED SSD1306/SH1106 Framed".
- 7 Connecting two OLED displays
Let's see, step by step, how to adding a display to your project with NodeMCU or Wemos D1 Mini and ESP Easy.
In this case, I will take the example of the CO2 meterbut it can be done with any other type of project.
One of the advantages of ESP Easy (and my favouriteis that it enables us to connect to our project many different accessories without having to program or complicate our lives. with firmware modifications or adaptations. One of the most interesting elements are the displays, or "screens".displays".
And it's not just that it allows us to connect very easily "a screen"is that they are many different screens that we can connect almost effortlessly.
In this case I have decided to add a SSD1306 type display to the CO2 meter. OLED monochrome (blue characters on black background) of 0.96 inches (0.96″).
I have opted for this display because of these two advantages, but they are not the only ones:
- Use only two cables data (plus the two power supply pins). This makes it extremely easy to connect and, by using only two pins, leaves plenty of free pins for connecting other sensors and accessories.
- OLED technology has very low consumption. Important for those who want to use the display in a portable project with batteries.
- Looks pretty good outdoors. This is very important on certain occasions.
- Low price. These screens can be obtained for around €3 with shipping from China or around €7 from Spain.
0.96 inch white OLED IIC 128X64 I2C I2C white OLED display module SSD1306
On AliExpress you can buy the screen SSD1306 for about 3 Euros, shipping included, from this link. It is a shop with many positive reviews and the shipping is by AliExpress Standard Shipping, so you should have it at home in about two weeks.
- ✔️️ AZDelivery's 128 x 64 pixel OLED display has a strong contrast on the large 0.96 inch screen thanks to the innovative OLED technology.
- ✔️️ Due to the high resolution of 128 x 64 pixels, the screen provides ample space for the display of many elements.
- ✔️️ Easy connection of the display to Raspberry Pi and other microcontrollers via the I2C interface with only four pins! Thanks to the integrated display adapter, the module can be connected to the I2C bus immediately.
- ✔️️ By changing the I2C address and soldering a third contact, two displays can be operated simultaneously. The OLED module can be connected to 3.3 V.
- ✔️ This product includes an E-Book that provides useful information on how to start your project, helps with quick setup and saves time in the configuration process. We provide a number of application examples, comprehensive installation guides and libraries.
Connecting the SSD1306 display to the NodeMCU
The connection couldn't be easier. You have to make four connections. Two for power and two for data.
All you have to do is connect:
- VDD from SSD1306 to Vin of NodeMCU
- GND from SSD1306 to GND of NodeMCU
- SCL from SSD1306 to D1 of NodeMCU
- SDA from SSD1306 to D2 of NodeMCU
If your NodeMCU board has a VU pin, connect VDD to that pin. instead of Vin. Not all NodeMCU boards have this pin.
Be careful because the silkscreen on some of the NodeMCU V3 boards is wrong and says D2 instead of D1 (there are two D2), as you can see in this picture.
Obviously D1 is the one that is erroneously marked as D2 between D0 and "the other" D2.
IMPORTANTDon't rely on the order of the connections and double check them on your board. Sometimes different manufacturers make such changes that can make your day if you are not careful.
IMPORTANTThese instructions are for screens operating with 5V power supply. Make sure your display is powered at 5V. If your display is powered at 3.3V you will need to connect the VDD pin of the display to one of the pins marked 3.3V on your NodeMCU or Wemos D1 Mini (on some boards the silkscreen on this pin may be "3V" or "3V3").
The connection to another board, different from the NodeMCU based on ESP8266, or another one based on ESP32, will be very similar. We will only have to pay attention to the change in the pins. Here is the connection diagram with the Wemos D1 Mini, for example:
The configuration is also very simple.
You have to follow the steps below (click on each image to see it bigger):
We will Tools -> I2C Scan.
This will scan the devices connected to the NodeMCU via I2C, and show them to you. You can then check that the display is properly connected.
You should get something similar to this.
Means that ESP Easy has detected the display a device of type PCF8574A OLED at address 0x3C.
Go to Devices (Devices)
Here you will see the list of devices you have created (if any, if you are doing it, as in the example, with the CO2 meter you should see the sensor).
Click on Add (add), on a free device, to add your new device.
Select from the drop-down menu the device you want to add, in this case "Display - OLED SSD1306" (or, better, the "Display - OLED SSD1306/SH1106 Framed", as shown below).recommended-)
Enter the configuration data:
- The name you want to give to the screen
- Enables the device
- Select "Normal" or "Rotated" depending on whether you have the display pinned up or down.
- The screen resolution in pixels. With the screen I'm using 128×64
- The size of the characters. Try it out to see which one you like.
- From "Line 1" to "Line 8" you will set the eight possible lines you want to appear on the screen, as explained below.
- You have the option of connecting a push button to one of the NodeMCU pins to turn the display on, so that it is normally off.
- The time it will take for the display to turn off if you turn it on using the button in point 7.
- The screen refresh time. How often the data will be updated.
When you are happy with the settings, press "Submit" and you should start to see information on the screen.
Displaying text on the display SSD1306
The SSD1306 allows you to display, in the configuration you have seen above, eight lines of text.
These eight lines of text may contain the following types of data:
- A fixed text
- The value of a sensor
- An ESP Easy variable such as the current time or your IP address.
Showing fixed text
As you have seen in the previous point, you have eight lines of text in which you can display either fixed text (in the example above, line 1 shows the fixed text "CO2 METER" with two spaces in front of it so that it appears centred on the screen).
To display fixed text, simply type the text you want to display on the corresponding line.
You can add uppercase, lowercase and some special characters by adding certain codes (note that it is not possible to write accented vowels):
|French inverted commas
|Greek letter Micro
Showing the value of devices
To display the value of a device (a temperature, humidity, CO2 or any other sensor) you only have to include the device name and the value you want to be displayed in the format [DEVICE#VALOR].
In the example I have shown the PPM value of the CO2 device.
If you look at the configuration of that device (from the Devices tab and selecting the device you want to see):
You can see that the name of the device is "CO2"and the value we want to display on the screen is "PPM"Therefore, we will have to put in the line where we want to show it [CO2#PPM].
Note that you have a column for indicating the number of decimals that you want to be displayed. If the value must be an integer without decimals you can set it to 0.
Displaying system variables
There are a number of variables updated by ESP Easy itself that you can display.
These variables are as follows:
- %sysname% - Replaced by the name of the ESP Easy unit (defined on the Config tab).
- %ip% - Replaced by the ESP Easy IP
- %systime% - Replaced by current time
Combining the three
You can combine fixed text, sensor values and ESP Easy variables on the same line, allowing you for example to put in one line "CO2: [CO2#PPM] ppm" so that you can include a title before the sensor value and the units after it.
You could also type "TIME: %systime%" or "IP: %ip%".
NTP configuration in ESP Easy, or "setting the ESP8266 to time".
If you want to display the current time on the screen, using %systime%", or need it for some other reason, you have to take into account that the ESP8266 has no internal clock so you need to check the internet time.
It does this by means of the NTP protocol (Network Time Protocol), which is a very commonly used system in computers (your computer probably uses it, even if you don't know it, as is the case with Windows and Mac OS) and ESP Easy is prepared to use it very easily.
To set it up, you will have to follow a series of steps:
- Go to the "Tools" tab.
- Select the "Advanced Settings" option.
- Activate the use of the NTP protocol and assign europe.pool.ntp.org (or the one you prefer) as time server.
- Activate the DST option so that ESP Easy automatically switches between summer and winter time.
- Enter the corresponding time difference. In Spain 60 minutes, except for the Canary Islands, where it is 0.
Step-by-step video instructions
Although the process is simple, and should not give anyone too much trouble, I have recorded a video with step-by-step instructions on how to add the screen.
Even more options "Display - OLED SSD1306/SH1106 Framed"
If you want to, you can still more viewing optionsI recommend that when selecting the display in the ESP Easy drop-down menu you try the "Display - OLED SSD1306/SH1106 Framed"(instead of the "Display - OLED SSD1306"(see above).
Please note that "Display - OLED SSD1306/SH1106 Framed"consumes some more memory ESP8266 that the "Display - OLED SSD1306"so that in devices with many sensors connected o many rules extensive, it could lead to memory problems (normally it should not cause any problems).
I used it to write the article CO2 Sensors MH-Z19B FALSE and in the accompanying video, with two MH-Z19B sensors connected (one original and one fake), the SSD1306 display and three WS2812B LEDs without any problems, and there is still free memory for more.
The set-up is pretty much the same. This is how I have it set up:
And so the content (in this case I tell it to hide the header (where the SSID of the wifi network could be displayed, among other data), I tell it to scroll if there is a line that is too long, to turn on the display when new text arrives - in case it has been turned off by some rule -, and Line 1 and Line 2 I tell it to show me the data of the two sensors I have connected.
Write to the "Display - OLED SSD1306/SH1106 Framed"by means of rules:
In the above example the display is updated every 60 seconds, so any text or value displayed will only be updated every 60 seconds.
If you want you can write directly on the screen from the rules via the command oledframedcmd,,. (the command has to be a single parameter so if it includes spaces or commas you will have to write it in brackets, as in the following example), which gives you much more control.
In the following example rule, the value CO2#PPM is updated instantly on the display each time it changes. In addition, if CO2#PPM is less than 400, it displays the message "Initialising...", instead of its value.
On CO2#PPM do
If [CO2#PPM] > 399
Of course, you can combine it in the rules as you like. For example, in the following example I use an ESP Easy timer to update in the same rule the value shown on the display and the colour of a flashing "traffic light" LED depending on the CO2 level.
On Rules#Timer=1 do
NeoPixelAll,32,0,0,0 // LED red
Elseif [CM1106#PPM] > 1000
NeoPixelAll,16,9,0 // LED orange
Elseif [CM1106#PPM] > 399
NeoPixelAll,0,32,0 // LED green
NeoPixelAll,0,0,0,0 // LED off
On Rules#Timer=2 do
NeoPixelAll,0,0,0,0 // LEDS OFF
On System#Boot do
NeoPixelAll,0,0,0,0 // LEDS OFF
The size of the texts on the screen
The display will automatically adjust the size of the texts. to the number of lines you configure. Just select the number of lines you want to display, in the "Lines per Frame" option.
OLED with one line
"Lines per Frame: 1
Line 1: [CO2#PPM] ppm
OLED with two lines
"Lines per Frame: 2
Line 1: [CO2#PPM] ppm
Line 2: [Ambient#Temperature] ºC
OLED with three lines
"Lines per Frame: 3
Line 1: [CO2#PPM] ppm
Line 2: [Ambient#Temperature] ºC
Line 3: [Ambient#Humidity] %
If you put more lines than the screen is capable of displaying, it will display the different lines in different screens that will pass by one after the other (you can change the time between screen jumps).
You can also make the screens scroll by at the push of a button and even change the display of the screen shown from the rules.
As you can see, the display options are many and, as always, no programming required. Just make the changes you want from one convenient web page.
Connecting two OLED displays
In some projects it can be interesting to connect two OLED displays (or more than two) simultaneously.
There is no problem to do so and is very easy.
Here you can see a prototype CO2 meter with two 1.3″ OLED displaysThe two displays, one shows the CO2 concentration permanently and the other can display different data, such as temperature, humidity, etc.
As we have seen above, the OLED display has an I2C address that the ESP8266, ESP32 or other microcontroller uses to communicate with it. What we need to connect two displays to a single microcontroller is each display has its own I2C address and, quite simply, connect them in parallel and use them as if they were two completely independent screens.
Changing the I2C address of the OLED screen
IMPORTANT: It is very important to make sure that you use OLED displays that allow changing the I2C address. (many don't), otherwise you won't be able to do it this way (you would need an I2C multiplexer, which complicates things a bit). Below are the links to the screens I use that allow I2C address change.
For example, this 1.3″ OLED screen (a little larger than the normal ones, which are 0.96″) allows for change the I2C addressbetween 0x78 and 0x7A, relocating a resistor:
You can find this 1.3″ SSD1306 display on AliExpress by clicking here. If you prefer a screen 0.96″ SSD1306 that allows to change the I2C address, I bought this one. Both allow the I2C address to be changed.
Connection of two OLED I2C displays
If you are using a ModeMCU board to connect the two SSD1306 OLED displays in parallel would look like this:
If you are going to connect the SSD1306 OLED displays to a Wemos D1 Mini board the connections would be as follows:
All that remains is to configure ESP Easy to use the two OLED displays.
Configure ESP Easy to use two I2C OLED displays SSD1306
You simply have to add in the configuration (Devices tab) two devices "Display - OLED SSD1306/SH1106 Framed". (exactly as we have seen before with a single screen) and configure each one independently, with the data we want:
In some cases, the I2C addresses may not match what is displayed on the screen. (For example, on this screen I used, the silkscreen says that the addresses are 0x78 and 0x7A but the real addresses are 0x3C and 0x3D.
Remember that you can find out the addresses of the devices connected via I2C with the "I2C Scanner" in the "Tools" tab).