WeMos OLED WiFi

WeMos OLED WiFi ti mostra come usare il display OLED con l’ESP8266 per visualizzare le informazioni provenineti dalla conessione WiFi

Sul display di tipo OLED hai già letto l’articolo in cui hai eseguito i collegamenti e provato a visualizzare sul display del testo.

Il passaggio successivo è utilizzare il display OLED per riportarti delle informazioni utili al tuo progetto e trattandosi di un progetto WiFi è utile farti riportare informazioni come:

• Stato della connessione;
• IP ottenuto dal server;
• Porta di comunicazione;

Schema dei collegamenti 

Lo schema dei collegamenti è lo stesso utilizzato negli altri articoli in cui è presente un OLED ed una WeMos:

Sketch WeMos OLED WiFi

lo sketch seguente serve a scrivere sul display OLED le informazioni iniziali e le segnalazioni relative alla connessione ed allo stato della stessa:

#define sclk D7
#define mosi D8
#define cs   D6
#define rst  D0
#define dc   D5

// Color definitions
#define BLACK           0x0000
#define BLUE            0x001F
#define RED             0xF800
#define GREEN           0x07E0
#define CYAN            0x07FF
#define MAGENTA         0xF81F
#define YELLOW          0xFFE0  
#define WHITE           0xFFFF

#include <Adafruit_GFX.h>
#include <Adafruit_SSD1331.h>
#include <SPI.h>

#include <ESP8266WiFi.h>
#include <WiFiUdp.h>
#include <OSCBundle.h>
#include <Wire.h>

char ssid[] = "Almanet 2.4G";                // your network SSID (name)
char pass[] = "xxxx_pass_xxxx";             // your network password

Adafruit_SSD1331 display = Adafruit_SSD1331(cs, dc, mosi, sclk, rst);  

WiFiUDP Udp;                                // A UDP instance to let us send and receive packets over UDP
const IPAddress outIp(192,168,2,104);        // remote IP of your computer
const unsigned int outPort = 9001;          // remote port to receive OSC
const unsigned int localPort = 8001;        // local port to listen for OSC packets (actually not used for sending)

// Waveshare SSD1331 96x64 .95inch
char OLEDbuffer[50];

void setup(void) {
  Serial.begin(9600);
  Serial.print("hello!");
  display.begin();

  Serial.println("init");
  printHome();
  // Dynamic Text
  drawtext("Connecting to",BLUE,1,5,24,0); drawtext(ssid,BLUE,1,5,33,0);
  WiFi.begin(ssid, pass);
  while (WiFi.status() != WL_CONNECTED) {
     delay(500);
     Serial.print(".");
  }
  Serial.println("");

  Serial.println("WiFi connected");
  Serial.println("IP address: ");
  Serial.println(WiFi.localIP());
  
  printHome();
  // Dynamic Text
  Serial.println("Starting UDP");
  Udp.begin(localPort);
  Serial.print("Local port: ");
  Serial.println(Udp.localPort());
  
  drawtext("Connected to",BLUE,1,5,24,0);
  sprintf(OLEDbuffer,"%s",WiFi.localIP().toString().c_str());
  drawtext(OLEDbuffer,BLUE,1,5,33,0);
  sprintf(OLEDbuffer,"Udp: %d",(int) Udp.localPort());  
  drawtext(OLEDbuffer,BLUE,1,5,42,0);
  delay(1000);
  printPage();
  delay(500);
  drawtext("OK",GREEN,2,35,23,0);
}

void loop() {
}

void printHome() {
  drawtext("ZeroBot",WHITE,2,5,0,1); delay(500);
  display.drawFastHLine(0, 20, display.width()-1, WHITE); delay(500);
  drawtext("Joystick v1.0",RED,1,18,display.height()-8,0);delay(500);
}

void printPage() {
  drawtext("ZeroBot",WHITE,1,0,0,1); delay(500);
  display.drawFastHLine(0, 10, display.width()-1, WHITE); delay(500);
  drawtext("Joystick v1.0",RED,1,18,display.height()-8,0);delay(500);
}

void drawtext(char *text, uint16_t color, uint8_t fontsize, uint8_t x, uint8_t y, boolean clean) {
  if ( clean ) display.fillScreen(BLACK);
  display.setTextSize(fontsize);
  display.setTextColor(color);
  display.setCursor(x,y);
  display.println(text);
}

le linee 01-05: definiscono i pin di collegamento WeMos OLED WiFi;

linee 07-15: definiscono i codici colore per il testo/linee ed ogni altro elemento grafico essendo un OLEd RGB;

linee 17-19: includi le librerie di gestione dell’OLED;

linee 21-24: includi le librerie per la parte WiFi e OSC che useremo nei prossimi esempi;

linee 26-27: specifica le credenziali di accesso alla rete WiFi;

linea 29: crea l’istanza display;

linea 31: crea l’istanza Udp;

linea 33: imposta l’IP del server a cui inviare i dati dalla WeMos, nel mio esempio ho usato il mio mac come server OSC;

linea 34: definisci la porta remota OSC;

linea 35: definisci la porta locale a cui il server potrà collgarsi, per comprendere meglio come funziona il protocollo OSC puoi cercare info sul Web o in altri miei articoli dedicati a questo protocollo;

linea 39: definisci un buffer in cui inserire i testi da scrivere sul display durante le conversioni;

linea 44: inizializza il display usando il metodo begin();

linea 47: richiama la funzione printHome() che, come dice il nome stesso, mostra a video la prima pagina, la home, di benvenuto;

linea 49: scrivi subito sotto alla testata la frase “Connecting to” in blu che indica la fase in cui la WeMos tenta la connessione;

linee 50-54: connettiti alla rete WiFi con le credenziali definite alle linee 26 e 27 ed attendi la risposta dal router di avvenuta connessione;

linea 61: richiama la funzione printHome() per ripulire lo schermo;

linea 64: inizializza la comunicazione Udp usando il metodo begin();

linea 68: scrivi sul display “Connected to”;

linea 69: converti l’IP assegnato dal router in modo da poterlo visualizzare sul display;

linea 70: scrivi sul display l’IP ricevuto, in questo modo potrai confrontarlo con il router

per verificare la connessione o per impostarla sul server con cui comunicare;

linee 71-72: converti e scrivi sul display anche la porta Udp;

linea 74: dopo un secondo richiama la funzione printPage() che pulisce lo schermo e imposta la pagina in modo che l’area centrale in cui scrivere le informazioni abbia più spazio;

linea 76: scrive in verde e con font maggiore rispetto alle altre scritte presenti “OK” segnalandoti la fine della procedura di connessione e la disponibilità del sistema a ricevere e trasmettere dati OSC;

linee 82-86: definisci la funzione printHome() al cui interno printi il titolo del progetto, una linea e la funzione a cui lo sketch è destinata;

linee 88-92: definisci la funzione printPage() che imposta la schermata come spiegato già per la linea 74;

linee 94-101: la funzione drawtext() è già stat descritta nel precedente articolo dedicato all’OLED SSD1331;

Il video del WeMos OLED WiFi

ho realizzato un piccolo video in cui puoi osservare come si comporta l’OLED con questo sketch: