Οδηγός για τη μονάδα απεικόνισης 0,96 OLED

Το organic light – emitting diode OLED είναι μια υψηλής αντίθεσης και υψηλής ανάλυσης μονάδα απεικόνισης, που προβάλει στο χρήστη μια εικόνα με άριστα χαρακτηριστικά. Αυτού του είδους μονάδα απεικόνισης δεν χρειάζεται πίσω φωτισμό, από την στιγμή που τον παράγει μόνο του, έτσι αποτελεί σημαντικό πλεονέκτημα μεταξύ άλλων πολλών πλεονεκτημάτων, όπως η μικρή κατανάλωση, την μεγάλη αποδοτικότητα, τη μεγάλη αντίθεση εικόνας, τη μεγάλη γωνία όρασης, το μικρό χρόνο ανταπόκρισης κ.ά. που την κάνουν ιδανική σε σχέση με τις κοινές LCD μονάδες απεικόνισης.

Οι μικρές OLED μονάδες απεικόνισης είναι πολύ χρήσιμες στις ηλεκτρονικές κατασκευές. Συνδέονται με απλό τρόπο, έχουν μεγάλη αναγνωσιμότητα και έτσι είναι κατάλληλες για απεικόνιση δεδομένων, αριθμών και απλών εικόνων. Μπορείς να τις βρεις σε διάφορα μεγέθη και χρώματα, ανάλογα την ανάλυση. Ανάλογα την κατασκευή που θέλεις να υλοποιήσεις, μπορείς να διαλέξεις μοντέλο που επικοινωνεί με παράλληλη, SPI ή Ι2C σύνδεση. Βγαίνουν σε μονόχρωμα, δίχρωμα και 16-bit έγχρωμα μοντέλα για να τα χρησιμοποιήσεις στις κατασκευές σου.

Σε αυτό το αρθρο θα σου δείξω πως θα χρησιμοποιήσεις μια OLED μονάδα απεικόνισης, μεγέθους 0,96 ίντσες, σε επικοινωνία βάσει του πρωτοκόλλου I2C με το Arduino. Θα χρησιμοποιήσουμε το μοντέλο που έχει τέσσερις ακροδέκτες, τους GND, VCC, SCL και SDA και επικοινωνεί βάσει του πρωτοκόλλου Ι2C.

Θα σου δείξω μερικά χαρακτηριστικά της OLED μονάδας απεικόνισης, το πως θα τη συνδέσεις με το Arduino, πως θα γράψεις κείμενο, πως θα σχεδιάζεις σχήματα και να απεικονίζεις απλές bitmap εικόνες.

Συνδεσμολογία κυκλώματος

Για να σου δείξω τη χρήση του OLED θα υλοποιήσουμε το ακόλουθο κύκλωμα.

Στην εικόνα φαίνεται το μοντέλο Arduino και συγκεκριμένα το Nano και μια OLED μονάδα απεικόνισης μεγέθους 0,96 ίντσες, με τέσσερις ακροδέκτες. Επειδή το OLED μοντέλο χρησιμοποιεί επικοινωνία I2C η διασύνδεση είναι πολύ απλή, όπως δείχνεται στον ακόλουθο πίνακα.

Προσοχή! Το μοντέλο OLED 0,96 ιντσών που χρησιμοποιούμε εδώ, έχει τους ακροδέκτες του από αριστερά προς δεξιά, με την σειρά που αναγράφονται στον προηγούμενο πίνακα. Στην αγορά μπορείς να βρεις πανομοιότυπα μοντέλα, με τους δύο πρώτους ακροδέκτες ανεστραμένους.

Εγκατάσταση βιβλιοθηκών

Για να μπορέσεις να χρησιμοποιήσεις την μονάδα απεικόνισης OLED στην κατασκευή με το Arduino, πρέπει να εγκαταστήσεις τις κατάλληλες βιβλιοθήκες και συγκεκριμένα: την adafruit_SSD1306.h και την adafruit_GFX.h. Ακολούθησε τις ακόλουθες οδηγίες για να εγκαταστήσεις αυτές τις βιβλιοθήκες:

Adafruit_SSD1306
1] Πάτησε εδώ Adafruit_SSD1306-2.4.3.zip για να κατεβάσεις την βιβλιοθήκη Adafruit_SSD1306. Θα πρέπει να έχεις ένα συμπιεσμένο φάκελο .zip στο φάκελο downloads στον υπολογιστή σου.
2] Κάνε unzip το αρχείο .zip και θα πρέπει να πάρεις τον φάκελο Adafruit_SSD1306
3] Μετακίνησε τη βιβλιοθήκη Adafruit_SSD1306 στο φάκελο των βιβλιοθηκών του περιβάλλοντος Arduino IDE
4] Τέλος κάνε επανεκκίνηση την εφαρμογή Arduino IDE.

Adafruit_GFX
1] Πάτησε εδώ Adafruit_GFX_Library-1.10.7.zip για να κατεβάσεις την βιβλιοθήκη Adafruit_GFX. Θα πρέπει να έχεις ένα συμπιεσμένο φάκελο .zip στο φάκελο downloads στον υπολογιστή σου.
2] Κάνε unzip το αρχείο .zip και θα πρέπει να πάρεις τον φάκελο Adafruit_GFX
3] Μετακίνησε τη βιβλιοθήκη Adafruit_GFX στο φάκελο των βιβλιοθηκών του περιβάλλοντος Arduino IDE
4] Τέλος κάνε επανεκκίνηση την εφαρμογή Arduino IDE.

Προβολή κειμένου στη OLED μονάδα απεικόνισης: ένα παράδειγμα

Η βιβλιοθήκη Adafruit για την μονάδα απεικόνισης OLED, περιλαμβάνει αρκετές συναρτήσεις για προβολή κειμένου. Σε αυτή την ενότητα, θα μάθεις πως να γράφεις και να ολισθαίνεις κείμενο, χρησιμοποιώντας τις συναρτήσεις της βιβλιοθήκης.

Το επόμενο sketch εμφανίζει το μήνυμα “Hello, world” στην OLED μονάδα απεικόνισης.

Προσοχή! Αν χρησιμοποιείς Arduino Nano σε κινέζικη απομίμηση δοκίμασε να επιλέξεις στο μενού ως πλακέτα τη “Arduino Duemilavone or Diecimila”

#include <Wire.h>
#include <Adafruit_GFX.h>
#include <Adafruit_SSD1306.h>
#define SCREEN_WIDTH 128 // OLED display width, in pixels
#define SCREEN_HEIGHT 64 // OLED display height, in pixels
//Declaration for an SSD1306 display connected to I2C (SDA, SCL pins)
Adafruit_SSD1306 display(SCREEN_WIDTH, SCREEN_HEIGHT, &Wire, -1);
void setup() {
  Serial.begin(115200);
  if(!display.begin(SSD1306_SWITCHCAPVCC, 0x3C)){//Address 0x3C 
    Serial.println(F("SSD1306 allocation failed"));
    for(;;);
  }
  delay(2000);
  display.clearDisplay();
  display.setTextSize(1);
  display.setTextColor(WHITE);
  display.setCursor(0, 10);
  display.println("Hello, world");
  display.display();
}
void loop() {
}

Μετά που ανεβάσουμε τον κώδικα στο Arduino, εμφανίζεται το μήνυμα όπως στην ακόλουθη εικόνα.

Τώρα ας δούμε περιληπτικά πως ο κώδικας δουλεύει. Πρώτα πρέπει να εισάγεις τις αναγκαίες βιβλιοθήκες. Χρησιμοποιούμε την βιβλιοθήκη Wire για να μπορούμε να έχουμε I2C επικοινωνία και τις Adafruit βιβλιοθήκες Adafruit_GFX και Adafruit_SSD1306 για να μπορούμε να εμφανίζουμε κείμενο στην OLED:

#include  <Wire.h>
#include  <Adafruit_GFX.h>
#include <Adafruit_SSD1306.h>

Αρχικοποίηση της μονάδας απεικόνισης OLED

Μετά θα πρέπει να ορίσεις το πλάτος και το ύψος σε pixels της μονάδας απεικόνισης OLED. Σε αυτό το παράδειγμα χρησιμοποιούμε ένα 128 Χ 64 pixels OLED. Αν χρησιμοποιήσεις άλλα μεγέθη δήλωσε τα στις μεταβλητές SCREEN_WIDTH και SCREEN_HEIGHT.

#define SCREEN_WIDTH 128   // OLED display width, in pixels.
#define SCREEN_HEIGHT  64  // OLED display height, in pixels.

