In this tutorial, we will go through a basic setup that allows us to write messages from the Serial Monitor to an SSD1306 OLED screen. We will be using the Adafruit GFX library and the SSD1306 library, where the text size adjusts according to the length of the message.
The goals of this tutorial are:
The Organic Light-Emitting Diode, or simply OLED, is the technology used for the screen in the Arduino Sensor Kit. OLED screens are incredibly popular in the world, and are typically divided into two separate categories: PMOLEDS and AMOLEDS. The PMOLEDS are used for simpler applications, where we can control each row or line of the screen. This results in most pixels being turned off. However, the AMOLEDS are a bit more advanced, and are heavily used for smart phones. It is so popular that hundreds of millions are being produced each year.
The SSD1306 display is of the PMOLED type, and its behavior can be controlled by using simple X and Y coordinates. While it is a small, inexpensive display, it can be used to create basic animations, shapes and include icons and even very lo-fi images.
1. First, we need to make sure the drivers for the MKR WiFi 1010 board is installed properly. The Web Editor already comes equipped with these, but if we are using an offline editor, we will need to install it manually. This can be done by navigating to Tools > Board > Board Manager.... Here we need to look for the Arduino SAMD boards (32-bits ARM Cortex M0+) and click on the install button.
2. We will first need to make sure we install the libraries needed to program the OLED screen. If we are using the Web Editor, there is no need to install anything. If we are using an offline editor, simply go to Tools > Manage libraries.., and search for Adafruit_GFX and Adafruit_SSD1306. We will need to install both of them.
3. With the dependencies now installed, we can now take a look at some of the main functions we will use in the program.
display.begin()
- initializes the SSD1306 library.display.setTextColor(screen, address)
- sets display to white color. display.setTextSize(SSD1306_WHITE)
- sets display to white color.display.display()
- updates the display.display.clearDisplay()
- clears the display.Serial.available()
- get the number of bytes available for reading from the serial port.Serial.read()
- reads the incoming serial data.length()
- checks the length of a string.The sketch below is based on an example provided in the Adafruit_SSD1306. Copy and paste the code in an editor of your choice, and upload the sketch to the board.
1#include <SPI.h>2#include <Wire.h>3#include <Adafruit_GFX.h>4#include <Adafruit_SSD1306.h>5
6#define SCREEN_WIDTH 128 // OLED display width, in pixels7#define SCREEN_HEIGHT 32 // OLED display height, in pixels8
9// Declaration for an SSD1306 display connected to I2C (SDA, SCL pins)10#define OLED_RESET 4 // Reset pin # (or -1 if sharing Arduino reset pin)11Adafruit_SSD1306 display(SCREEN_WIDTH, SCREEN_HEIGHT, &Wire, OLED_RESET);12
13String message; //to store messages written in Serial Monitor14int text_size; //changes text size of the display15
16
17void setup() {18 Serial.begin(9600);19
20 // SSD1306_SWITCHCAPVCC = generate display voltage from 3.3V internally21 if (!display.begin(SSD1306_SWITCHCAPVCC, 0x3C)) { // Address 0x3C for 128x3222 Serial.println(F("SSD1306 allocation failed"));23 for (;;); // loop forever if library fails to initialize24 }25
26 display.setTextColor(SSD1306_WHITE); //set text to white27
28}29
30void loop() {31
32 while (Serial.available()) {33 delay(2); //delay to allow byte to arrive in input buffer34 char c = Serial.read(); //store serial data in a char35 message += c; //convert char to string36 display.clearDisplay(); //clear display37 }38
39 if (message.length() > 0 && message.length() <= 5) { //messages between 1 and 5 characters activates text-size 340 display.setTextSize(3);41 Serial.println("display has been updated with: " + message); // print the message in Serial monitor for feedback42 }43
44 if (message.length() > 6 && message.length() <= 20) { //messages between 6 and 20 characters activates text-size 245 display.setTextSize(2);46 Serial.println("display has been updated with: " + message); // print the message in Serial monitor for feedback47 }48
49 if (message.length() >= 21) { //messages longer than 21 characters activates text-size 150 display.setTextSize(1);51 Serial.println("display has been updated with: " + message); // print the message in Serial monitor for feedback52 }53
54 display.setCursor(0, 0); //start printing at top left corner55 display.println(message); //prints the content of the message string on the display56 display.display(); //transfers the buffer to the display57 message = ""; //reset string after each print58
59}60
61}
Once we have uploaded the code to the board, wait a few seconds, then open the Serial Monitor. In the monitor, we can now start writing a message in the input field, and hit enter to send the message.
When we send the message, the display updates almost immediately. But before it updates, depending on the
length
of the message
string, the program chooses an appropriate text size. The message is then printed with the size of the text being 1, 2 or 3. If the code is not working, there are some common issues we can troubleshoot:
In this tutorial, we have mainly covered some basics on using an OLED screen together with the MKR WiFi 1010 board. We have set up a simple Serial Interface that allows us to write and transfer messages from the Serial Monitor to the screen.
The OLED screen can of course be used for many purposes! To get some more inspiration and try out more things, we can try any of the built in examples from the Adafruit_SSD1306 library.