Connect an SSD1306 OLED screen to ESPEasy

Last modified April 12, 2021

Let's see, step by step, how we can add a screen to our project with NodeMCUo Wemos D1 Mini and ESP Easy.

In this case, we are going to do it on the CO2 meter which I posted a few days ago, but it can be done with any other type of project.

One of the advantages of ESP Easy (and my favorite, without a doubt), is that it allows 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 is the screens, or «displays«.

And it is not that it allows us to connect very easily "a screen«Is that they are many the different screens that we can connect almost effortlessly.

In this case I have decided to add a screen of type SSD1306 to the CO2 meter Monochrome OLED (blue characters on a black background) of 0.96 inches (0.96 ″).

I have decided on this screen for these two advantages, although they are not the only ones:

  • Use only two cables data (plus the two power). Which means that it is extremely easy to connect and, in addition, by using only two pins, it leaves a lot of free pins to connect other accessories.
  • OLED technology has very low consumption. Important for anyone who wants to use the screen in a portable project with batteries.
  • Looks pretty good outdoors. Very important thing on certain occasions.
  • Low price. These screens can be obtained for about € 3 with shipping from China or about € 7 from Spain.

0.96 Inch 128X64 I2C SSD1306 OLED IIC White Screen Module

In AliExpress you can buy the screen SSD1306 for about 3 Euros, shipping included, from this link. It is a store with many positive reviews and shipping is by AliExpress Standard Shipping, so you should have it at home in about two weeks.

AZDelivery OLED Display Module I2C 128 x 64 pixels 0.96 Inch with white characters compatible with Arduino and Raspberry Pi with E-Book included!
  • ✔️️ AZDelivery's 128 x 64 pixel OLED display has strong contrast on the large 0.96-inch screen thanks to innovative OLED technology.
  • ✔️️ Due to the high resolution of 128 x 64 pixels, the screen provides ample space for displaying many items.
  • ✔️️ Easy screen connection with Arduino, Raspberry Pi and other microcontrollers by I2C interface via only four pins! Thanks to the integrated display adapter, the module can be connected to the I2C bus immediately.
  • ✔️️ By changing the I2C direction 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 helpful information on how to get started on your project, helps with quick setup, and saves time in the setup process. We provide a number of application examples, complete installation guides, and Arduino libraries.

* IMPORTANT: If you are going to make your first purchase on AliExpress, enter through this link you will receive € 21 in discount coupons for your purchases. It seems that the link only works for the first person to use it. If you need it, and it doesn't work for you, ask me at the Telegram group.

Maybe you are also interested in:  Measuring gas consumption

Connecting the SSD1306 display to the NodeMCU

The connection couldn't be easier. We have to do four connections. Two for food and two for data.

We only have to connect:

  • VDD from SSD1306 to Vin by NodeMCU
  • GND from SSD1306 to GND by NodeMCU
  • SCL from SSD1306 to D1 by NodeMCU
  • SDA from SSD1306 to D2 by NodeMCU

If your NodeMCU board has a VU pin, connect VDD to that pin instead of Vin. Not all NodeMCU boards have that pin.

I leave you the diagram also in this format, in case it is easier for you.

Note that in both diagrams I have used the gray and white wires backwards. Don't mix one diagram with another.

Be careful because the silkscreen of most NodeMCU V3 boards are wrong and it says D2 instead of D1 (there are two D1s).

Obviously D1 is the one is wrongly marked as D2 between D0 and «the other»D2.

IMPORTANT: Do not trust the order of the connections and double check them on your board. As the user Zulú indicates, in the comments, sometimes different manufacturers make changes of that type that can make our day bitter, if we are not careful.

The connection to another board, different to the NodeMCU (Wemos D1 Mini, for example), based on ESP8266, or another pass on ESP32, will be very similar. We will only have to be attentive to the change in the pins.

Setting

The configuration is also very simple.

We have to follow the following steps (click on each image to see it larger):

We are going to Tools -> I2C Scan.

This will make a scan of the devices connected to the NodeMCU via I2C, and it will show them to us.


Something similar to this should appear to us.

It means that ESPEasy has detected a PCF8574A OLED device on the screen at address 0x3C


We are going to Devices

Here we will see the list of devices that we have created (if there is any, if we are doing it with the CO2 meter, the MH-Z19 sensor should appear)


Click on Add, on a free device, to add our new device.


We select from the drop-down the device we want to add, in this case «Display - OLED SSD1306»


