CAPTEURS/ACTIONNEURS

ESP32 C3 Super Mini - Affichage OLED 128x32

Créez des affichages personnalisés et visualisez des données avec l'affichage OLED 128x32 ! L'écran compact SSD1306 OLED offre des visuels haute contraste parfaits pour afficher les lectures des capteurs, les informations d'état et les graphiques. Ce tutoriel convivial pour les débutants vous montre comment connecter un affichage OLED 128x32 à votre ESP32 C3 Super Mini et le programmer pour afficher du texte, des nombres, des formes et des images personnalisées en utilisant la communication I2C.

Ce que vous apprendrez :

Qu'est-ce que l'affichage OLED 128x32 et comment il fonctionne
Comment câbler l'affichage OLED aux broches I2C de l'ESP32 C3 Super Mini
Comment installer et utiliser la bibliothèque SSD1306 OLED
Comment afficher du texte, des nombres et des données de capteurs à l'écran
Comment centrer le texte horizontalement et verticalement
Comment dessiner des formes et des graphiques en utilisant l'ESP32 C3 Super Mini
Comment afficher des images et des bitmaps personnalisés
Comment dépanner les problèmes courants d'affichage OLED

Applications Réelles :

Affichages de capteurs montrant les lectures de température, d'humidité et de distance
Indicateurs d'état affichant l'état du système et la connexion WiFi
Enregistreurs de données montrant les mises à jour en direct des capteurs
Systèmes de menu fournissant des interfaces utilisateur interactives
Stations météo affichant les prévisions et les mesures
Horloges numériques et minuteurs de compte à rebours

Affichage OLED 128x32 ESP32 C3 Super Mini

Technologie d'Affichage :

Les affichages OLED (Diode Électroluminescente Organique) produisent leur propre lumière, éliminant le besoin d'un rétroéclairage. Chaque pixel émet sa propre lumière indépendamment, fournissant des noirs parfaits, des rapports de contraste élevés et des angles de vision larges par rapport aux affichages LCD traditionnels.

Matériel Requis

1	×	ESP32 C3 Super Mini
1	×	Câble Micro USB
1	×	Affichage OLED I2C SSD1306 128x32
1	×	Fils Jumper

Ou vous pouvez acheter les kits suivants:

Kit de Capteurs DIYables (18 capteurs/écrans)

Divulgation : Certains des liens fournis dans cette section sont des liens affiliés Amazon. Nous pouvons recevoir une commission pour tout achat effectué via ces liens, sans coût supplémentaire pour vous. Nous vous remercions de votre soutien.

À Propos de l'Affichage OLED 128x32

L'OLED 128x32 est un module d'affichage monochrome compact utilisant la technologie OLED auto-illuminée avec la puce de pilote SSD1306.

Caractéristiques Clés :

