In acest articol vom incerca sa folosim un display OLED 128x64 pixeli impreuna cu placa de dezvoltare Arduino Uno.
Pretul acestui display este de 35 de lei si poate fi achizitionat de aici.
Acest modul se alimenteaza cu o tensiune de 5V iar comunicarea cu Arduino se face cu ajutorul protocolului SPI astfel:
| Arduino | OLED 128x64 |
| D9 | D1/MOSI |
| D10 | D0/CLK |
| D11 | DC |
| D12 | CS |
| D13 | RESET |
Acest modul este cel din poza de mai jos:
Pentru a folosi acest modul va trebui sa folosim 3 librarii. Aceste sunt urmatoarele:
-Adafruit SSD1306 care se poate descarca de aici;
-Adafruit GFX Library care se poate descarca de aici;
-Adafruit BusIO care se poate descarca de aici.
In urmatorul sketch vom incerca sa afisam ceva pe display:
#include <SPI.h>
#include <Wire.h>
#include <Adafruit_GFX.h>
#include <Adafruit_SSD1306.h>
#define SCREEN_WIDTH 128 // definim lungimea displayului in pixeli
#define SCREEN_HEIGHT 64 // definim inaltimea displayului in pixeli
//definim pinii pentru conexiunea display-arduino
#define OLED_MOSI 9
#define OLED_CLK 10
#define OLED_DC 11
#define OLED_CS 12
#define OLED_RESET 13
//creem metoda de apelare a functiilor din libraria adafruit ssd1306
Adafruit_SSD1306 display(SCREEN_WIDTH, SCREEN_HEIGHT,OLED_MOSI, OLED_CLK, OLED_DC, OLED_RESET, OLED_CS);
void setup() {
display.begin(SSD1306_SWITCHCAPVCC); //initializam displayul
display.clearDisplay(); //stergem displayul
display.setTextSize(2); //setam marimea textului la valoarea 2
display.setTextColor(SSD1306_WHITE); //setam culoarea textului la alb
display.setCursor(0,0); //setam pozitia de unde va incepe afisarea textului
display.println(F("Testare")); //setam textul care va fi afisat pe display
display.setCursor(60, 16);
display.println(F("OLED"));
display.setCursor(10, 32);
display.println(F("128X64"));
display.setCursor(10, 48);
display.println(F("PIXELI"));
display.display(); //efectuam afisarea efectiva pe display (fara aceasta comanda displayul nu va afisa nimic!!!)
delay(3000);
}
void loop() {
display.clearDisplay();
display.setTextSize(1);
display.setTextColor(SSD1306_WHITE);
display.setCursor(0,0);
display.println(F("Vizitati siteul"));
display.setTextColor(SSD1306_BLACK, SSD1306_WHITE); //setam culoarea fontului negru si culoarea backgroundului alb
display.setCursor(0,10);
display.println(F("electronicstore.ro"));
display.display();
delay(3000);
display.invertDisplay(true); //inversam culorile afisate pe display
delay(3000);
display.invertDisplay(false); //revenim la culorile prestabilite
delay(3000);
display.clearDisplay();
//afisarea unor linii pe ecran
display.drawLine(5, 5, 122, 5, SSD1306_WHITE);
display.drawLine(5, 15, 122, 15, SSD1306_WHITE);
display.drawLine(5, 30, 100, 30, SSD1306_WHITE);
display.drawLine(5, 48, 60, 48, SSD1306_WHITE);
display.display();
delay(3000);
//afisarea unor dreptunghiuri/patrate pe display
display.clearDisplay();
display.drawRect(5, 5, 100, 5, SSD1306_WHITE);
display.drawRect(5, 15, 120, 15, SSD1306_WHITE);
display.drawRect(5, 32, 32, 32, SSD1306_WHITE);
display.drawRect(45, 32, 32, 32, SSD1306_WHITE);
display.drawRect(85, 32, 32, 32, SSD1306_WHITE);
display.display();
delay(3000);
//afisarea unor dreptunghiuri/patratedar cu culoare de fundal
display.clearDisplay();
display.fillRect(5, 10, 100, 30, SSD1306_INVERSE);
display.display();
delay(3000);
//afisarea unui cerc
display.clearDisplay();
display.drawCircle(15, 15, 10, SSD1306_WHITE);
display.drawCircle(35, 35, 15, SSD1306_WHITE);
display.drawCircle(80, 30, 25, SSD1306_WHITE);
display.display();
delay(3000);
//afisarea unui cerc cu culoare de fundal
display.clearDisplay();
display.fillCircle(10, 10, 10, SSD1306_INVERSE);
display.fillCircle(40, 40, 15, SSD1306_INVERSE);
display.fillCircle(90, 25, 20, SSD1306_INVERSE);
display.display();
delay(3000);
//afisarea unor dreptunghiuri/patrate cu margini rotunjite
display.clearDisplay();
display.drawRoundRect(10, 10, 100, 50, 5, SSD1306_WHITE);
display.drawRoundRect(20, 20, 80, 30, 5, SSD1306_WHITE);
display.drawRoundRect(25, 25, 70, 20, 5, SSD1306_WHITE);
display.display();
delay(3000);
//afisarea unor dreptunghiuri/patrate cu margini rotunjite si cu culoare de fundal
display.clearDisplay();
display.fillRoundRect(5, 5, 60, 20, 5, SSD1306_INVERSE);
display.fillRoundRect(80, 25, 30, 30, 5, SSD1306_INVERSE);
display.display();
delay(3000);
//desenarea unor triunghiuri
display.clearDisplay();
display.drawTriangle(50, 10, 10, 50, 80, 50, SSD1306_WHITE);
display.drawTriangle(80, 5, 70, 20, 110, 20, SSD1306_WHITE);
display.display();
delay(3000);
//desenarea unor triunghiuri cu culoare de fundal
display.clearDisplay();
display.fillTriangle(40, 5, 15, 35, 50, 35, SSD1306_INVERSE);
display.fillTriangle(75, 15, 65, 45, 105, 40, SSD1306_INVERSE);
display.display();
delay(3000);
//rulam un mesaj de multumire si oprim executarea programului
display.clearDisplay();
display.setTextSize(1);
display.setTextColor(SSD1306_WHITE);
display.setCursor(10,0);
display.println(F("Multumim pentru"));
display.setCursor(15,15);
display.println(F("vizualizare!"));
display.display();
delay(3000);
exit(0);
}In urmatorul sketch vom incerca sa afisam pe display si alte elemente grafice:
#include <SPI.h>
#include <Wire.h>
#include <Adafruit_GFX.h>
#include <Adafruit_SSD1306.h>
#define SCREEN_WIDTH 128
#define SCREEN_HEIGHT 64
#define OLED_MOSI 9
#define OLED_CLK 10
#define OLED_DC 11
#define OLED_CS 12
#define OLED_RESET 13
Adafruit_SSD1306 display(SCREEN_WIDTH, SCREEN_HEIGHT,OLED_MOSI, OLED_CLK, OLED_DC, OLED_RESET, OLED_CS);
#define LOGO_HEIGHT 48
#define LOGO_WIDTH 48
static const unsigned char PROGMEM logo_bmp[] =
{ 0x0, 0x0, 0x0, 0x0, 0x0, 0x0, 0x0, 0x0, 0x0, 0x0, 0x0, 0x0,
0x0, 0x0, 0x0, 0x0, 0x0, 0x0, 0x0, 0x0, 0x3, 0xc0, 0x0, 0x0,
0x0, 0x0, 0x7f, 0xfe, 0x0, 0x0, 0x0, 0x1, 0xff, 0xff, 0x80, 0x0,
0x0, 0x7, 0xff, 0xff, 0xe0, 0x0, 0x0, 0xf, 0xff, 0xff, 0xf0, 0x0,
0x0, 0x3f, 0xff, 0xff, 0xfc, 0x0, 0x0, 0x7f, 0xff, 0xff, 0xfe, 0x0,
0x0, 0xff, 0xff, 0xff, 0xff, 0x0, 0x0, 0xff, 0xff, 0xff, 0xff, 0x0,
0x1, 0xff, 0xff, 0xff, 0xff, 0x80, 0x3, 0xff, 0xff, 0xff, 0xff, 0xc0,
0x3, 0xff, 0xff, 0xff, 0xff, 0xc0, 0x7, 0xff, 0xf, 0xf0, 0xff, 0xe0,
0x7, 0xfe, 0x7, 0xe0, 0x7f, 0xe0, 0xf, 0xfe, 0x7, 0xe0, 0x7f, 0xf0,
0xf, 0xfe, 0x3, 0xe0, 0x7f, 0xf0, 0xf, 0xfe, 0x3, 0xe0, 0x7f, 0xf0,
0xf, 0xfe, 0x3, 0xe0, 0x7f, 0xf0, 0xf, 0xfe, 0x7, 0xe0, 0x7f, 0xf0,
0x1f, 0xfe, 0x7, 0xe0, 0x7f, 0xf8, 0x1f, 0xff, 0xf, 0xf0, 0xff, 0xf8,
0x1f, 0xff, 0xff, 0xff, 0xff, 0xf8, 0x1f, 0xff, 0xff, 0xff, 0xff, 0xf8,
0xf, 0xff, 0xff, 0xff, 0xff, 0xf0, 0xf, 0x9f, 0xff, 0xff, 0xf9, 0xf0,
0xf, 0x83, 0xff, 0xff, 0xc1, 0xf0, 0xf, 0x80, 0x7, 0xe0, 0x1, 0xf0,
0xf, 0x80, 0x0, 0x0, 0x1, 0xf0, 0x7, 0x80, 0x0, 0x0, 0x3, 0xe0,
0x7, 0xc0, 0x0, 0x0, 0x3, 0xe0, 0x3, 0xe0, 0x0, 0x0, 0x7, 0xc0,
0x3, 0xe0, 0x0, 0x0, 0xf, 0xc0, 0x1, 0xf0, 0x0, 0x0, 0x1f, 0x80,
0x0, 0xfc, 0x0, 0x0, 0x3f, 0x0, 0x0, 0xfe, 0x0, 0x0, 0xff, 0x0,
0x0, 0x7f, 0xc0, 0x3, 0xfe, 0x0, 0x0, 0x3f, 0xff, 0xff, 0xfc, 0x0,
0x0, 0xf, 0xff, 0xff, 0xf0, 0x0, 0x0, 0x7, 0xff, 0xff, 0xe0, 0x0,
0x0, 0x1, 0xff, 0xff, 0x80, 0x0, 0x0, 0x0, 0x7f, 0xfe, 0x0, 0x0,
0x0, 0x0, 0x3, 0xc0, 0x0, 0x0, 0x0, 0x0, 0x0, 0x0, 0x0, 0x0,
0x0, 0x0, 0x0, 0x0, 0x0, 0x0, 0x0, 0x0, 0x0, 0x0, 0x0, 0x0, };
static const unsigned char PROGMEM box_bmp[] =
{0x0, 0x0, 0x0, 0x0, 0x4, 0x0, 0x0, 0x0, 0x0, 0x0, 0x78, 0x0,
0x0, 0x0, 0x0, 0x1, 0xf0, 0x0, 0x0, 0x70, 0x0, 0x3, 0xf0, 0x0,
0x0, 0x70, 0x20, 0x7, 0xe0, 0x0, 0x0, 0x78, 0xf0, 0x7, 0xe0, 0x0,
0x0, 0x7f, 0xe0, 0xf, 0xc0, 0x6, 0x0, 0x73, 0xe0, 0xf, 0xc0, 0x6,
0x1f, 0x80, 0xe0, 0xf, 0xc0, 0xe, 0x1f, 0x0, 0x60, 0xf, 0xc0, 0xe,
0xf, 0x0, 0x20, 0x1f, 0xc0, 0x1f, 0x6, 0x0, 0x3e, 0xf, 0xe0, 0x1e,
0x2, 0x0, 0x3f, 0xf, 0xf8, 0x3e, 0x2, 0x0, 0x3e, 0xf, 0xff, 0xfe,
0x2, 0x0, 0x30, 0xf, 0xff, 0xfe, 0x7, 0x0, 0x60, 0x7, 0xff, 0xfc,
0xf, 0x80, 0x60, 0x7, 0xff, 0xf8, 0x1f, 0xc1, 0xe0, 0xf, 0xff, 0xf8,
0xc, 0x7f, 0xf0, 0xf, 0xff, 0xe0, 0x0, 0x3e, 0xf0, 0x1f, 0xff, 0xc0,
0x0, 0x3c, 0x30, 0x1f, 0xf0, 0x0, 0x0, 0x38, 0x0, 0x3f, 0xf0, 0x0,
0x0, 0x30, 0x0, 0x7f, 0xe0, 0x0, 0x0, 0x10, 0x0, 0x7f, 0xc0, 0x0,
0x0, 0x0, 0x0, 0x0, 0x0, 0x0, 0x0, 0x0, 0x0, 0x0, 0x0, 0x0,
0x0, 0x0, 0x0, 0x0, 0x0, 0x0, 0x0, 0xff, 0xff, 0xff, 0xff, 0x0,
0x1, 0xff, 0xff, 0xff, 0xff, 0x80, 0x3, 0xff, 0xff, 0xff, 0xff, 0xc0,
0x7, 0xff, 0xff, 0xff, 0xff, 0xe0, 0xf, 0xff, 0xff, 0xff, 0xff, 0xf0,
0x1f, 0xff, 0xff, 0xff, 0xff, 0xf8, 0x3f, 0xff, 0xff, 0xff, 0xff, 0xfc,
0x7f, 0x7f, 0xff, 0xff, 0xfe, 0xfe, 0x7e, 0x7f, 0xff, 0xff, 0xfe, 0x7e,
0xfc, 0x7f, 0xff, 0xff, 0xfe, 0x3e, 0x78, 0x7f, 0xff, 0xff, 0xfe, 0x1e,
0x30, 0x7f, 0xff, 0xff, 0xfe, 0x8, 0x0, 0x7f, 0xff, 0xff, 0xfe, 0x0,
0x0, 0x7f, 0xff, 0xff, 0xfe, 0x0, 0x0, 0x7f, 0xff, 0xff, 0xfe, 0x0,
0x0, 0x7f, 0xff, 0xff, 0xfe, 0x0, 0x0, 0x7f, 0xff, 0xff, 0xfe, 0x0,
0x0, 0x7f, 0xff, 0xff, 0xfe, 0x0, 0x0, 0x3f, 0xff, 0xff, 0xfc, 0x0,
0x0, 0x3f, 0xff, 0xff, 0xfc, 0x0, 0x0, 0xf, 0xff, 0xff, 0xf0, 0x0,
};
static const unsigned char PROGMEM battery_bmp[] =
{0x0, 0x0, 0xf, 0xf0, 0x0, 0x0, 0x0, 0x0, 0x1f, 0xf8, 0x0, 0x0,
0x0, 0x0, 0x3f, 0xfc, 0x0, 0x0, 0x0, 0x0, 0x3f, 0xfc, 0x0, 0x0,
0x0, 0x0, 0x3f, 0xfc, 0x0, 0x0, 0x0, 0x0, 0x3f, 0xfc, 0x0, 0x0,
0x0, 0x3, 0xff, 0xff, 0xc0, 0x0, 0x0, 0x1f, 0xff, 0xff, 0xf8, 0x0,
0x0, 0x7f, 0xff, 0xff, 0xfe, 0x0, 0x0, 0xff, 0xff, 0xff, 0xff, 0x0,
0x0, 0xff, 0xff, 0xff, 0xff, 0x0, 0x1, 0xff, 0xff, 0xff, 0xff, 0x80,
0x1, 0xf8, 0x0, 0x0, 0x1f, 0x80, 0x1, 0xf0, 0x0, 0x0, 0xf, 0x80,
0x3, 0xf0, 0x0, 0x0, 0xf, 0xc0, 0x3, 0xf1, 0xff, 0xff, 0x8f, 0xc0,
0x3, 0xf1, 0xff, 0xff, 0x8f, 0xc0, 0x3, 0xf1, 0xff, 0xff, 0x8f, 0xc0,
0x3, 0xf1, 0xff, 0xff, 0x8f, 0xc0, 0x3, 0xf1, 0xff, 0xff, 0x8f, 0xc0,
0x3, 0xf1, 0xff, 0xff, 0x8f, 0xc0, 0x3, 0xf1, 0xff, 0xff, 0x80, 0x0,
0x3, 0xf1, 0xff, 0xff, 0x80, 0x0, 0x3, 0xf1, 0xff, 0xff, 0x80, 0x0,
0x3, 0xf1, 0xff, 0xff, 0x1, 0xc0, 0x3, 0xf1, 0xff, 0xfe, 0x7, 0xc0,
0x3, 0xf1, 0xff, 0xfc, 0xf, 0xc0, 0x3, 0xf1, 0xff, 0xf8, 0x1f, 0xc0,
0x3, 0xf1, 0xff, 0xf0, 0x3f, 0x80, 0x3, 0xf1, 0xff, 0xe0, 0x7f, 0x0,
0x3, 0xf1, 0xff, 0xc0, 0xff, 0x0, 0x3, 0xf1, 0xff, 0x81, 0xfe, 0x0,
0x3, 0xf1, 0xff, 0x83, 0xfc, 0x0, 0x3, 0xf1, 0xff, 0x7, 0xff, 0xff,
0x3, 0xf1, 0xff, 0xf, 0xff, 0xff, 0x3, 0xf1, 0xff, 0xf, 0xff, 0xff,
0x3, 0xf1, 0xff, 0x1f, 0xff, 0xfe, 0x3, 0xf1, 0xff, 0x1f, 0xff, 0xfe,
0x3, 0xf1, 0xff, 0x1f, 0xff, 0xfc, 0x3, 0xf0, 0x0, 0x0, 0x7, 0xf8,
0x1, 0xf0, 0x0, 0x0, 0xf, 0xf0, 0x1, 0xf8, 0x0, 0x0, 0x1f, 0xe0,
0x1, 0xff, 0xff, 0xfc, 0x1f, 0xc0, 0x0, 0xff, 0xff, 0xfc, 0x3f, 0x80,
0x0, 0xff, 0xff, 0xfc, 0x7f, 0x0, 0x0, 0x7f, 0xff, 0xfc, 0x7e, 0x0,
0x0, 0x1f, 0xff, 0xfc, 0x7c, 0x0, 0x0, 0x3, 0xff, 0xfc, 0x70, 0x0,
};
static const unsigned char PROGMEM cloud_bmp[] =
{
0x0, 0x0, 0x0, 0x38, 0x0, 0x0, 0x0, 0x0, 0x3, 0xff, 0x80, 0x0,
0x0, 0x0, 0xf, 0xff, 0xc0, 0x0, 0x0, 0x0, 0x3f, 0xff, 0xf0, 0x0,
0x0, 0x0, 0x7f, 0xff, 0xf8, 0x0, 0x0, 0x0, 0xff, 0xff, 0xfc, 0x0,
0x0, 0x1, 0xff, 0xff, 0xfe, 0x0, 0x0, 0x1, 0xff, 0xff, 0xfe, 0x0,
0x0, 0x3, 0xff, 0xff, 0xff, 0x0, 0x0, 0x37, 0xff, 0xff, 0xff, 0x80,
0x3, 0xff, 0xff, 0xff, 0xff, 0x80, 0xf, 0xff, 0xff, 0xff, 0xff, 0x80,
0x1f, 0xff, 0xff, 0xff, 0xff, 0x80, 0x3f, 0xff, 0xff, 0xff, 0xff, 0xc0,
0x3f, 0xff, 0xff, 0xff, 0xff, 0xc0, 0x7f, 0xff, 0x80, 0x0, 0x7f, 0xc0,
0x7f, 0xff, 0x0, 0x0, 0x3f, 0xf0, 0x7f, 0xff, 0x0, 0x0, 0x3f, 0xf8,
0x7f, 0xff, 0xf, 0xfc, 0x3f, 0xfc, 0xff, 0xff, 0xf, 0xfc, 0x3f, 0xfe,
0x7f, 0xfe, 0x1f, 0xfc, 0x3f, 0xfe, 0x7f, 0xfe, 0x1f, 0xf8, 0x7f, 0xfe,
0x7f, 0xfe, 0x1f, 0xf8, 0x7f, 0xff, 0x7f, 0xfe, 0x1f, 0xf8, 0x7f, 0xfe,
0x3f, 0xfe, 0x3f, 0xf8, 0xff, 0xfe, 0x3f, 0xfc, 0x3f, 0xf0, 0xff, 0xfe,
0x1f, 0xfc, 0x3f, 0xf0, 0xff, 0xfc, 0xf, 0xfc, 0x3f, 0xf0, 0x3, 0xfc,
0x3, 0xfc, 0x3f, 0xe0, 0x1, 0xf0, 0x0, 0x38, 0x7f, 0xe0, 0x1, 0x80,
0x0, 0x0, 0x7f, 0xff, 0xe0, 0x0, 0x0, 0x0, 0x7f, 0xff, 0xc0, 0x0,
0x0, 0x0, 0x7f, 0xff, 0x80, 0x0, 0x0, 0x0, 0xff, 0xff, 0x80, 0x0,
0x0, 0x0, 0xff, 0xff, 0x0, 0x0, 0x0, 0x0, 0xff, 0xfe, 0x0, 0x0,
0x0, 0x0, 0x0, 0xfc, 0x0, 0x0, 0x0, 0x0, 0x0, 0xf8, 0x0, 0x0,
0x0, 0x0, 0x0, 0xf0, 0x0, 0x0, 0x0, 0x0, 0x0, 0xf0, 0x0, 0x0,
0x0, 0x0, 0x1, 0xe0, 0x0, 0x0, 0x0, 0x0, 0x1, 0xc0, 0x0, 0x0,
0x0, 0x0, 0x1, 0x80, 0x0, 0x0, 0x0, 0x0, 0x1, 0x0, 0x0, 0x0,
0x0, 0x0, 0x2, 0x0, 0x0, 0x0, 0x0, 0x0, 0x2, 0x0, 0x0, 0x0,
0x0, 0x0, 0x0, 0x0, 0x0, 0x0, 0x0, 0x0, 0x0, 0x0, 0x0, 0x0,
};
void setup() {
display.begin(SSD1306_SWITCHCAPVCC);
display.clearDisplay();
display.setTextSize(2);
display.setTextColor(SSD1306_WHITE);
display.setCursor(0,0);
display.println(F("Afisare"));
display.setCursor(10, 16);
display.println(F("elemente"));
display.setCursor(20, 32);
display.println(F("grafice"));
display.display();
delay(3000);
}
void loop() {
display.clearDisplay();
display.setTextSize(1);
display.setTextColor(SSD1306_WHITE);
display.setCursor(15,15);
display.println(F("Vizitati siteul"));
display.setCursor(0,30);
display.println(F("electronicstore.ro"));
display.display();
delay(3000);
//afisare grafica
display.clearDisplay();
display.drawBitmap(10, 10, logo_bmp, LOGO_WIDTH , LOGO_HEIGHT, SSD1306_WHITE);
display.display();
delay(3000);
display.clearDisplay();
display.drawBitmap(50, 10, box_bmp, LOGO_WIDTH , LOGO_HEIGHT, SSD1306_WHITE);
display.display();
delay(3000);
display.clearDisplay();
display.drawBitmap(10, 10, battery_bmp, LOGO_WIDTH , LOGO_HEIGHT, SSD1306_WHITE);
display.drawBitmap(70, 10, cloud_bmp, LOGO_WIDTH , LOGO_HEIGHT, SSD1306_WHITE);
display.display();
delay(3000);
display.clearDisplay();
display.setTextSize(1);
display.setTextColor(SSD1306_WHITE);
display.setCursor(10,0);
display.println(F("Multumim pentru"));
display.setCursor(15,15);
display.println(F("vizualizare!"));
display.display();
delay(3000);
exit(0);
}Pentru a putea afisa imagini grafice va trebui sa gasim imaginea dorita pentru afisare. Aceasta trebuie sa nu depaseasca numarl maxim de pixeli ai afisajului folosit. Apoi aceasta impagine trebuie convertita din formatul clasic de imagine (bmp, jpg, png rtc) intr-un array pentru a putea fi afisata pe display. Conversia acestei imagini o putem realiza online pe acest site.
O filmare cu aceste sketchuri se pot vedea aici: