materiels:afficheurs:ard0_96

Différences

Ci-dessous, les différences entre deux révisions de la page.

Lien vers cette vue comparative

Les deux révisions précédentes Révision précédente
Prochaine révision
Révision précédente
materiels:afficheurs:ard0_96 [2023/08/20 18:33] – [2.1 La bibliothèque Adafruit GFX Graphics] philmateriels:afficheurs:ard0_96 [2024/04/16 22:37] (Version actuelle) phil
Ligne 2: Ligne 2:
  
 ===== 0,96" 128x64 OLED 2864 Display module - SSD1306 (I2C) ===== ===== 0,96" 128x64 OLED 2864 Display module - SSD1306 (I2C) =====
-[Mise à jour le 18/8/2023+[Mise à jour le 16/4/2024
-{{ :materiels:afficheurs:langfr-330px-arduino_logo.svg.png?nolink&150|}}+{{ :materiels:afficheurs:micpyardu.png?nolink|}}
  
   * **Ressources**   * **Ressources**
Ligne 10: Ligne 10:
  
   * **Lectures connexes**   * **Lectures connexes**
-    * <html><a href="https://webge.fr/dokuwiki/doku.php?id=materiels:afficheurs:graphique" target="_blank">Les afficheurs graphiques</a></html>+    * <html><a href="https://webge.fr/dokuwiki/doku.php?id=materiels:afficheurs:graphique" target="_blank">Les afficheurs graphiques : généralités et primitives</a></html> 
 +    * Bibliothèques - <html><a href="https://www.arduinolibraries.info/" target="_blank">Arduino Library List</a></html>
     * <html><a href="https://webge.fr/dokuwiki/doku.php?id=materiels:afficheurs:libgfx" target="_blank">Bibliothèque - Adafruit GFX Graphics Library</a></html>     * <html><a href="https://webge.fr/dokuwiki/doku.php?id=materiels:afficheurs:libgfx" target="_blank">Bibliothèque - Adafruit GFX Graphics Library</a></html>
     * <html><a href="https://webge.fr/dokuwiki/doku.php?id=materiels:afficheurs:ada1107#x64_oled_featherwing_-_sh1107_3_buttons_i2c" target="_blank">Adafruit 1,3" 128x64 OLED FeatherWing - SH1107 + 3 buttons (I2C)</a></html>     * <html><a href="https://webge.fr/dokuwiki/doku.php?id=materiels:afficheurs:ada1107#x64_oled_featherwing_-_sh1107_3_buttons_i2c" target="_blank">Adafruit 1,3" 128x64 OLED FeatherWing - SH1107 + 3 buttons (I2C)</a></html>
Ligne 24: Ligne 25:
 La technologie OLED est utilisée dans des applications commerciales telles que les écrans pour téléphones mobiles et lecteurs multimédias portables, les autoradios et les appareils photo numériques, entre autres.\\ La technologie OLED est utilisée dans des applications commerciales telles que les écrans pour téléphones mobiles et lecteurs multimédias portables, les autoradios et les appareils photo numériques, entre autres.\\
 \\  \\ 
-L'écran **Gravity OLED 2864** est un module d'affichage autolumineux à **fond bleu**. La zone d'affichage est de **0,96"** et utilise une puce <html><a href="https://cdn-shop.adafruit.com/datasheets/SSD1306.pdf" target="_blank" title="pdf">SSD1306</a></html>. Il prend en charge les communications **I2C** et les fréquences de rafraîchissement allant jusqu'à 60 Hz. Le module utilise l’interface commune Gravity I2C pour une utilisation plug and play simplifiée. <html><a href="https://www.dfrobot.com/wiki/index.php/Gravity:_I2C_OLED-2864_Display" target="_blank">DFRobot</a></html>+L'écran **Gravity OLED 2864** est un module d'affichage **monochrome** bleu sur fond noir. La zone d'affichage est de **0,96"** et utilise une puce <html><a href="https://cdn-shop.adafruit.com/datasheets/SSD1306.pdf" target="_blank" title="pdf">SSD1306</a></html>. Il prend en charge les communications **I2C** et les fréquences de rafraîchissement allant jusqu'à 60 Hz. Le module utilise l’interface commune Gravity I2C pour une utilisation plug and play simplifiée. <html><a href="https://www.dfrobot.com/wiki/index.php/Gravity:_I2C_OLED-2864_Display" target="_blank">DFRobot</a></html>
  
   * **Caractéristiques**   * **Caractéristiques**
Ligne 35: Ligne 36:
     * **Tension d'alimentation** : 3,3V ~ 5V     * **Tension d'alimentation** : 3,3V ~ 5V
     * **Consommation maximale** : 20mA @ 3v     * **Consommation maximale** : 20mA @ 3v
 +    * **Angle de vision: >160°**
     * **Dimensions** : 41.2x26.2x8mm     * **Dimensions** : 41.2x26.2x8mm
  
Ligne 43: Ligne 45:
     * **x** : position du point par rapport au côté gauche de l'écran. \\      * **x** : position du point par rapport au côté gauche de l'écran. \\ 
     * **y** : position du point par rapport au dessus de l'écran.  \\      * **y** : position du point par rapport au dessus de l'écran.  \\ 
-    * **w** : largeur (du mot Width).  \\  +    * **w** : largeur (Width).  \\  
-    * **h** : hauteur (du mot Height).  \\  +    * **h** : hauteur (Height).  \\  
-    * **c** : couleur (1=point allumé, 0=point éteint)  \\ +    * **c** : couleur (1 = point allumé, 0 = point éteint)  \\ 
  
 +{{ :materiels:capteurs:environnement:code.png?nolink|}}
 ==== 2. Programmation ==== ==== 2. Programmation ====
 Les programmes suivant sont codés : Les programmes suivant sont codés :
Ligne 57: Ligne 60:
  
 <pane id="tab-arduino"> <pane id="tab-arduino">
-=== 2.1 La bibliothèque Adafruit GFX Graphics === +<callout type="info" icon="true" title="Bibliothèque Adafruit_SSD1306">En programmation C, C++ l'utilisation des méthodes de la classe **Adafruit_GFX** sur cet afficheur peut se faire par l'intermédiaire de la bibliothèque **Adafruit_SSD1306**. Comme Adafruit_SSD1306 dérive de <html><a href="https://learn.adafruit.com/adafruit-gfx-graphics-library/overview" target="_blank" title="Site Adafruit">Adafruit GFX Graphics</a></html> il suffit de créer un objet Adafruit_SSD1306 pour accéder aux méthodes de Adafruit_GFX.
-<callout type="info" icon="true" title="OakOLED">En programmation C, C++ l'utilisation des méthodes de la classe **Adafruit_GFX** sur cet afficheur peut se faire par l'intermédiaire de la bibliothèque **OakOLED**. Comme OakOLED dérive de <html><a href="https://learn.adafruit.com/adafruit-gfx-graphics-library/overview" target="_blank" title="Site Adafruit">Adafruit GFX Graphics</a></html> il suffit de créer un objet OakOLED pour accéder aux méthodes de Adafruit_GFX.+
 \\ \\ \\ \\
-**Installer** <html><a href="https://github.com/netguy204/OakOLED" target="_blank">OakOLED</a></html> avec le gestionnaire de bibliothèques de l'IDE. Les méthodes de la classe sont décrites <html><a href="https://webge.fr/dokuwiki/doku.php?id=materiels:afficheurs:graphique" target="_blank"><b>ici</b></a></html>.+**Installer** <html><a href="https://github.com/adafruit/Adafruit_SSD1306" target="_blank">Adafruit_SSD1306</a></html> avec le gestionnaire de bibliothèques de l'IDE. Les méthodes de la classe sont décrites <html><a href="https://webge.fr/dokuwiki/doku.php?id=materiels:afficheurs:graphique" target="_blank"><b>ici</b></a></html>.
 </callout> </callout>
  
- +//Exemple : "Hello World"// 
-//Exemple : "Hello World"// \\ \\  +{{ :materiels:afficheurs:affssd1306.png?nolink&300|}}
 <code cpp helloWorld.cpp> <code cpp helloWorld.cpp>
-// Exemple d'utilisation de la bibliothèque OakOLED  +// Exemple d'utilisation de la bibliothèque Adafruit_SSD1306 
-// Description : Affiche "hello, world" +// Description : Affiche "hello, world"
  
-#include "Wire.h"          // Bibliothèques nécessaires +// Bibliothèques nécessaire à l'afficheur 
-#include "Adafruit_GFX.h" +#include <Adafruit_SSD1306.h> 
-#include "OakOLED.h"+ 
 +// Constructeurs 
 +Adafruit_SSD1306 oled = Adafruit_SSD1306(128, 32, &Wire);  // Afficheur
  
-OakOLED oled;             // Construction d'un objet OakOLED 
  
 void setup() { void setup() {
-  Serial.begin(115200); +  // Initialisation 
-  oled.begin();+  oled.begin(SSD1306_SWITCHCAPVCC, 0x3C);  // Addresse=0x3C pour 128pxx32px
  
 +  // Configuration de l'affichage
 +  oled.clearDisplay();
   oled.setTextSize(1);   oled.setTextSize(1);
-  oled.setTextColor(1); +  oled.setTextColor(WHITE);
-  oled.setCursor(0, 0);+
  
-  oled.println("Hello, World!"); +  oled.println("Hello, World!");  // préparation du texte dans le buffer 
-  oled.display();+  oled.display();                 // Transfert buffer -> afficheur
 } }
  
Ligne 92: Ligne 95:
 } }
 </code> </code>
 +</pane>
  
