13 Juin 2014

Arduino leçon 20 : l'afficheur graphique couleur ILI9340 ou 41

pas FB

l'afficheur ILI9340

Il mesure 2,2 pouces de diagonale et affiche 240 x 320 pixels. On le trouve sur le net pour 4 à 5 €.

afficheur 2.2 pouces

Et voici son connecteur :


brochage ILI9340

Les différents modes d'affichage

L'affichage texte

Bien plus souple qu'avec un afficheur caractères, ce modèle nous permet de choisir l'orientation, la couleur et la taille du texte.

affichage texte

L'affichage géométrique

Cet afficheur nous permet de dessiner :
- des traits,
- des rectangles,
- des triangles,
- des cercles.
les figures peuvent être vides ou pleines.

triangles

L'affichage d'images

On peut afficher une image de 240x320 pixels stockée sur une SD-card.


La bibliothèque

Cet afficheur n'est pas spécifique à Arduino. Nous devons utiliser une bibliothèque. Nous prenons celles d'Adafruit qui est un vendeur américain d'afficheurs et de composants Arduino.
On récupère le fichier .zip sur cette page : https://github.com/adafruit/Adafruit_ILI9340 et on installe son contenu dans la bibliothèque.

Le montage

La tension d'alimentation et de fonctionnement est de 3 volts (ou 3.3).
AUCUNE TENSION DE 5 VOLTS N'EST TOLÉRÉE
Les sorties d'Arduino ne doivent jamais être reliées directement à l'afficheur mais par l'intermédiaire d'un 4050 (voir en bas leçon 18).
Le connecteur possède 9 broches
- les liaisons SPI que vous connaissez déjà
- Vcc (3volts) et GND
- LED qui est la tension nécessaire à l'éclairage de l'écran. On l'alimente en 3 volts par une résistance de 20 ohms ou en 5 volts par une résistance de 33 ohms.
L'afficheur n'envoie aucune donnée à Arduino donc le câblage de MISO est inutile.

Méga 2560 et ILI9340

1er programme : affichage de texte

Ce programme affiche un couplet de Brel avec une police de taille variable, d'orientation variable et avec une couleur différente pour chaque vers.
Copiez le dans une fenêtre Arduino.

            /*             affiche_texte.ino
            Affichage de texte par MEGA2560 sur écran ILI9340             */

      #include <SPI.h>
      #include <Adafruit_GFX.h>
      #include <Adafruit_ILI9340.h> // broches utilisées sur la MEGA2560
      #define _rst 48
      #define _dc 49
      #define _miso 50
      #define _mosi 51
      #define _sclk 52
      #define _cs 53
      Adafruit_ILI9340 tft = Adafruit_ILI9340(_cs, _dc, _mosi, _sclk, _rst, _miso);
      int i = 0 ;

     void setup()
     {
            tft.begin();
      }

     void loop()
     {
           essaiTexte();
           i = (i+1) % 4;
           delay(500);
      }
     void essaiTexte()
     {
            tft.fillScreen(ILI9340_BLACK);
            tft.setRotation(i);
            tft.setTextSize(i+1);
            tft.setCursor(0, 0);
            tft.setTextColor(ILI9340_RED);
            tft.println("Quand on n'a que l'amour");
            tft.setTextColor(0x00FF);
            tft.println("A donner en partage");
            tft.setTextColor(ILI9340_GREEN);
            tft.println("Et rien que des chansons");
            tft.setTextColor(ILI9340_WHITE);
            tft.println("Pour répondre au tambour");
            tft.setTextColor(ILI9340_CYAN);
            tft.println("Alors sans avoir rien");
            tft.setTextColor(ILI9340_BLUE);
            tft.println("Que la force d'aimer");
            tft.setTextColor(ILI9340_MAGENTA);
            tft.println("Nous avons dans les mains");
            tft.setTextColor(0xFC00);
            tft.println("Ami, le monde entier.");
      }

Adaptez le pour écrire des textes de votre choix.

Les instructions

Toutes les instructions commençant par "tft." appellent des fonctions de l'objet tft déclaré au début du programme comme une instance de la classe Adafruit_ILI9340.
Cet objet est défini dans la bibliothèque Adafruit.

Les constantes de couleur ILI9340_xxx sont aussi définies dans la bibliothèque.
On peut s'en passer comme je l'ai fait pour la dernière ligne affichée.

2ème programme : affichage graphique

On va dessiner des figures géométriques


     
      /*
                  affiche_geo
            Affichage de figures géomètriques par MEGA 2560
            sur l'afficheur ILI9340
      */
      #include <SPI.h>
      #include <Adafruit_GFX.h>
      #include <Adafruit_ILI9340.h>
     
      // broches utilisées sur la MEGA2560
      #define _rst 48
      #define _dc 49
      #define _miso 50
      #define _mosi 51
      #define _sclk 52
      #define _cs 53
      Adafruit_ILI9340 tft = Adafruit_ILI9340(_cs, _dc, _mosi, _sclk, _rst, _miso);
      void setup()
      {
            tft.begin();
            tft.fillScreen(ILI9340_BLACK);
            essaiLignes();
            essaiCercles();
            essaiRectangle();
            essaiTriangle();
      }
      void loop(void)
      {
      // on ne fait rien
      }
      void essaiCercles() {
            int x, y, r2 = 20,
            w = tft.width() + 10,
            h = tft.height() + 10;
     
            tft.drawCircle(120, 160, 80, 0xFFE0);
            tft.drawCircle(120, 160, 79, 0xFFE0);
            tft.drawCircle(120, 160, 78, 0xFFE0);
            tft.drawCircle(120, 160, 77, 0xFFE0);
            tft.drawCircle(120, 160, 76, 0xFFE0);
      }
      void essaiRectangle()
      {
            tft.drawRect(80, 120, 80, 80, ILI9340_CYAN);
            tft.drawRect(82, 122, 76, 76, ILI9340_CYAN);
            tft.drawRect(84, 124, 72, 72, ILI9340_CYAN);
            tft.drawRect(86, 126, 68, 68, ILI9340_CYAN);
      }
      void essaiTriangle()
      {
            int n, i, cx = tft.width() / 2 - 1, cy = tft.height() / 2 - 1;
            n = min(cx, cy);
     
            for(i=0; i<n; i+=20) {
                  tft.drawTriangle(
                  cx , cy - i, // peak
                  cx - i, cy + i, // bottom left
                  cx + i, cy + i, // bottom right
                  tft.Color565(255, 64, 255));
            }
      }
      void essaiLignes()
      {
            int x1, y1, x2, y2,
            w = tft.width(),
            h = tft.height();
            x1 = y1 = 0;
            y2 = h - 1;
            for(x2=0; x2<w; x2+=6) tft.drawLine(x1, y1, x2, y2, ILI9340_CYAN);
                  x2 = w - 1;
            for(y2=0; y2<h; y2+=6)
                  tft.drawLine(x1, y1, x2, y2, ILI9340_GREEN);
      }

Les instructions

tft.drawcercle() reçoit 4 paramètres :
- l'abscisse du centre
- l'ordonnée du centre
- le rayon
- la couleur.

Les coordonnées se calculent en pixels à partir de l'angle en haut à gauche.
Système de coordonnées pour positions paysage ou portrait.

cordonnées en paysage       coordonnées en portrait

Essayez de comprendre le rôle de chaque paramètre passé aux autres fonctons.

Modifiez le programme pour obtenir des dessins de votre choix.

L'affichage d'images

On peut afficher une image stockée sur une SD-card.
Personnellement, je n'ai jamais eu de bons résultats avec le lecteur de SD-card du verso de l'afficheur.
J'utilise maintenant un lecteur séparé (ça ne coûte pas plus de 2€).
Vous pouvez prendre l'exemple fourni avec la bibliothèque Adafruit "spitftbitmap.ino".
Recopiez le fichier woof.ino sur votre sd-card.
A partir de ce modèle, créez votre propre programme pour faire défiler des images de votre choix. Elles doivent être au format bmp et mesurer 160x240 pixels.

Nano et Woof

Sur ce montage, on voit en haut un Aduino Nano. Juste contre l'afficheur, le lecteur de SD-card est debout. On n'en voit que la tranche. Au-dessous, le 4050. En bas à droite, l'alimentation qui fournit le 3.3 volts.







haut de la page
flèche gauche Page Précédente : affichage graphique           Page Suivante : SD-cards flèche droite

Valid XHTML 1.0 Transitional