In diesem Beitrag möchte ich dir Schritt-für-Schritt zeigen, wie du ein OLED-Display am ESP8266 programmierst. Ich gehe hier speziell auf den ESP8266 von Ideaspark der hier etwas anspruchsvoller ist, denn dieser zickt manchmal etwas herum und damit du keinen Frust bekommst, sondern Freude an der Programmierung gewinnst ist dieser Beitrag gedacht.
Zusätzlich werde ich dir auch andere Mikrocontroller zeigen, welche ebenso über ein OLED-Display verfügen und kleine passende Programme dazu.
Inhaltsverzeichnis
- Schritt-für-Schritt-Anleitung zum Programmieren eines OLED-Display am ESP8266
- Fazit – Programmieren eines OLED-Display am ESP8266
Schritt-für-Schritt-Anleitung zum Programmieren eines OLED-Display am ESP8266
Hier folgt nun die Schritt-für-Schritt-Anleitung, wie du dein OLED-Display programmieren kannst.
Schritt 1 – ermitteln der I2C Adresse
Damit wir mit dem Display kommunizieren können, müssen wir die I2C Adresse ermitteln. Diese I2C Adresse wird in Hexadezimaler Schreibweise dargestellt und findest du entweder in dem Handbuch zum Mikrocontroller (zumeist gibt es leider keines) oder du nutzt einen I2C Scanner.
Schritt 2 – Bibliotheken zum Programmieren
Für die Programmierung gibt es, wie ich finde, zwei sehr gute Bibliotheken:
Wobei ich hier die U8g2 bevorzuge, denn diese ist deutlich leichtgewichtiger und kommt mit wenig Code aus, was besonders auf kleinen Mikrocontroller mit wenig Speicherplatz sehr gut ist.
Schritt 3 – Ausgabe von “Hallo Welt!” auf dem OLED-Display mit U2g2
Kommen wir jetzt dazu und programmieren ein kleines Beispiel für die Mikrocontroller mit der Bibliothek U8G2.
Schritt 3.1 – Einbinden der Bibliothek in die Arduino IDE
Als Entwicklungsumgebung verwende ich hier die Arduino IDE, diese hat den Vorteil das man sehr einfach Boardtreiber und Bibliotheken mit wenigen Klicks hinzufügen kann.
Auf der linken Seite wählen wir zunächst den Bibliotheksverwalter (1) aus und dort suchen wir nach “u8g2” (2). Aus den Suchergebnissen wählen wir den Eintrag “U8f2 von oliver ….” aus. Wo bei mir in der Grafik die Schaltfläche ENTFERNEN (3) steht, sollte bei dir jetzt INSTALLIEREN sein und damit fügst du diese dann deiner Entwicklungsumgebung hinzu. Wenn diese Bibliothek erfolgreich installiert ist, siehst du einen TAG mit der Versionsnummer (4).
Schritt 3.2 – Aufbau des Programmes
Diese Bibliothek binden wir nun über Sketch > Bibliothek einbinden > U8g2 in unser leeres Projekt ein.
Wobei wir von diesen drei Bibliotheken zunächst nur eine benötigen, die U8g2lib.h.
#include <U8g2lib.h>
Als Nächstes definieren wir unser OLED Display, in meinem Fall habe ich ein 128×64 Pixel Display welches über I2C angeschlossen wurde. Als default Adresse wird hier 0x3c verwendet, welche wir für die beiden Mikrocontroller von Wemos & Ideaspark nicht anpassen müssen.
Einzig müssen wir die I2C Pins anpassen, welche wir der Objektinstanziierung übergeben. Welche I2C Pins du verwenden musst, kannst du aus dem Pinout des Mikrocontrollers übernehmen.
//das OLED Display ist über I2C angeschlossen #define SDA_PIN 12 #define SCL_PIN 14 U8G2_SSD1306_128X64_NONAME_F_SW_I2C u8g2(U8G2_R0, SCL_PIN, SDA_PIN, U8X8_PIN_NONE);
Da wir im ersten Beispiel nur den Text “Hallo Welt!” anzeigen wollen, reicht es aus den Code in die Setup-Funktion zu schreiben.
Eine Liste mit allen verfügbaren Schriftarten findest du unter https://github.com/olikraus/u8g2/wiki/fntlistall.
//beginn der Kommunikation mit dem Display u8g2.begin(); //leeren des Speichers u8g2.clearBuffer(); //setzen der Schriftart u8g2.setFont(u8g2_font_ncenB08_tr); //Schreiben des Textes "Hallo Welt!", //an die Spalte 0, Zeile 10 u8g2.drawStr(0, 10, "Hallo Welt!"); //Anzeigen des Textes u8g2.sendBuffer();
Das Programm erzeugt wie erwartet auf dem OLED-Display des ESP8266 von Ideaspark die Ausgabe von “Hallo Welt!” in der ersten Zeile, welche bei diesem Mikrocontroller bzw. Display gelb ist.
Der ESP8266 von Wemos hat auf der Rückseite die Beschriftung für die I2C Pins (SDA-D1 & SCL-D2) welche wir im Code entsprechend anpassen müssen. Wenn dieses geschehen ist, dann ist das kleine Programm auch auf diesem lauffähig und der Text “Hallo Welt!” wird angezeigt.
Schritt 4 – Ausgabe von “Hallo Welt!” auf dem OLED-Display mit Adafruit SSD1306
Bauen wir nun das kleine Beispiel mit der Bibliothek von Adafruit auf, um einen Vergleich zu haben. Die Bibliothek von Adafruit ist nicht nur größer, sondern bietet auch deutlich mehr Features und ist somit deutlich mächtiger als U8g2.
Schritt 4.1 – Einbinden der Bibliothek in die Arduino IDE
Zunächst binden wir wieder die benötigte Bibliothek über den Bibliotheksverwalter der Arduino IDE ein. Dazu klicken wir wieder auf der linken Seite auf das Symbol vom Bibliotheksverwalter (1) und suchen nach “Adafruit SSD1306” (2). Aus den Suchergebnissen wählen wir die Schaltfläche “INSTALLIEREN” (3) im Eintrag “Adafruit SSD1306 von Adafruit” aus. Wenn diese Bibliothek installiert ist, wird dir dieses über den Tag (4) angezeigt.
Die Bibliothek Adafruit SSD1306 hat einige Abhängigkeiten, welche wir zusätzlich installieren müssen. In dem Dialog wählen wir “ALLE INSTALLIEREN” aus.
Schritt 4.2 – Aufbau des Programmes
Auch hier binden wir die Bibliothek über Sketch> Bibliothek einbinden > Adafruit SSD1306 in unser leeres Projekt ein.
Von den beiden eingebundenen Bibliotheken benötigen wir jedoch lediglich Adafruit_SSD1306.h.
#include <Wire.h> #include <Adafruit_SSD1306.h>
Jedoch müssen wir noch zusätzlich die Wire.h Bibliothek hinzufügen.
Nun müssen wir unser Display noch konfigurieren. Das hier verwendete OLED Display hat eine Auflösung von 128×64 Pixel. Die I2C Pins sind SDA – D1 & SCL – D2.
#define SCREEN_WIDTH 128 #define SCREEN_HEIGHT 64 #define OLED_RESET -1 #define SCREEN_ADDRESS 0x3C #define SDA D1 #define SCL D2 Adafruit_SSD1306 display(SCREEN_WIDTH, SCREEN_HEIGHT, &Wire, OLED_RESET);
In der Funktion setup müssen wir nun noch die I2C Kommunikation einrichten. Dazu habe ich zuvor die beiden Felder SDA & SCL angelegt.
void setup() { ... Wire.begin(SDA, SCL); ... }
Da ich wie zuvor auch lediglich den Text “Hallo Welt!” anzeigen möchte, reicht es wieder den Text in der Funktion setup zu schreiben.
void setup() { Serial.begin(9600); Wire.begin(SDA, SCL); if (!display.begin(SSD1306_SWITCHCAPVCC, SCREEN_ADDRESS)) { Serial.println("Verbindung mit dem Display nicht möglich!"); while (true) ; } Serial.println("Hallo"); display.display(); delay(2000); display.clearDisplay(); display.setTextSize(3); display.setTextColor(SSD1306_WHITE); display.setCursor(10, 0); display.println("Hallo Welt!"); display.display(); }
Wenn das Programm auf dem Mikrocontroller ausgeführt wird, dann wird zunächst das Logo von Adafruit angezeigt und danach der Text “Hallo Welt!”. Da der Text länger als der verfügbare Platz ist, wird dieser automatisch umgebrochen.
Alternativ können wir jetzt über die Funktion setTextSize die Textgröße anpassen. In der offiziellen englischen Dokumentation findest du weitere Informationen zu den Funktionen rund um Schrift & Fonts.
Für das OLED Display am ESP8266 von Ideaspark musst du die Felder für die I2C Pins anpassen (SDA – D6 & SCL – D5).
Fazit – Programmieren eines OLED-Display am ESP8266
Die Integration und Verwendung der beiden Bibliotheken U8g2 & Adafruit SSD1306 gestalten sich unkompliziert. Jede Bibliothek bietet Beispiele, die theoretisch direkt auf deinen Mikrocontroller hochgeladen werden können. Allerdings sind bei Verwendung des ESP8266 einige Anpassungen erforderlich, da die I2C-Pins nicht immer den Standardpins entsprechen.
Als nächster Schritt werde ich erforschen, wie Grafiken auf diesen Displays dargestellt werden können, und dazu einen entsprechenden Beitrag veröffentlichen.