(11) Connecting a hybrid monochrome 128×64 OLED display to an Arduino

Connecting a hybrid monochrome 128×64 OLED display to an Arduino

Floris Wouterlood – August 14, 2019

Summary
We discuss here how to wire a very popular 128×64 pixel two-color monochrome graphic OLED display to an Arduino. OLED displays come in flavors. This particular display is based on the SSD1306 chip, and communication runs via the SPI interface. For microcontroller boards like the Arduino a small display can be desirable to display information collected by sensors, or just text. A ‘bare ‘sketch is provided with the essential instructions that make the display work.

Introduction
There are many very small displays on the market based on OLED (organic light-emitting diode) technology. OLEDs consume very little energy, they are cheaper than TFT displays, and compared with LCD they have the big advantage that they can display graphics and that they do not need background illumination. Pixels are either black or they light up. The background for text display of an OLED device is therefore ink black and the pixels stand out pretty nicely. For microelectronics like the Arduino where often a small display is desirable to provide useful information, e.g. time or the output of a particular sensor, there are a lot of different displays available. Among these are several OLED technology based displays.

figure 1: 128×64 OLED SPI display. Note that this one has 7 pins: GND, VDD, SCK, SDA, RES, DC and CS. These pins support a SPI interface. The display is hybrid monochrome, with two color bands: an upper strip 16 pixels high with yellow pixels and a lower area 48 pixels high with whitish blue pixels. Note that full-monochrome 128×64 OLED displays are shipped with a green tag label and that these hybrid yellow-whitish blue pixel OLED displays are shipped with a red tag label.

Typical OLED displays are 0.96 inch in width, with in most cases screen dimensions of 128×32 or 128×64 pixels. Each pixel is an individual OLED that can be switched on or off by the controller. OLED displays can be powered by different driver chips. Most popular are the SH1106 and SSD1306. We discuss here a very popular OLED display for the Arduino: a 128×64 hybrid, two-color display based on the SSD1306 chip. Note that this is not a true color display. It has an upper strip 16 pixels high where pixels light up yellow. Under this strip is the main area 48 pixels high where the pixels produce whitish blue light. This particular display uses the SPI protocol to receive instructions from the microcontroller board.

128×64 hybrid color SSD1306 based OLED with SPI interface: pins and connectivity with an Arduino.

Connectivity table

Pull up resistors not necessary
OLED displays that receive data via a SPI interface do not need pull-up or pull-down resistors. The led gets power from a 5V pin on the nano and needs a 220 ohm resistor in series.

Figure 2: Wiring scheme including a 128×64 OLED and an Arduino (here a Nano). Pins marked SCK, SDA, RES, DC and CS on the display are wired to, respectively, pins D13, D11, D8, D9 and D10 on the Nano. The data pin of the DHT11 sensor is connected to pin D4 on the Nano. The 10 kΩ resistor is a pull-up resistor. The led is controlled via pin D3 on the Nano.

Electronics and supplies
128×64 OLED display, Arduino microcontroller board, breadboard, jumper wires, led.

Figure 3: Working version of the 128×64 OLED display mounted together with a Nano and a led on a breadboard.

Sketch

The sketch is a ‘bare’ sketch meant to show the basics of 128×64 graphical and text OLED control. Nine circles are printed in the ‘yellow’ strip of the display, then a smiley and finally the words “Hello World” (figure 3).

The sketch uses Olikraus’ library U8glib.h. This library can be downloaded from GITHUB. Note the so-called ‘constructor’:

// U8GLIB constructor OLED display
U8GLIB_SSD1306_128X64 u8g(OLED_SCK, OLED_MOSI, OLED_CS, OLED_DC, OLED_RES);

The instructor informs the compiler that there is a SSD1306 based OLED display with dimensions 128×64 pixels that uses the pins as expressed in the #defines. If you use in the constructor dimensions 128×32 then the characters on the screen become vertically stretched.

// OLED_128x64_nano_bare.ino

// for use with SSD1306 Monochrome OLEDs
// essential fragments found on Henry’s Bench –
// sketch by Floris Wouterlood
// august 13, 2019
// public domain

// libraries
#include “U8glib.h”

// pins on the Arduino
#define OLED_SCK 13
#define OLED_MOSI 11
#define OLED_CS 10
#define OLED_DC 9
#define OLED_RES 8

int j = 0;

// U8glib constructor OLED display
U8GLIB_SSD1306_128X64 u8g(OLED_SCK, OLED_MOSI, OLED_CS, OLED_DC, OLED_RES);

void draw(void) {

// led control
digitalWrite (3, HIGH);
delay (500);
digitalWrite (3, LOW);

// yellow rings in upper strip
for (j=28; j<109;j= j+10){
u8g.drawCircle( j,7,7);
}

// smiley
u8g.drawCircle (110, 50, 12); // contour
u8g.drawDisc (105, 50, 2); // eye
u8g.drawDisc (115, 50, 2); // eye
u8g.drawLine (106, 56, 108, 56); // mouth
u8g.drawLine (113, 56, 115, 56); // mouth
u8g.drawLine (107, 57, 114, 57); // mouth
u8g.drawPixel (105, 55); // mouth
u8g.drawPixel (116, 55); // mouth

//text
u8g.setFont(u8g_font_unifont); // select font
u8g.drawStr ( 0, 55, “Hello World”);
}

void setup (void) {
pinMode (3, OUTPUT);
u8g.setFont (u8g_font_unifont);
u8g.setColorIndex (1); // Instructs display to draw with a pixel on. 0 = OFF, 1 = ON
}

void loop (void) {
u8g.firstPage ();
do {
draw ();
} while( u8g.nextPage () );
delay (500);
}

Discussion

I consider the 128×64 OLED display with the red-label tag a nice addition to the repertoire of displays available for the Arduino. Thanks to Oliver Kraus (‘Olikraus’) a complete library is available at https://github.com/olikraus/u8glib/wiki/userreference that documents all functions available to the nifty programmer. The U8g library does not only work with OLED displays but also with 128×64 LCD graphic displays. It is just a matter of constructor. Because every individual pixel in an OLED display can be addressed, simple graphical elements can be designed and displayed such as open and filled circles, circle segments, ellipses, lines, rectangles and triangles. In the U8g reference a number of special graphical characters is illustrated. Several font sizes are available. Displaying bitmaps is also possible, yet is more complex and needs time, effort and much testing to program. It is even possible to pixelize photo images for display in 128×64 in OLED. With the display discussed here, such a bitmapped image will have a 16 pixel high upper yellow band and a lower, 48 pixels high, whitish blue area. The alternative would be to display the bitmapped image in the lower area of the OLED display.
Thanks to the Olikraus library the number of possibilities of displaying mixed graphic/numeric elements are seemingly endless. For prolonged static display however OLEDS seem less suitable. There are reports of ‘burning in’ of pixels in OLED displays and OLED TVs that have been endlessly in ‘ON’ state.