Μετά δημιούργησε ένα display αντικείμενο με το πλάτος και ύψος που δήλωσες νωρίτερα καθώς επίσης ότι χρησιμοποιείς I2C επικοινωνία (&Wire).

Adafruit_SSD1306  display(SCREEN_WIDTH, SCREEN_HEIGHT, &Wire, -1);

Η παράμετρος (-1) δηλώνει ότι η OLED μονάδα απεικόνισης δεν έχει ακροδέκτη RESET. Εάν το OLED που χρησιμοποιείς έχει ακροδέκτη RESET, θα πρέπει να το συνδέσεις σε ένα GPIO και θα πρέπει να περάσεις τον αριθμό του GPIO στη θέση της παραμέτρου.

Μέσα στη συνάρτηση setup, αρχικοποίησε το Serial Monitor στην ταχύτητα των 115200, για σκοπούς debugging και συγκεκριμένα με την γραμμή κώδικα:

Serial.begin(115200);

Αρχικοποίησε την OLED μονάδα απεικόνισης με τη μέθοδο begin() ως εξής:

if(!display.begin(SSD1306_SWITCHCAPVCC, 0x3C)){
      Serial.println(“SSD1306 allocation failed”);
      for(;;);
}

Με την ακόλουθη γραμμή κώδικα τυπώνουμε ένα μήνυμα στο Serial Monitor στην περίπτωση που δεν είναι εφικτή η σύνδεση με τη μονάδα απεικόνισης:

Serial.println(“SSD1306 allocation failed”);

Στην περίπτωση που χρησιμοποιείς ένα διαφορετικό OLED, ίσως χρειαστεί να αλλάξεις την διεύθυνση του OLED. Σε τούτη την περίπτωση η διεύθυνση είναι 0x3C σαν τιμή της τελευταίας παραμέτρου στη γραμμή κώδικα:

if(!display.begin(SSD1306_SWITCHCAPVCC, 0x3C)){

Αν αυτή η διεύθυνση δημιουργεί πρόβλημα, μπορείς να ανεβάσεις το sketch που θα βρεις κάνοντας κλίκ εδώ, για να βρεις την διεύθυνση της δικιά σου OLED μονάδας απεικόνισης. Μετά την αρχικοποίηση του OLED πρόσθεσε καθυστέρηση δυο δευτερολέπτων

delay(2000);

Καθαρισμός οθόνης, ορισμός μεγέθους γραμματοσειράς και προβολή κειμένου.

Μετά την αρχικοποίηση της μονάδας απεικόνισης καθάρισε το display buffer με τη μέθοδο:

display.clearDisplay();

πριν εμφανίσεις κείμενο, θα πρέπει να ορίσεις το μέγεθος γραμματοσειράς και το χρώμα της. Θέσε το μέγεθος της γραμματοσειράς με την μέθοδο:

display.setTextSize(1);

Θέσε το χρώμα της γραμματοσειράς με την μέθοδο: (άσπρη γραμματοσειρά σε μαύρο φόντο):

display.setTextColor(WHITE);

Όρισε την θέση που θα αρχίσει το κείμενο να τυπώνεται με τη μέθοδο: (εδώ το κείμενο αρχίζει από τις συντεταγμένες (0, 10))

display.setCursor(0, 10);

Τέλος θα στείλεις το κείμενο στο OLED χρησιμοποιώντας την μέθοδο:

display.println(“Hello, world”);

Τώρα θα πρέπει να καλέσεις την μέθοδο display() για να εμφανίσεις πραγματικά το κείμενο στην OLED μονάδα απεικόνισης

display.display();

Ολισθαίνοντας κείμενο

Η βιβλιοθήκη της Adafruit για την μονάδα απεικόνισης OLED περικλείει χρήσιμες μεθόδους για την εύκολη ολίσθηση κειμένου:

startscrollright(0x00, 0x0F); ολίσθηση κειμένου από αριστερά προς δεξιά.
startscrollleft(0x00, 0x0F); ολίσθηση κειμένου από δεξιά προς αριστερά.
stopscroll(); σταμάτημα της ολίσθησης κειμένου.

Το ακόλουθο sketch υλοποιεί αυτές τις μεθόδους.

#include <Wire.h>
#include <Adafruit_GFX.h>
#include <Adafruit_SSD1306.h>
#define SCREEN_WIDTH 128 // OLED display width, in pixels
#define SCREEN_HEIGHT 64 // OLED display height, in pixels
//Declaration for an SSD1306 display connected to I2C (SDA, SCL pins)
Adafruit_SSD1306 display(SCREEN_WIDTH, SCREEN_HEIGHT, &Wire, -1);
void setup() {
  Serial.begin(115200);
  if(!display.begin(SSD1306_SWITCHCAPVCC, 0x3C)){//Address 0x3C 
    Serial.println(F("SSD1306 allocation failed"));
    for(;;);
  }
  delay(2000);
  display.clearDisplay();
  display.setTextSize(1);
  display.setTextColor(WHITE);
  display.setCursor(0, 0);
  display.println("Scrolling Hello");
  display.display();
}
oid loop() {
  // Scroll in various directions, pausing in-between:
  display.startscrollright(0x00, 0x0F);
  delay(2000);
  display.stopscroll();
  delay(1000);
  display.startscrollleft(0x00, 0x0F);
  delay(2000);
  display.stopscroll();
  delay(1000);
}

Δημιουργία σχημάτων στην μονάδα απεικόνισης OLED

Η βιβλιοθήκη της Adafruit για τη μονάδα απικόνισης OLED παρέχει χρήσιμες μεθόδους, για την αποτύπωση πίξελ, γραμμών και σχημάτων. Παρακάτω θα σας δείξω περισσότερα γι’ αυτές τις μεθόδους.

Αποτύπωση πίξελ
Για την αποτύπωση ενός πίξελ στη μονάδα απεικόνισης OLED, χρησιμοποίησε την μέθοδο drawPixel(x, y, color), η οποία δέχεται τις παραμέτρους, τις x και y συντεταγμένες που θα εμφανιστεί το πίξελ και το χρώμα. Για παράδειγμα:

display.drawPixel(64, 32, WHITE);

Σχεδιασμός γραμμής
Χρησιμοποίησε τη μέθοδο drawLine(x1, y1, x2, y2, color) για το σχεδιασμό μιας γραμμής. Οι συντεταγμένες (x1, y1) ορίζουν την αρχή της γραμμής και οι (x2, y2) ορίζουν το τέλος. Για παράδειγμα:

display.drawLine(0, 0, 127, 20, WHITE);

Σχεδιασμός ορθογωνίου
Η μέθοδος drawRect(x, y, width, height, color) παρέχει ένα εύκολο τρόπο για τον σχεδιασμό ενός ορθογωνίου. Οι συντεταγμένες (x, y) ορίζουν την πάνω αριστερή γωνία του ορθογωνίου. Μετά χρειάζεται να ορίσεις το πλάτος, το ύψος και το χρώμα. Για παράδειγμα:

display.drawRect(10, 10, 50, 30, WHITE);

Μπορείς να χρησιμοποιήσεις τη μέθοδο fillRect(x, y, width, height, color) για να σχεδιάσεις ένα ορθογώνιο γεμάτο από χρώμα. Αυτή η μέθοδος δέχεται τα ίδια ορίσματα όπως ή drawRect().

Η βιβλιοθήκη επίσης παρέχει μεθόδους για το σχεδιασμό ορθογωνίων με στρογγυλοποιημένες γωνίες και συγκεκριμένα τις drawRoundRect και fillRoundRect(). Αυτές οι μέθοδοι δέχονται τα ίδια ορίσματα όπως οι προηγούμενες μέθοδες, αλλά επιπλέον και τη ακτίνα των γωνιών του ορθογωνίου. Για παράδειγμα:

display.drawRoundRect(10, 10, 30, 50, 2, WHITE);

Ενώ ένα ορθογώνιο με στρογγυλοποιημένες γωνίες γεμάτο χρώμα:

display.fillRoundRect(10, 10, 30, 50, 2, WHITE);

Σχεδιασμός κύκλου
Για να σχεδιάσεις ένα κύκλο χρησιμοποίησε τη μέθοδο drawCircle(x, y, radius, color). Οι συντεταγμένες (x, y) ορίζουν το κέντρο του κύκλου. Θα πρέπει να περάσεις την ακτίνα σαν παράμετρο. Για παράδειγμα:

display.drawCircle(64, 32, 10, WHITE);

Με τον ίδιο τρόπο, για να γεμίσεις τον κύκλο με χρώμα, χρησιμοποίησε τη μέθοδο: fillCircle() με τις ίδιες παραμέτρους:

display.fillCircle(64, 32, 10, WHITE);

Σχεδιασμός τριγώνου
Χρησιμοποίησε τη μέθοδο drawTriangle(x1, y1, x2, y2, x3, y3, color) για να σχεδιάσεις ένα τρίγωνο. Αυτή η μέθοδος δέχεται ως παραμέτρους τις συντεταγμένες της κάθε γωνίας και το χρώμα. Για παράδειγμα:

display.drawTriagle(10, 10, 55, 20, 5, 40, WHITE);

Χρησιμοποίησε τη μέθοδο fillTriangle() για να σχεδιάσεις ένα τρίγωνο γεμάτο χρώμα. Για παράδειγμα:

display.fillTriagle(10, 10, 55, 20, 5, 40, WHITE);

Αντιστροφή
Η βιβλιοθήκη παρέχει μια επιπρόσθετη μέθοδο που μπορείς να τη χρησιμοποιήσεις σε σχήματα ή κείμενο, την invertDisplay(). Πέρασε ως παράμετρο true για να αντιστρέψεις τα χρώματα της οθόνης ή false για να γυρίσεις πίσω στα αρχικά χρώματα. Εάν καλέσεις την επόμενη μέθοδο μετά που έχεις σχεδιάσει ένα τρίγωνο:

display.invertDisplay(true);

θα πάρεις μια αντιστροφή χρωμάτων, όπως στην ακόλουθη εικόνα:

Κώδικας για τη δημιουργία σχημάτων

Ανέβασε το επόμενο sketch για να υλοποιήσεις τον κώδικα των προηγούμενων παραδειγμάτων με τη σειρά όπως αναφέρθηκαν.

#include <Wire.h>
#include <Adafruit_GFX.h>
#include <Adafruit_SSD1306.h>

#define SCREEN_WIDTH 128 // OLED display width, in pixels
#define SCREEN_HEIGHT 64 // OLED display height, in pixels

//Declaration for an SSD1306 display connected to I2C (SDA, SCL pins)
Adafruit_SSD1306 display(SCREEN_WIDTH, SCREEN_HEIGHT, &Wire, -1);
void setup() {
  Serial.begin(115200);
  if(!display.begin(SSD1306_SWITCHCAPVCC, 0x3C)){//Address 0x3C 
    Serial.println(F("SSD1306 allocation failed"));
    for(;;);
  }
  delay(2000);
  //Clear the buffer
  display.clearDisplay();
  //Draw a single pixel in white
  display.drawPixel(64, 32, WHITE);
  display.display();
  delay(3000);
  //Draw line
  display.clearDisplay();
  display.drawLine(0, 0, 127, 20, WHITE);
  display.display();
  delay(3000);
  //Draw rectangle
  display.clearDisplay();
  display.drawRect(30, 10, 50, 30, WHITE);
  display.display();
  delay(3000);
  //Fill rectangle
  //display.clearDisplay();
  display.fillRect(30, 10, 50, 30, WHITE);
  display.display();
  delay(3000);
  //Draw round rectangle
  display.clearDisplay();
  display.drawRoundRect(10, 10, 30, 50, 2, WHITE);
  display.display();
  delay(3000);
  //Fill round rectangle
  //display.clearDisplay();
  display.fillRoundRect(10, 10, 30, 50, 2, WHITE);
  display.display();
  delay(3000);
  //Draw circle
  display.clearDisplay();
  display.drawCircle(64, 32, 10,WHITE);
  display.display();
  delay(3000);
  //Fill Circle
  //display.clearDisplay();
  display.fillCircle(64, 32, 10, WHITE);
  display.display();
  delay(3000);
  //Draw triangle
  display.clearDisplay();
  display.drawTriangle(10, 10, 55, 20, 5, 40, WHITE);
  display.display();
  delay(3000);
  // Fill triangle 
  //display.clearDisplay();
  display.fillTriangle(10, 10, 55, 20, 5, 40, WHITE);
  display.display();
  delay(3000);
  //Invert and restore display, pausing in-between
  display.invertDisplay(true);
  delay(3000);
  display.invertDisplay(false);
  delay(3000);
}
void loop() {
}