Résolution : 128 pixels de large × 32 pixels de haut (4 096 pixels totaux)
Taille d'écran : Typiquement 0.91 pouces diagonal
Technologie : Diode Électroluminescente Organique (pixels auto-éclairés)
Communication : Interface I2C (connexion 2 fils)
Puce de pilote : SSD1306
Couleur : Monochrome (pixels blancs ou bleus sur fond noir)
Tension : Alimentation 3.3V - 5V
Consommation de courant : 10-20mA (dépend des pixels allumés)
Contraste : Noirs parfaits (pixels s'éteignent complètement)
Angle de vision : ~170 degrés
Temps de réponse : <1ms

Pourquoi les Débutants l'Aiment :

Câblage I2C simple (seulement 4 connexions)
Aucun rétroéclairage nécessaire (auto-illuminé)
Le contraste élevé rend le texte très lisible
Grand support de bibliothèque Arduino
Faible consommation d'énergie
La taille compacte s'adapte aux petits projets

Comparaison OLED vs LCD :

Caractéristique	OLED	LCD
Rétroéclairage	Aucun (auto-illuminé)	Requis
Contraste	Parfait (infini)	Limité
Niveau de Noir	Noir vrai	Gris/éclairé
Angle de Vision	~170°	~120°
Utilisation d'Énergie	Faible (zones noires)	Constant

Brochage de l'Affichage OLED

Le module d'affichage OLED 128x32 a généralement quatre broches pour l'alimentation et la communication I2C.

VCC : Broche d'alimentation électrique (3.3V ou 5V)
GND : Broche de terre (référence 0V)
SCL : Broche d'horloge série I2C (connecte à la broche 12 de l'ESP32 C3 Super Mini)
SDA : Broche de données série I2C (connecte à la broche 11 de l'ESP32 C3 Super Mini)

Communication I2C :

Utilise seulement 2 fils (SCL + SDA) pour le transfert de données
Adresse I2C par défaut : 0x3C (certains modules utilisent 0x3D)
Résistances de pull-up intégrées (généralement incluses sur le module)
Plusieurs appareils peuvent partager le même bus I2C

※ Note:

Les connexions de broches sur les modules OLED peuvent varier selon le fabricant - vérifiez toujours les étiquettes sur votre module spécifique
Ce tutoriel utilise les affichages OLED SSD1306 I2C (testés avec les modules DIYables)
L'ordre des broches varie : certains modules ont GND-VCC-SCL-SDA, d'autres ont VCC-GND-SCL-SDA

Schéma de Câblage

Connectez l'affichage OLED 128x32 à votre ESP32 C3 Super Mini en suivant les connexions I2C ci-dessous.

Cette image a été créée avec Fritzing. Cliquez pour agrandir l'image.

Tableau de Connexion :

Module OLED	ESP32 C3 Super Mini
VCC	3.3V
GND	GND
SDA	SDA (broche 11)
SCL	SCL (broche 12)

Conseils de Câblage :

Vérifiez à nouveau les étiquettes de broches sur votre module OLED spécifique avant de connecter
Assurez-vous que SDA se connecte à la broche 11 et SCL à la broche 12 sur l'ESP32 C3 Super Mini
Utilisez des fils jumper courts pour minimiser le bruit des signaux
L'alimentation USB de l'ESP32 C3 Super Mini est suffisante (l'OLED consomme seulement 10-20mA)

Programmation de l'ESP32 C3 Super Mini avec Affichage OLED

Installer la Bibliothèque SSD1306 OLED

Cliquez sur l'icône Bibliothèques sur le côté gauche de l'Arduino IDE
Recherchez SSD1306
Trouvez la bibliothèque Adafruit SSD1306 par Adafruit
Cliquez sur Installer pour ajouter la bibliothèque

Quand on vous demande d'installer les dépendances, cliquez sur Installer Tous pour ajouter les bibliothèques requises (y compris Adafruit GFX)

Bibliothèque du capteur Adafruit GFX ESP32 C3 Super Mini

Étapes de Programmation OLED Basique

Incluez les Bibliothèques Requises :

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

Définissez les Dimensions de l'Affichage :

#define OLED_WIDTH 128 // Largeur de l'affichage OLED en pixels #define OLED_HEIGHT 32 // Hauteur de l'affichage OLED en pixels

Créez un Objet d'Affichage :

// Créez un objet d'affichage SSD1306 pour la communication I2C Adafruit_SSD1306 oled(OLED_WIDTH, OLED_HEIGHT, &Wire, -1);

Initialisez l'Affichage dans setup() :

// Initialisez l'OLED à l'adresse I2C 0x3C if (!oled.begin(SSD1306_SWITCHCAPVCC, 0x3C)) { Serial.println(F("L'allocation SSD1306 a échoué")); while (true); // Arrêtez si l'initialisation de l'affichage échoue }

Contenu d'Affichage :

Utilisez les fonctions de dessin pour ajouter du texte, des formes et des images
Appelez oled.display() pour afficher votre contenu à l'écran

Code ESP32 C3 Super Mini - Afficher du Texte sur l'OLED

Fonctions Essentielles de Texte OLED :

oled.clearDisplay() – Efface tous les pixels à l'écran
oled.setTextSize(n) – Définit la taille du texte (1-8, où 1 est le plus petit)
oled.setCursor(x, y) – Définit la position de départ pour le texte
oled.setTextColor(WHITE) – Définit la couleur du texte en blanc
oled.setTextColor(BLACK, WHITE) – Définit la couleur du texte en noir avec fond blanc
oled.print("text") – Imprime le texte sans nouvelle ligne
oled.println("text") – Imprime le texte avec nouvelle ligne
oled.println(number) – Imprime la valeur numérique
oled.println(number, HEX) – Imprime le nombre au format hexadécimal
oled.display() – Met à jour l'écran pour afficher tous les changements

Fonctions de Défilement :

oled.startscrollright(start, stop) – Défile le texte de gauche à droite
oled.startscrollleft(start, stop) – Défile le texte de droite à gauche
oled.startscrolldiagright(start, stop) – Défile en diagonale (bas-gauche vers haut-droit)
oled.startscrolldiagleft(start, stop) – Défile en diagonale (bas-droit vers haut-gauche)
oled.stopscroll() – Arrête l'animation de défilement

Référence de Taille de Texte pour l'Affichage 128x32 :

Taille 1 : ~21 caractères par ligne, 4 lignes (6×8 pixels par caractère)
Taille 2 : ~10 caractères par ligne, 2 lignes (12×16 pixels par caractère)
Taille 3 : ~7 caractères par ligne, 1 ligne (18×24 pixels par caractère)

Centrer le Texte sur l'Affichage OLED

Pour apprendre comment centrer le texte et les nombres à la fois horizontalement et verticalement sur l'affichage OLED 128x32 en utilisant l'ESP32 C3 Super Mini, consultez ce guide détaillé :

Comment Aligner le Texte Verticalement/Horizontalement au Centre sur l'OLED

Formule de Centrage Rapide :

Centre horizontal : x = (128 - textWidth) / 2
Centre vertical : y = (32 - textHeight) / 2
Largeur du texte = caractères × 6 × textSize
Hauteur du texte = 8 × textSize

Code ESP32 C3 Super Mini - Dessiner des Formes sur l'OLED

/* * Ce code ESP32 C3 Super Mini a été développé par newbiely.fr * Ce code ESP32 C3 Super Mini est mis à disposition du public sans aucune restriction. * Pour des instructions complètes et des schémas de câblage, veuillez visiter: * https://newbiely.fr/tutorials/esp32-c3/esp32-c3-super-mini-oled-128x32-display */ #include <Wire.h> #include <Adafruit_GFX.h> #include <Adafruit_SSD1306.h> #define SCREEN_WIDTH 128 // OLED display width, in pixels #define SCREEN_HEIGHT 32 // OLED display height, in pixels // declare an SSD1306 display object connected to I2C Adafruit_SSD1306 oled(SCREEN_WIDTH, SCREEN_HEIGHT, &Wire, -1); void setup() { Serial.begin(115200); // initialize OLED display with address 0x3C for 128x32 if (!oled.begin(SSD1306_SWITCHCAPVCC, 0x3C)) { Serial.println(F("SSD1306 allocation failed")); while (true); } delay(2000); // wait for initializing oled.setCursor(0, 0); } void loop() { // draw rectangle oled.clearDisplay(); oled.drawRect(0, 15, 60, 40, WHITE); oled.display(); delay(2000); // fill rectangle oled.clearDisplay(); oled.fillRect(0, 15, 60, 40, WHITE); oled.display(); delay(2000); // draw the round rectangle oled.clearDisplay(); oled.drawRoundRect(0, 15, 60, 40, 8, WHITE); oled.display(); delay(2000); // fill the round rectangle oled.clearDisplay(); oled.fillRoundRect(0, 15, 60, 40, 8, WHITE); oled.display(); delay(2000); // draw circle oled.clearDisplay(); oled.drawCircle(20, 35, 20, WHITE); oled.display(); delay(2000); // fill circle oled.clearDisplay(); oled.fillCircle(20, 35, 20, WHITE); oled.display(); delay(2000); // draw triangle oled.clearDisplay(); oled.drawTriangle(30, 15, 0, 60, 60, 60, WHITE); oled.display(); delay(2000); // fill triangle oled.clearDisplay(); oled.fillTriangle(30, 15, 0, 60, 60, 60, WHITE); oled.display(); delay(2000); }

Fonctions Essentielles de Dessin :

oled.drawPixel(x, y, color) – Dessine un seul pixel à la position
oled.drawLine(x0, y0, x1, y1, color) – Dessine une ligne entre deux points
oled.drawRect(x, y, width, height, color) – Dessine le contour d'un rectangle
oled.fillRect(x, y, width, height, color) – Dessine un rectangle rempli
oled.drawCircle(x, y, radius, color) – Dessine le contour d'un cercle
oled.fillCircle(x, y, radius, color) – Dessine un cercle rempli
oled.drawTriangle(x0, y0, x1, y1, x2, y2, color) – Dessine le contour d'un triangle
oled.fillTriangle(x0, y0, x1, y1, x2, y2, color) – Dessine un triangle rempli
oled.drawRoundRect(x, y, width, height, radius, color) – Dessine un rectangle arrondi
oled.fillRoundRect(x, y, width, height, radius, color) – Dessine un rectangle arrondi rempli

Code ESP32 C3 Super Mini - Afficher les Images sur l'OLED

Pour afficher des images personnalisées sur l'affichage OLED 128x32, convertissez votre image en un tableau de bitmap en utilisant l'outil de conversion en ligne.

Étapes de Conversion d'Image :

Visitez le Convertisseur d'Image en Bitmap
Téléchargez votre fichier image (JPG, PNG, etc.)
Définissez la largeur et la hauteur (max 128×32 pour cet affichage)
Sélectionnez les paramètres : Monochrome, Orientation horizontale
Cliquez sur Convertir et copiez le tableau de bitmap généré

Tutoriels connexes

※ NOS MESSAGES

N'hésitez pas à partager le lien de ce tutoriel. Cependant, veuillez ne pas utiliser notre contenu sur d'autres sites web. Nous avons investi beaucoup d'efforts et de temps pour créer ce contenu, veuillez respecter notre travail !