We enter the configuration data:

  1. The name we want to give the device
  2. We enable the device
  3. We select "Normal" or "Rotated" depending on whether we have the screen with the pins up or down
  4. The screen resolution in pixels. With the screen that I am using 128 × 64
  5. The size of the characters. Try to see which one you like.
  6. From "Line 1" to "Line 8" we will put the eight possible lines that we want to appear on the screen, as I explain later.
  7. We have the option of connecting a pushbutton to one of the NodeMCU pins to turn on the screen, mono that is normally off.
  8. The time it will take for the screen to turn off if we turn it on using the button in point 7.
  9. The screen update time. How often the data will be updated.
Maybe you are also interested in:  Power from NodeMCU, Wemos Mini D1 and Arduino

When we are satisfied with the configuration, we press «Submit» and we should start to see information on the screen.

Displaying text on screen SSD1306

The SSD1306 screen allows us to display, in the configuration that we have seen previously, eight lines of text.

These eight lines of text can contain the following types of data:

  • A fixed text
  • The value of a sensor
  • An ESP Easy variable, such as the current time.

Showing fixed text

As we have seen in the previous point, we have eight lines of text in which we can display both a fixed text (in the previous example, on line 1 the fixed text »CO2 METER ″ is shown with two spaces in front so that it appears centered on the screen).

To display fixed text, we simply have to type the text we want to display on the corresponding line.

We can add uppercase, lowercase and some special characters by including certain codes (note that it is not possible to write accented vowels):

NameCharacterCode
Degrees˚{D}
Degrees Celsius˚CdegreeC
degree_C
French quotes«
»
{<<}
{>>}
Greek letter Microµ{or}
Coin
¥
£
¢
{AND}
{AND}
{P}
{c}
Mathematical Symbols


¼
½
¾
±
×
÷
{^1}
{^2}
{^3}
{1_4}
{1_2}
{3_4}
{+-}
{x}
{..}

Showing the value of devices

