2. April 2017

Custom font for OLED display connected to ESP8266 via SPI

Small OLED displays can easily extend the functionality of ESP8266.

I made an experiment with 128×64 OLED display from Com-Four.

The first challenge was how to connect the display to ESP8266. The recommended way for high performance is to use Serial Peripheral Interface Bus (SPI). The advantage of this approach is the speed, the disadvantage is that it will take more pins.

The display could be connected in following way (also described in the example of ESP8266_SD1306 library):

ESP8266 - SD1306
GND     - GND
3V      - VDD
D5      - SCK (also known as CLK)
D7      - SDA (also known as MOSI/DOUT)
D0      - RES
D2      - DC
D8      - CS

If you’re using PlatformIO, just add ESP8266_SD1306 library to dependencies in platfromio.ini:

lib_deps =
 ESP8266_SSD1306

Now you can run any example from Squix78 library. The library contains 3 sizes of Arial font: 10, 16 and 24px.

My goal was to display temperature from Observatory in Brno. Retrieving temperature and sending it to MQTT for ESP8266 was quite easy.

#!/usr/bin/env python3

import paho.mqtt.publish as publish

import urllib.request
f = urllib.request.urlopen('http://www.hvezdarna.cz/meteo/lastmeteodata')
content = f.read().decode('utf-8')

items = content.split(' ')

publish.single('/home/monitor/display/0', items[4], hostname='localhost')

I used default Arial 24 font. The problem was that the number was too small and barely readable from a distance. Luckily Daniel Eichhorn published great online tool which is able to generate font of any size for OLED display: http://oleddisplay.squix.ch.

My first attempt was to generate Roboto Light 54px font. It was working, just number 4 was not visible. I discovered a bug in the generator, that too big font will overflow default size of char in the jump table.

After several attempts I’ve found the right font for me DejaVu Sans 52px. This font was far more readable.

The last touch to make the font more readable was to tune down contrast little bit by the command:

display.setContrast(10);

I can definitely recommend this type of OLED display. It has good readability even during a sunny day. The code is available at GitHub in LampESP project.