-=== 2.2 La bibliothèque U8glib === +<pane id="tab-micropy">
-{{  :arduino:arduino.png?50&nolink|}} +
-1. **Installer** <html><a href="https://github.com/olikraus/U8glib_Arduinotarget="_blank">Arduino U8glib</a></html> ou <html><a href="https://github.com/olikraus/U8g2_Arduino" target="_blank">U8g2</a></htmlsi vous utilisez Arduino / Genuino 101 avec le gestionnaire de bibliothèques. Ces bibliothèques graphiques prennent en charge un grand nombre d'afficheurs monochromes.+
  
-2. **Tester l'exemple "Hello World" ** \\ +=== 2.1 Présentation === 
-Arduino Examples -Example from Custom Libraries -> U8glib -HelloWorld +<callout type="infoicon="true" title="Bibliothèque SSD1306"><html>Les exemples de code de cette page ont été testés sur un afficheur <html><a href="https://www.gotronic.fr/art-module-oled-i2c-gravity-dfr0486-26805.htm" target="_blank">Gravity OLED-2864 (128x64) </a></html> de DFROBOT et un <html><a href="https://www.gotronic.fr/art-module-afficheur-oled-0-96-tf052-28511.htm" target="_blank">Module afficheur OLED 0,96'' TF052</a></html> connectés à un **ESP32** ou à un **Raspberry Pi Pico**. Ces afficheurs sont pilotés par un circuit SOLOMON SYSTECH <html><a href="https://cdn-shop.adafruit.com/datasheets/SSD1306.pdf" target="_blank">SSD1306</a></html>. Sa mise en oeuvre nécessite une bibliothèque. \\ \\ 
-{{ :arduino:exu8glib.png?nolink&200 |}}+<html><a href="https://github.com/stlehmann/micropython-ssd1306" target="_blank"><strong>Télécharger</strong></a></html> la bibliothèque SSD1306 pour MicroPython et la copier dans un fichier nommé ssd1306.py à installer dans la carte à µC. Celle bibliothèque hérite de <html><a href="https://docs.micropython.org/en/latest/pyboard/library/framebuf.html" target="_blank">framebuf</a></html>. On dispose donc des méthodes ci-dessous pour dessiner des formes sur le buffer d'impression.</callout>
  
-<callout type="info" icon="true">Dans la liste placée entre commentaires, sélectionner le constructeur **u8g** comme ci-dessous.</callout>+  * **Méthodes de la bibliothèque SSD1306**
  
-<code cpp *.cpp> +^ Prototype                                            ^ Description                                                                                                                                                                                                                                                                                                                                                                                                                 ^ 
-//U8GLIB_SSD1306_128X64 u8g(109);// HW SPI Com: CS = 10A0 (Hardware Pins are  SCK = 13 and MOSI 11+**fill**( c )                                        | Remplit l'écran en **noir (c=1)** ou en **blanc (c=0)**                                                                                                                                                                                                                                                                                                                                                                     | 
-U8GLIB_SSD1306_128X64 u8g(U8G_I2C_OPT_NONE|U8G_I2C_OPT_DEV_0); /I2C / TWI  +| **rect** ( x , y , w , h , c[, f])                   | Dessine un rectangle de largeur w et de hauteur h dans la couleur c au point (x,y)Le paramètre facultatif f peut être défini sur True pour remplir le rectangle. Sinon, seul un contour d'un pixel est dessiné.                                                                                                                                                                                                           | 
-//U8GLIB_SSD1306_128X64 u8g(U8G_I2C_OPT_DEV_0|U8G_I2C_OPT_NO_ACK|U8G_I2C_OPT_FAST);// Fast I2C / TWI+| **hline**(x,y,w,c                                  | Dessine une ligne horizontale de longueur w dans la couleur c au point (x,y)                                                                                                                                                                                                                                                                                                                                                | 
 +| **vline**(x,y,h,c)                                   | Dessine une ligne verticale de longueur h dans la couleur c au point (x,y)                                                                                                                                                                                                                                                                                                                                                  | 
 +| **line**(x1,y1,x2,y2,c)                              | Dessine une ligne dans la couleur c entre les points (x1,y1) et (x2,y2)                                                                                                                                                                                                                                                                                                                                                     | 
 +| **pixels** ( x , y[, c])                             | Affiche un pixel dans la couleur c au point (x,y). Si c n'est pas donné, obtient la valeur de couleur du pixel spécifié. Si c est donné, définit le pixel spécifié sur la couleur donnée.                                                                                                                                                                                                                                   | 
 +| **scroll**(depl.horiz, depl. vert.)                  | Déplace le contenu de l'écran de n points                                                                                                                                                                                                                                                                                                                                                                                   | 
 +| **show**()                                           | Transfert le contenu du buffer d'affichage sur l'écran                                                                                                                                                                                                                                                                                                                                                                      | 
 +| **text**("text",x,y,c)                               | Affiche le texte "text" dans la couleur c au point (x,y). En noir (c=1) ou en blanc (c=0). **La hauteur d'un caractère occupe 8px**.                                                                                                                                                                                                                                                                                            | 
 +| **poly** x , y , coordonnées , c[, f])             Étant donné une liste de coordonnées, dessine un polygone fermé arbitraire (convexe ou concaveà l'emplacement x, y donné en utilisant la couleur donnée.\\ Les coordonnées doivent être spécifiées sous forme de tableau d'entiers, par exemple .array('h', [x0, y0, x1, y1, ... xn, yn])\\ Le paramètre facultatif f peut être défini sur True pour remplir le polygone. Sinon, seul un contour d'un pixel est dessiné. 
 +| **ellipse**( x , y , xr , an , c[, f , m])  | Dessine une ellipse à l'emplacement donné. Les rayons xr et yr définissent la géométrie des valeurs égales entraînent le dessin d'un cercle. Le paramètre c définit la couleur.\\ Le paramètre optionnel f peut être défini sur True pour remplir l'ellipse sinon, seul un contour d'un pixel est dessiné.                                                                                                                | 
 + 
 +<callout type="warning" icon="true">A l'exception de scroll(), les méthodes ci-dessus "écrivent" dans le **tampon d'affichage**. Il faut vider le tampon avec **show()** pour que les caractères apparaissent à l'écran.</callout> 
 + 
 +=== 2.2 Mise en oeuvre === 
 +== 2.2.1 Configurations == 
 +<callout type="primary" icon="true">Dans les exemples de cette page, les microcontrôleurs accèdent à l'afficheur via le bus I2C. Il faut au préalable le **configurer** et créer une instance de la classe SSD1306 comme ci-dessous.</callout> 
 + 
 + // Exemple pour un **ESP32 Feather Huzzah**// 
 + 
 +<code python main.py> 
 +from machine import Pin, SoftI2C 
 +import ssd1306 
 +import time 
 +import urandom 
 + 
 +# Configuration du bus i2c sur l'ESP32 Feather Huzzah 
 +i2c = SoftI2C(scl=Pin(22), sda=Pin(23),freq=100000) 
 + 
 +# Dimension de l'afficheur oled (ssd1306) 
 +oled_width = 128 # px 
 +oled_height = 64 # px 
 + 
 +# Construction de l'objet oled 
 +oled = ssd1306.SSD1306_I2C(oled_width, oled_height, i2c)
 </code> </code>
  
-3. **Utiliser la bibliothèque U8glib dans un programme** (IDE Visual Studio Code)+ // Exemple pour un **Raspberry Pi Pico**// 
 +<code python main.py> 
 +# Modifications à apporter au code ci-dessus 
 +from machine import Pin, I2C 
 +...
  
-  * **Inclure** la bibliothèque **u8glib** au programme par F1 -> Arduino:Library Manager -> U8glib -> Include Library +# Configuration du bus i2c sur le Raspberry Pi Pico 
-<code cpp *.cpp> +# Accès au connecteur I2C0 du shield Grove 
-#include <U8glib.h> // Résultat attendu+i2c = I2C(0,sda=Pin(8), scl=Pin(9),freq=400_000) 
 +Accès au connecteur I2C1 du shield Grove 
 +#i2c = I2C(1,sda=Pin(6), scl=Pin(7),freq=400_000) 
 +...
 </code> </code>
  
-  * **Initialiser l'objet u8g** +<callout type="success" icon="true">Une fois créée, l'instance de la classe SSD1306 est utilisable pour afficher du texte et des graphiques sur l'écran.</callout> 
-Entrer le code ci-dessous+ 
-<code cpp *.cpp> +== 2.2.2 Démos == 
-U8GLIB_SSD1306_128X64 u8g(U8G_I2C_OPT_NONE|U8G_I2C_OPT_DEV_0); // I2C / TWI+  * **Démo 1** : affichage d'un texte 
 + 
 +<code python main.py> 
 +# A ajouter au code du §2.1 
 +# Division de l'afficheur en 8 lignes et 9 colonnes 
 +lin_hight = 9 
 +col_width = 8 
 +def text_write(text, lin, col): 
 +    oled.text(text,col*col_width,lin*lin_hight) 
 + 
 +oled.fill(0) # Extinction de l'afficheur 
 +text_write("MicroPython",1,2); 
 +text_write("sur",3,6) 
 +text_write("ESP32",5,5) 
 +oled.show() 
 + 
 +time.sleep(1)
 </code> </code>
  
-  * **Utiliser les méthodes de la classe U8GLIB** +  * **Démo 2** : affichage de lignes
-Une page lui sera bientôt consacrée.+
  
-**Exemple** +<code python main.py
-<code cpp Hello.cpp+A ajouter au code du §2.
-#include <U8glib.h>+# ligne horizontale : hline(pos_x1,pos_y1,pos_x2,pos_y2,c) 
 +# ligne verticale : vline(pos_x1,pos_y1,pos_x2,pos_y2,c) 
 +# c=0=>noir, c=1=>blanc
  
-U8GLIB_SSD1306_128X64 u8g(U8G_I2C_OPT_NONE|U8G_I2C_OPT_DEV_0); // I2C / TWI+oled.hline(0,0,oled_width-1,1)  
 +oled.hline(0,oled_height-1,oled_width-1,1) 
 +oled.vline(0,0,oled_height,1) 
 +oled.vline(oled_width-1,0,oled_height,1) 
 +oled.show()
  
-void setup(void){ +time.sleep(3
-u8g.drawStr0, 22, "hello World!"); +</code>
-}+
  
-void loop(void){+  * **Démo 3** : affichage aléatoire de pixels
  
-}+<code python main.py> 
 +# A ajouter au code du §2.1 
 +oled.fill(0) # Ecran noir 
 + 
 +for n in range(50): 
 +    pos_x = urandom.randint(1,oled_width) 
 +    pos_y = urandom.randint(1,oled_height) 
 +    oled.pixel(pos_x,pos_y,1) 
 +oled.show() 
 + 
 +time.sleep(3)
 </code> </code>
  
-</pane>+  * **Démo 4** : affichage d'une icône
  
-<pane id="tab-micropy">+<code python main.py> 
 +# A ajouter au code du §2.1 
 +ICON 
 +    [0,0,0,0,1,1,1,0,0,0,0], 
 +    [0,0,0,1,0,0,0,1,0,0,0], 
 +    [0,0,1,0,0,0,0,0,1,0,0], 
 +    [0,1,0,0,0,0,0,0,0,1,0], 
 +    [1,0,0,0,0,0,0,0,0,0,1], 
 +    [1,1,1,1,1,1,1,1,1,1,1], 
 +    [0,0,0,0,1,1,1,0,0,0,0], 
 +    [0,0,0,1,0,1,0,1,0,0,0], 
 +    [0,0,1,0,0,1,0,0,1,0,0], 
 +    [0,1,0,0,0,1,0,0,0,1,0], 
 +    [0,0,0,0,1,1,1,0,0,0,0], 
 +
 + 
 +# Démo 4a : affichage d'une icône au centre 
 +oled.fill(0) # Extinction de l'afficheur 
 +for y in range (11): 
 +    for x in range (11): 
 +        oled.pixel(x+64,y+32,ICON[y][x]) 
 +oled.show() 
 + 
 +time.sleep(2) 
 + 
 +# Démo 4b : affichage d'icônes au hazard 
 +for n in range(12): 
 +    pos_x = urandom.randint(1,oled_width-12) 
 +    pos_y = urandom.randint(1,oled_height-12) 
 +    for y, ligne in enumerate(ICON): 
 +        for x, c in enumerate(ligne): 
 +            oled.pixel(x+pos_x,y+pos_y,c) 
 +oled.show() 
 +     
 +time.sleep(3) 
 +</code> 
 + 
 +{{ :python:micropython:materiel:thonny.png?nolink&70|}} 
 +<callout type="tip" icon="true" title="TELECHARGER"><html><strong><a href="https://webge.fr/doc/wikis/code/micropython/MICROPYTHON_ESP32_SSD1306_DEMO.zip" target="_blank">Télécharger</a></strong></html> le projet MICROPYTHON_ESP32_SSD1306_DEMO pour Thonny et la <html><strong><a href="https://webge.fr/doc/wikis/videos/VIDEO_MICROPYTHON_ESP32_DEMO_ SSD1306.zip" target="_blank">vidéo</a></strong></html> des démos.</callout>
  
 +  * **Démo 5 ** : affichage d'une icône avec canal alpha \\ Modifier l'exemple du site <html><a href="https://wiki.mchobby.be/index.php?title=FEATHER-MICROPYTHON-OLED" target="_blank">MCHobby</a></html> en prenant en compte le code du §2.2.1 pour un ESP32 ou un Raspberry Pi Pico.
 </pane> </pane>
 </tabs> </tabs>
  
  
  • materiels/afficheurs/ard0_96.1692549226.txt.gz
  • Dernière modification : 2023/08/20 18:33
  • de phil