Introduction: Utiliser Un Écran OLED 124x68 Sur Arduino

About: Projets combinant Impression 3D et Electronique. Projects combining 3D printing and Electronics

Pour quelques euros vous pouvez ajouter un petit écran OLED monochrome à vos projets Arduino en l'achetant en ligne en Asie. J'ai détaillé les étapes de câblage, les 2 principales librairies que vous pouvez utilisez pour afficher des textes, des bitmaps et faire des animations.

Vous pouvez lire l'intégralité de ce tuto sur mon blog

http://www.projetsdiy.fr/ssd1306-mini-ecran-oled-i...

Caractéristiques techniques de l'écran utilisé pour cet article

  • Driver : SSD1306
  • 124 x 64 pixels
  • 0.96"
  • Monochrome

Step 1: Câblage De L'écran OLED

Matériel nécessaire :

- 1x Arduino Uno R3 (ou n'importe quel autre Arduino ou Clone)

- 1x Ecran OLED 0,96'' (ou plus gros) à base de micro-contrôleur SSD1306.

- 4x Câbles Dupont M/M (par exemple rouge, noir, blanc, orange)

- 1x câble USB

Grâce au bus I2C qui équipe ces écrans, le câblage se limite à 4 fils.

Step 2: Trouver Le Port I2C Sur Lequel Est Branché L'écran

Un fois branché, vous pouvez utiliser ce petit scanner développé par Nick Gammon's que j'ai porté sur Codebender pour trouver l'adresse sur lequel se trouve votre écran OLED.


Step 3: Comment Installer Des Librairies Sous L'IDE Arduino

Cette étape s'adresse aux débutants.

Vous allez devoir ajouter de nouvelles librairies à votre IDE Arduino. Après avoir récupéré le ZIP, allez dans Croquis -> Inclure une librairie -> Ajouter la bibliothèque .ZIP et choisissez le zip contenant la librairie à importer.

Vous pouvez maintenant aller dans Fichier -> Exemples pour découvrir les exemples proposés dans la librairie.

Pour utiliser une librairie dans vos projets, déclarez la en début de projet, par exemple #include

Pour faire votre premier test, vous pouvez aller à l'étape suivante, tout est possible depuis votre navigateur grâce à Codebender !

Step 4: Utiliser La Librairie Adafruit_SSD1306 Et Adafruit_GFX

C'est la librairie la plus employée car elle offre de nombreuses fonctions pour réaliser des tracés facilement (lignes, rectangles, cercles, triangles...).

Pour plus de détail sur la librairie, je vous donne rendez-vous sur mon blog http://www.projetsdiy.fr/ssd1306-mini-ecran-oled-i...

Ce Codebender va vous permettre de lancer le programme de démo


Afficher du texte
L’affichage d’un texte demande un peu plus de travail. Il est nécessaire de modifier les paramètres d’affichage paramètre par paramètre. Voici un petit exemple pour afficher Hello Word en 0,0:

display.setTextSize(1); // setTextSize applique est facteur d’échelle qui permet d’agrandir ou réduire la font

display.setTextColor(WHITE); // La couleur du texte

display.setCursor(0,0); // On va écrire en x=0, y=0

display.println(« Hello, world! »); // un println comme pour écrire sur le port série

display.setTextColor(BLACK, WHITE); // On inverse les couleurs, le fond devient noir

display.println(« Hello, world! »);

Step 5: Utiliser La Librairie Micro_OLED De Sparkfun

La librairie développée par Sparkfiun est plus légère mais offre aussi moins de fonctions avancées de dessin. Plus compacte, vous aurez aussi plus de travail. A voir en fonction de votre projet. Chaque octet compte sur Arduino !

Une fois installée la librairie est livrée avec 5 exemples de démo : Hello, Clock, Cube, Demo (ci-dessous), DrawBitmap


Step 6: Convertir Vos Bitmaps Avec LCD Assistant

LCD Assistant conseillé par Sparkfiun fonctionne encore très bien malgré son age avancé. Il n'est disponible que pour Windows

http://en.radzio.dxp.pl/bitmap_converter/

Pour obtenir un bon résultat, voici une recette qui semble bien fonctionner.

Convertissez votre image dans une taille plus petite que votre affichage. Par exemple 48x48 pour un écran 64x64 pixels. Enregistrez l'image en BMP monochrome.

Ouvre votre image dans LCD Assistant. Conservez les réglages en indiquant simplement la taille du tableau de sortie 64 x 64 dans notre cas.

Vous obtiendrez un tableau comme celui-ci ou ouvrant le fichier dans un éditeur de texte. Supprimez la première ligne du tableau [0x40, 0x00, 0x40, 0x00,] (attention de ne pas oublier la virgule).

Collez le contenu de cette variable dans votre programme puis on commence par nettoyer l'écran

oled.clear(ALL);

En imaginant que votre écran OLED soit déclaré avec l'objet oled, il suffit d'appeler la fonction drawBitmap en lui passant en paramètre la variable contenant l'image à afficher.

oled.drawBitmap(bender);

Maintenant on actualise l'écran. C'est tout

oled.display();

Step 7: Image2cpp

image2cpp est un utilitaire de conversion d'image sur internet beaucoup plus performant (et plus récent) que LCD Assistant.

http://javl.github.io/image2cpp/

Il vous permettra :

  • De choisir une taille de génération différente du fichier image
  • De mettre à l'échelle l'image avant de générer la chaine hexa
  • D'ajuster le niveau de gris de seuillage (Brightness threshold)
  • De re-centrer l'image verticalement et/ou horizontalement.
  • D'inverser les couleurs
  • D'ajouter du code Arduino

Un autre fonction très pratique et la possibilité de visualiser l'image qui sera produite par l'écran OLED en collant la chaine Hexa dans la zone "Paste byte array". Rechargez la page si vous aviez fait une conversion d'image avant.