Nokia 5110 Display mit ESP8266

In diesem Tutorial zeige ich dir wie einfach du das Nokia 5111 Display mit einem ESP8266 und Arduino ansteuern kannst. Für die Ansteuerung nutze ich die U8g2 Arduino Library die auch mit vielen anderen Displays super funktioniert. Als Mikrocontroller verwende ich den ESP8266 Nodemcu V3. Falls du das Display mit einem Arduino UNO betreiben willst, brauchst du noch einen Logik Level Converter, da das Display nur 3.3V tolerant ist.                

Genutzte Library

Bevor wir das Programm anschauen musst du zuerst die U8g2lib Library von Github herunterladen und installieren. Du findest die Arduino Library auf Github unter folgendem Link:
https://github.com/olikraus/U8g2_Arduino

Hilfreiche Links zur U8g2lib Arduino Library

Unter folgendem Link findest du alle Befehle von der Library ausführlich erklärt:
https://github.com/olikraus/u8g2/wiki/u8g2reference

Auch sehr hilfreich ist die Beschreibung der Schriftarten. Da findest du 1:1 Beispiele der unterstützen Schriften und grössen der Schriften:
https://github.com/olikraus/u8g2/wiki/fntgrp

Verdrahtung vom Nokia 5110 mit einem ESP8266 Nodemcu V3

Die Verdrahtung vom Display mit dem ESP8266 ist sehr einfach und schnell erledigt. Damit du es einfach nachstecken kannst habe ich ein Schaltplan mit Fritzing erstellt mit allen Verbindungen die nötig sind. Falls du die Hintergrundbeleuchtung nicht willst kannst du sie natürlich auch weglassen den das Display ist auch gut ohne Hintergrundbeleuchtung ablesbar.

Erläuterungen zu den wichtigsten Befehlen und Ablauf der Ansteuerung

Am Anfang des Programms wird das gewünschte Display und die Pinbelegung ausgewählt. Da der Hardware SPI verwendet wird können die CLK und DIN Pins nicht frei gewählt werden, sondern müssen fix auf D5 und D7 Angeschlossen werden. Dies geschieht mit folgendem Befehl:

U8G2_PCD8544_84X48_1_4W_HW_SPI u8g2(U8G2_R0, /* CE=*/ 4, /* DC=*/ 0, /* RST=*/ 5);

Da der Arbeitsspeicher vom Mikrocontroller und dem Display begrenzt ist werden die anzuzeigenden Daten nicht alle auf einmal, sondern schrittweise geschickt. Sobald das ganze Bild auf dem Display aufgebaut ist geht der wert von u8g2.nextPage() auf False und die Schlaufe wird verlassen. Dazu muss wird immer folgende Schlaufe genutzt:

u8g2.firstPage();
  do {
     // Hier schreibst du die gewünschten Texte und Befehle  
    u8g2.sendBuffer();                  // Daten an Display schicken
} while ( u8g2.nextPage() );

Nun zu den genutzten Befehlen, zuerst wird bei mir das komplette Display mit folgendem Befehl gelöscht:

u8g2.clear();                         // Display Löschen

Ihr findet auf dem Wiki von u8g2 eine ausführliche Übersicht über die Schriftarten. In meinem Beispiel habe ich die helfB08 genutz das B steht für Bold und die Zahl für die Schriftgrösse.

u8g2.setFont(u8g2_font_helvB08_tf); // Schrift definieren

Mit dem Befehl set.Cursor();  wird der Startpunkt zum schreiben beziehungsweise der Cursor gesetzt. Die Koordinaten X=0 und Y=0 sind immer oben Links im Display. Die Koordinaten beziehen sich bei der Schrift jedoch auf das erste Zeichen Links unten. Deshalb ist in diesem Beispiel der Y Wert auf 22 ansonsten würde der Text nicht im Display dargestellt.

u8g2.setCursor(7, 22);              // Cursor auf Pixel X=7 und Y=22 setzen

Mit dem Befehl u8g2.print(); kann nun Text auf das Display geschrieben werden dies ist ähnlich wie der Serial.print(); Befehl.

u8g2.print("Bastelgarage");         // Text schreiben

Arduino Beispiel Programm zum Ansteuern des Nokia 5110 Display 

/*******************************************************************************************
 *******************************************************************************************
 **                                www.bastelgarage.ch                                    **
 ** Der Onlineshop mit Videoanleitungen und kompletten Bausätzen für Anfänger und Profis! **
 *******************************************************************************************
 *******************************************************************************************
 ** Hier zeige ich euch wie einfach ihr ein Nokia 5110 Display ansteuern könnt. Ich habe  **
 ** für das Beispiel die U8g2lib Arduino Library genutzt, da diese für sehr viele Displays**
 ** eingesetzt werden kann. Als Mikrocontroller verwende ich den ESP8266 Nodemcu V3.      **                                                              **
 ** Falls du das Display mit einem Arduino UNO betreiben willst, brauchst du noch einen   **
 ** Logik Level Converter, da das Display nur 3.3V tolerant ist.                          **
 **                                                                                       **
 **                                                                                       **
 ** Verwendete Library:                                                                   **
 ** U8g2lib: https://github.com/olikraus/u8g2                                             **
 **                                                                                       **
 ** Autor: Philippe Keller                                                                **
 ** Datum: September 2017                                                                 **
 ** Version: 1.0                                                                          **
 *******************************************************************************************
*/

/************************( Importieren der genutzten Bibliotheken )************************/
#include <U8g2lib.h>
#include <SPI.h>

/***********************( Definieren der Objekte und initialisieren )***********************/
/*
  Pinbelegung:
  Display:      Nodemcu V3:
  GND           GND
  BL            3.3V (Beleuchtung)
  VCC           3.3V
  Clk           D5 (HSCLK SPI Clock Fix)
  Din           D7 (HMOSI MOSI Fix)
  DC            D3 (GPIO0)
  CE            D2 (GPIO4)
  RST           D1 (GPIO5)
*/

// Nokia 5110 Display
U8G2_PCD8544_84X48_1_4W_HW_SPI u8g2(U8G2_R0, /* CE=*/ 4, /* DC=*/ 0, /* RST=*/ 5);


/*****************************************( Setup )****************************************/
void setup(void) {

  u8g2.begin();

}

/*************************************(Hauptprogramm)**************************************/
void loop(void) {

  // u8g2.firstPage() und die while Schlaufe ist nötig da die daten in mehreren schritten
  // an das Display geschickt werden.

  u8g2.clear();                         // Display Löschen
  u8g2.firstPage();
  do {
    u8g2.setFont(u8g2_font_helvB08_tf); // Schrift definieren
    u8g2.setCursor(7, 22);              // Cursor auf Pixel X=7 und Y=22 setzen
    u8g2.print("Bastelgarage");         // Text schreiben
    u8g2.setCursor(10, 34);             // Cursor auf Pixel X=10 und Y=34 setzen
    u8g2.print("Onlineshop");           // Text schreiben
    u8g2.drawRFrame(0, 0, 84, 48, 8);   // Rechtek mit Rundung Zeichnen
    u8g2.sendBuffer();                  // Daten an Display schicken
  } while ( u8g2.nextPage() );

  delay(5000);
}