To show the value of a device (a temperature, humidity, CO2 sensor or anything else) we only have to include the device name and the value we want to show in the format [DEVICE#VALOR]

In the example I have shown the PPM value of the CO2 device.

If we see the configuration of that device (from the Devices tab and selecting the device we want to see):

We can see that the name of the device is «CO2» and the value we want to show on the screen is «PPM», therefore, we will have to put [CO2#PPM] on the line where we want to show it.

Displaying system variables

There are a number of variables that ESP Easy itself updates and that we can display.

These variables are the following:

  • %sysname% - Replaced by the ESP Easy unit name (defined in the Config tab).
  • %ip% - It is replaced by the IP of the ESP Easy
  • %systime% - Replaced by the current time

Combining all three

We can combine fixed text, sensor values and ESPEasy variables in the same line, which allows us, for example, to put in a line "CO2: [CO2#PPM] ppm" to be able to include a title, before the sensor value, and the units then.

We could also write "TIME: %sistime%" or "IP: %ip%"

NTP configuration in ESPEasy, or "setting NodeMCU on time"

If you want to show the current time on the screen, using %sistime% », or you need it for some other reason, you have to bear in mind that the NodeMCU has no internal clock so you need to check the internet time.

It does this through the NTP protocol (Network Time Protocol, or Red Time Protocol, in Spanish), which is a very common system used in computer equipment (your equipment probably uses it, even if you don't know it, as is the case of Windows and Mac OS) and ESPEasy is prepared to use it very easily.

To configure it we will have to follow a series of steps:

  1. We go to the tab «Tools» (Tools)
  2. We select the option «Advanced Settings» (Advanced Settings)
  3. We activate the use of the NTP protocol and assign europe.pool.ntp.org (or whatever you prefer) as a time server
  4. We activate the DST option so that ESP Easy automatically makes the change of summer and winter time
  5. We introduce the corresponding time difference. In Spain 60 minutes, except the Canary Islands which are 0.
Maybe you are also interested in:  Using a buzzer with ESPEasy

Step-by-step video instructions

Although the process is straightforward, and shouldn't give anyone too many headaches, I have recorded a video with step-by-step instructions for adding the screen.

Even more options «Display - OLED SSD1306 / SH1106 Framed«

If you want still more display options, I recommend that when you select the display in the ESP Easy drop-down menu, you try the «Display - OLED SSD1306 / SH1106 Framed" (instead of "Display - OLED SSD1306»That we have used before).

He "Display - OLED SSD1306 / SH1106 Framed»Consume some more memory of ESP8266 that the «Display - OLED SSD1306«, So on devices with many sensors connected or many rules Long lines could give you memory problems.

I have used it to write the article MH-Z19B FALSE CO2 Sensors 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 problem, and there is still free memory for more things.

The start-up is practically the same. This is how I have it configured:

And so the content (in this case I tell you to hide the header (where the SSID of the wifi network could appear, among many other data), I tell you that if there is any line that is too long, scroll, to turn on the display when you arrive again text -in case I had turned it off from some rule-, and Line 1 and Line 2 I put it to show me the data of the two sensors that I have connected.

Write to «Display - OLED SSD1306 / SH1106 Framed»By rules:

In the example above the screen is updated every 60 seconds, so any displayed text or value will only update every 60 seconds.

If you want you can write directly on the screen from the rulers using the command oledframedcmd, , (the command it has to be a single parameter so if it includes spaces or commas you will have to write it between parentheses, as in the following example), which gives you much more control.

In the following example rule, the value CO2#PPM updates instantly on the screen each time it changes. Also, if CO2#PPM is less than 400, it displays the message "Initializing ..." instead of its value.

On CO2#PPM do If [CO2#PPM]> 399 oledframedcmd, 1, "[CO2#PPM] ppm" Else oledframedcmd, 1, "Initializing ..." Endif Endon

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 color of a flashing "traffic light" LED depending on the CO2 level.

On Rules#Timer = 1 do if [CM1106#PPM]> 1500 NeoPixelAll, 32,0,0 // LED red oledframedcmd, 1, "[CM1106#PPM] ppm" Elseif [CM1106#PPM]> 1000 NeoPixelAll, 16,9,0 // LED orange oledframedcmd , 1, "[CM1106#PPM] ppm" Elseif [CM1106#PPM]> 399 NeoPixelAll, 0.32,0 // LED green oledframedcmd, 1, "[CM1106#PPM] ppm" Else NeoPixelAll, 0,0,0 // LED off oledframedcmd, 1, "Initializing ..." Endif looptimerset_ms, 2,100 Endon On Rules#Timer = 2 do NeoPixelAll, 0,0,0 // LEDs OFF looptimerset_ms, 2,0 timerSet, 1,2 endon On System#Boot do NeoPixelAll, 0,0,0 // LEDs OFF timerSet, 1,2 EndOn

The size of the texts on the screen

The screen will automatically adjust the size of the texts to the number of lines you configure. You only have to select the number of lines you want to show, in the option "Lines per Frame".

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: [Environment#Temperature] ºC

OLED with three lines

"Lines per Frame": 3

Line 1: [CO2#PPM] ppm
Line 2: [Environment#Temperature] ºC
Line 3: [Ambiente#Humidity] %

If you put more lines than the screen is capable of showing, it will show the different lines in different screens what they will go through one after another (You can change the time between screen jumps).

You can also make the screens go by at the push of a button and even change the screen shown from the rules.

As you can see, the display options are many and, as always, no need to program anything. Just making the changes you want from a comfortable web page.

18 thoughts on “Conectar una pantalla OLED SSD1306 a ESPEasy”

  1. Thank you very much for taking the trouble to share these projects.
    Last night I finished configuring the CO2 sensor and taking advantage of the fact that I had an OLED screen for a drawer that I never put on a flying wing with INAV, I am going to complete the CO2 project with the screen, which seems more comfortable to handle and very easy to use. install with your great explanations.
    And one question, how to connect the
    NodeMcu to another wifi network if we take it to another site?
    Thank you so much.
    Regards.

    Reply
    • Hello Zulu.

      Great, you will tell us how the screen went and if, following the tutorial, you find a fault or something that needs to be improved.

      On the subject of Wi-Fi, if you take it to another site:

      I'm talking from memory, but I think I remember that if the ESPEasy is not able to connect to the access point it has configured (as would be the case that you say, when you take it to another site), it will recreate the access point with SSID «ESPEasy» (as we saw in the installation tutorial) so that you can connect to it from your mobile and you can configure the access point you want at that moment.

      Anyway, what I would do, if I were to use it in "portable" often, would be to configure the "Wi-Fi Zone" on my mobile to share its connection via Wi-Fi, setting it as the SSID and password the same as you have at home.
      In this way, when you turn it on outside the home, with the mobile sharing the connection, it will connect to it automatically.
      This on Android can be done without problem, on iOS (iPhone) I don't remember, because I haven't used it for a long time.

      Reply
  2. What a good idea about the WiFi Zone with the same SSID and password as the one at home!
    I already have everything working including the OLED screen.
    I have changed some lines to adapt them to my needs and the truth is that it is super easy: you change whatever it is, you click Submit and you immediately see the changes on the screen and so on until you leave it to everyone's taste.
    The only incidence that I have had when following the tutorial is that in the drawing of the wiring from the SSD1306 to the NodeMCU the Red (VCC) and Black (GND) cables on my screen, which is also an SSD1306, have been changed, I suppose it will be another manufacturer. It would not hurt to warn that this can happen and that you do not have to rely only on the colors but check the positive and negative twice, the result can be disastrous, I say this from previous experiences. :-).
    Otherwise all phenomenal. A ten.
    I will be attentive to new improvements to this project, and I will take a look at the CNC to see if I am capable of doing something, it is a gadget that should not be missing in any model airplane workshop.
    Thank you.
    A greeting.

    Reply
    • Thank you so much for everything.

      Regarding the notice about the connections, thank you very much, also, I have already included it in the article and, taking advantage of the fact that I was just mounting the video with the tutorial, it has been very good for me to include it as well.

      If you do the CNC project, keep us updated on your progress. Indeed, for model airplane issues, it has many possibilities.

      Reply
  3. Hello Mariete, first of all, I would like to thank you for so much effort for explaining to the "ignorant" in this matter all the steps to create the Co2 meter, I have already bought everything and looking forward to getting there to assemble it and experiment. I wanted to ask you a question that arises, does the power outlet (power) of the meter come from, if it is portable? And on the other hand, do we recommend a box that has aeration so that it does not get hot and we can mount it being cute? ... hehehe
    Thank you very much for giving us your time
    Cheers

    Reply
    • Hello Luis.

      Thank you very much ?

      I hope you get it right the first time, most have had no difficulty. If you have any questions, you can see that here there begins to be, among all of them, an important knowledge base, so it is easy for you to find the help you need.

      Power is via USB. Any mobile charger from 500mA will do. As long as it has more than 500mA, real, you will not have any problems. It is advisable to use a charger of at least 1A (1000mA) to avoid possible problems. You can also use it with the battery "power banks" without problem (I use them to leave them sometime, one night, outside to calibrate themselves).

      Keep in mind that consumption is relatively high, so it is not possible to use it with batteries permanently.

      About the box ... I have not seen anything too interesting. The best option is 3D printed boxes.

      Reply
      • Thank you very much for everything Mariete, I take note of everything and as soon as it arrives I get on with it, I really want ...
        Cheers

        Reply
  4. Hello Mariete. I already have the screen working. A very interesting project.
    One question, could the screen be configured differently so that it only shows one or two lines of information so that the larger texts are visible? My idea would be to take advantage of the resolution to see the value of ppm of co2 in full screen.

    Reply
    • Hello Juan Luis.

      I'm glad you already have the screen working.

      Yes, you can do it.

      The size of the texts is automatically adjusted depending on the number of lines shown on the display.

      You only have to select a line in the "Lines per Frame" option so that a single line with a larger size appears. You have to configure the screen as «Display - OLED SSD1306 / SH1106 Framed» as shown in the point «Even more options».

      I will add this information to the article.

      A greeting.

      Reply
      • Thank you very much, I will test it like this. I have the idea of leaving the meter to my son's teacher, they don't have any, and the easier the better.

        Reply
        • Great idea. You have to help schools to have adequate air quality to reduce the transmission of the virus.
          I know that there are quite a few teachers who, without having any idea of electronics or previous experience in hardware, are building this project.

          I have included in the article the instructions to do it and some examples to give you the idea of how it will look.

          Reply
  5. Hello Mario. I don't get the option to hide the header on the screen: «Hide header». Could it be because of the esp easy version? I have installed what I downloaded from your website.
    A greeting.

    Reply
    • Hello Juan Luis.

      Practically sure that is why. The old version did not include that option. Download it again from the main tutorial page and update it.

      A greeting.

      Reply
      • Thanks a lot. I have downloaded the new firmware from your website and updated it from the esp administration website. After it has rebooted and I already have the new option. I thought I was going to have to set everything up again but it has kept me everything.

        Reply

Leave a Comment