top of page
Processeur informatique

Tutoriel écran LCD Arduino

Tutoriel : Découvrir et apprendre à utiliser le composant écran LCD Arduino de votre kit électronique

💡 C'est parti pour se lancer à la découverte d'un élément qui nous hypnotise et nous fascine tous les jours : l'écran LCD compris dans votre kit électronique.

Ce tutoriel reprend des éléments que nous avons étudié dans le tutoriel moteur, vous aurez besoin de ces connaissances pour vous lancer dans l'écran LCD. 🕯️

Vous n'avez pas encore votre kit électronique ? Nous vous en proposons un qui contient tous les nombreux éléments dont vous aurez besoin pour réaliser tous nos tutoriel.

Il est adaptés aux débutants, très qualitatif, et permet de se lancer dans l'électronique pour un prix abordable.

Tutoriel écran Lcd description bibliotheque 2 kit électronique débutant à monter Arduino tutoriel apprendre kit électronique explication meilleur composant

Pour sauter toute l'explication et avoir directement le code final c'est juste ici :

Tout ce dont vous allez

avoir besoin pour ce tutoriel :

- une carte Arduino

- Une Breadboard

- 16 fils de connexions

-L'écran LCD ( 1602 IIC )

- Le potentiomètre

Quelques connaissances préalable sur l'écran et les composants que nous allons utiliser :

Pour la réalisation de ce tutoriel il est nécessaire de s'intéresser à certaines caractéristiques des composants 🔌

Fonctionnement de l'écran LCD

LCD signifie Liquid Crystal Display (affichage à cristaux liquides). Ces écrans contiennent une grille de points de cristaux liquides, ou pixels maintenus entre des couches de verre gravées à l'aide d'électrodes transparentes. Les molécules de cristaux liquides sont normalement tordues, mais se redressent lorsqu'on leur applique de l'électricité. Cela affecte la façon dont la lumière passe à travers le point, lui permettant d'apparaître soit sombre, soit clair.

 

Une puce de contrôle HD44780 intégrée à l'écran (il y en a une sous chaque tache noire au dos) reçoit les commandes de votre Arduino. C'est elle qui allume et éteint les pixels pour former diverses lettres, chiffres et symboles. La fiche technique du contrôleur comporte un diagramme de tous les caractères stockés dans la puce.

 

Cet écran est également doté d'une LED pour le rétro-éclairage, qui est alimenté par un les pins A et K de votre écran LCD.

Si vous regardez attentivement les caractères de l'écran LCD, vous remarquerez qu'ils sont en fait constitués de nombreux petits carrés. Ces petits carrés sont appelés pixels. La taille des écrans est souvent représentée en pixels. Les pixels constituent un espace de caractère, qui est le nombre de pixels dans lequel un caractère peut exister.

pixel lettre b tutoriel écran Dessous bouton Arduino tutoriel apprendre kit électronique explication meilleur françaislcd

Voici une lettre B majuscule telle que créée en pixels. L'espacement des caractères dans cet exemple est de 6 pixels x 8 pixels.

Un écran LCD a 16 broches. Les broches sont numérotées de gauche à droite, de 1 à 16. Vous trouverez ci-dessous une liste de chacune des broches de l'écran LCD.

description tutoriel écran lcd Dessous bouton Arduino tutoriel apprendre kit électronique explication meilleur français

La Breadboard

🥖 La breadboard est un compagnon indispensable de nombreux tutoriel. Si vous voulez connaitre par coeur la breadboard voici une page d'explication.

Une carte Arduino

L'Arduino est utilisé dans tous nos tutoriel,c'est l'élément essentiel des montages électronique. Pour l’appréhender voici un tutoriel découverte.  Un autre tutoriel vous permet d'obtenir et de vous familiariser avec le logiciel Arduino IDE vous en aurez besoin ici.

La carte Arduino

Les caractéristiques précises des résistances sont développées dans ce tutoriel qui vise à découvrir la carte Arduino. Dans ce tutoriel nous aurons besoin d'utiliser le logiciel de la Arduino et de téléverser des fichiers depuis l'ordinateur vers la carte Arduino ce qui est expliqué ici.

Le potentiomètre

Voici le potentiomètre !

 

Il vous permet de varier la tension d'une pin. Ici nous nous en servirons pour régler la luminosité des caractères sur l'écran LCD.  💡

Le potentiomètre a trois pattes, une positive, une négative et une broche d'où il va transmettre la tension à l'écran LCD.

potentiomètre Dessous bouton Arduino tutoriel apprendre kit électronique explication meilleur français

Borne positive +

Borne transmettant les informations

Borne négative -

Etape 1 - Branchement de votre écran LCD et de votre potentiomètre Arduino  🛠️

Le branchage de l'écran LCD est un peu complexe, nous allons y aller pas à pas.  👣

La carte Arduino UNO

Tout d'abord branchons le pin 5v de l'Arduino à la ligne + de la breadboard et le pin GND à

la ligne -. Ainsi tous les fils branché dans la ligne - seront connectés au GND et tous les fils branchés à la ligne + seront connectés au 5v.

branchement LCD bibliotheque 2 kit électronique débutant à monter Arduino tutoriel apprendre kit électronique explication meilleur composant

Le potentiomètre

Ensuite branchons le potentiomètre, il suffit de brancher la borne + du potentiomètre à la ligne + de la breadbord et

la borne - à la ligne -. Ensuite il faut brancher la patte du milieu au pin V0 de l'écran LCD.

L'écran LCD

Voici deux tableaux qui détaillent le branchement de toute les pins de l'écran LCD  et des autres élements :

branchement écran LCD bibliotheque 2 kit électronique débutant à monter Arduino tutoriel apprendre kit électronique explication meilleur composant
branchement lcd 2 bibliotheque 2 kit électronique débutant à monter Arduino tutoriel apprendre kit électronique explication meilleur composant

Nous n'utilisons pas les pins D0,D1, D2 et D3 de l'écran LCD dans ce tutoriel, ils permettent d'afficher des caractères en 8 bits. Pour ce que nous voulons afficher dans ce tutoriel l'affichage 4 bits suffit.

Le pin V0 donne la tension qui permet d'afficher les caractère que nous pourrons donc ajuster avec le potentiomètre

Le pin A et K servent à l'alimentation de l'arrière plan, si vous souhaiter un arrière plan moins lumineux vous pouvez placer une led avant que la tension arrive dans le pin A.

Etape 2 - La bibliothèque Arduino IDE

Pour utiliser le l'écran LCD de votre kit électronique, vous allez devoir utiliser des fonctions spécifiques dans votre logiciel Arduino IDE.

Pour que votre logiciel puisse comprendre ces instructions vous allez devoir inclure les instructions "LiquidCrystal" dans le logiciel Arduino IDE.

Voici comment procéder pas à pas :

Tout d'abord ouvrez votre logiciel Arduino IDE :

bibliotheque 1 kit électronique débutant à monter Arduino tutoriel apprendre kit électronique explication meilleur composant

Puis sélectionnez "Croquis" tout en haut dans le menu

bibliotheque 1 kit électronique débutant à monter Arduino tutoriel apprendre kit électronique explication meilleur composant

Ensuite sélectionner " inclure une bibliothèque"

bibliotheque 2 kit électronique débutant à monter Arduino tutoriel apprendre kit électronique explication meilleur composant

Enfin sélectionner "LiquidCrystal" dans les différentes options de votre bibliothèque Arduino IDE :

bibliotheque 2 kit électronique débutant à monter Arduino tutoriel apprendre kit électronique explication meilleur composant

Voilà ! Maintenant votre logiciel Arduino IDE est capable de comprendre toutes les instructions que vous allez lui donner ! On va pouvoir passer à l'étape du code...

Etape 3 - Le code avant la partie setup

Vous allez désormais avoir besoin de donner des instruction à votre écran LCD via l'Arduino et L'Arduino IDE. Dans le tutoriel pour faire clignoter une LED vous apprendrez tout ce qu'il faut pour maitrisez l'IDE Arduino et savoir comment téléverser des éléments de l'ordinateur à l'Arduino.

 

Nous allons maintenant nous attaquer aux fonctions spécifiques qui vont nous permettre de maitriser l'écran LCD


 

La déclaration include

L'étape que nous venons de faire a tout simplement ajouté la ligne suivante au début de notre programme : 

#include <LiquidCrystal.h>

La prochaine fois, vous pouvez sauter l'étape 2, et juste écrire cette ligne au début du programme :

début code bibliotheque 2 kit électronique débutant à monter Arduino tutoriel apprendre kit électronique explication meilleur composant

L'instruction const int

L'instruction const int sert à déclarer les numéros de pins que nous allons utiliser pour donner les informations à l'écran LCD. Le mot "const " signifie que le pin utilisé sera constant durant tout le tutoriel. Tandis que la deuxième partie de l'instruction, "int" veut dire que ce nombre constant sera un nombre entier.

Pour cela, au dessus de la fonction setup nous allons écrire ces lignes 📝 :

La fonction LiquidCrystal, les pins de l'écran LCD

Ensuite il faut nommer votre écran, ici l'écran LCD sera nommé "lcd". Ensuite il faudra rentrer associer les pins de l'écran LCD aux différentes pins créés avec la fonction const int.

 

-Pour nommer l'écran LCD il suffit de noter la fonction LiquidCrystal et de lui rajouter un nom. Ici nous en avons mis "lcd".

-Ensuite pour lui associer les pins il faut dire que la fonction avec le nom est égale à la fonction avec les pins associés. Les pins devront être associé dans cet ordre ; LiquidCrystal ( rs, en , d4, d5, d6, d7 ).

Vous devriez obtenir ce code pour la partie avant le setup :

avant setup début code bibliotheque 2 kit électronique débutant à monter Arduino tutoriel apprendre kit électronique explication meilleur composant

Cela nous fait :

Vous devriez obtenir ce code pour la partie  setup :

Etape 4 - Programmer le void setup

La déclaration begin

La fonction begin est commande spécifique de la bibliothèque LiquidCrystal. Elle sert à renseigne la taille de l'écran LCD. Elle nécessite deux informations :

- le nombre de caractères possible en horizontale ici 16.

- le nombre de caractère possible en verticale ici 2.

setup bibliotheque 2 kit électronique débutant à monter Arduino tutoriel apprendre kit électronique explication meilleur composant

Etape 5 - Le code de la partie loop pour afficher un message 📟

La fonction setCursor

Pour dire à l'écran LCD où commencer à écrire nous utilisons la fonction setCursor.

La fonction setCursor est une fonction particulière de la bibliothèque LiquidCrystal.Pour l'utiliser il faut renseigner la position voulu pour les caractères, dans cette exemple, nous souhaitons écrire au début de la première ligne de l'écran LCD, nous écrivons donc (0,0) :

Ce qui fait :

La fonction print

Pour dire à l'écran LCD ce que nous voulons afficher nous utilisons la fonction print.

La fonction print est une fonction particulière de la bibliothèque LiquidCrystal. Ce que vous écrirez dans print va s'afficher à partir du point que vous aurez préalablement choisi avec la fonction setCursor.

Pour utiliser la fonction print il suffit d'ouvrir une parenthèse et d'y mettre entre guillemet le texte que vous souhaitez afficher sur cette ligne. Ici nous écrirons sur cette ligne "J'affiche donc".

Ce qui fait :

Ensuite nous allons répéter la fonction setCursor mais cette fois ci placer le curseur a (0,1) pourr écrire sur la deuxième ligne de l'écran. Puis écrire la suite de la phrase "je suis !" avec la fonction print.

Cela nous donne :

Etape 6 - Le code de la partie loop pour rendre le message clignotant 📟  💡⚫💡

Pour rendre votre message clignotant, iil suffit de faire une pause et d'effacer le message puis de refaire une pause. Ensuite la partie loop tournera en boucle d'elle même. Pour cela nous utiliserons deux fonctions, la fonction delay et la fonction clear.

La commande delay   ⏸️

L'instruction delay nous sert à faire un arrêt ⏸️Cet arrêt se met entre deux actions. Nous allons l'utiliser pour dire au moteur de faire une pause à la fin de son mouvement. Delay s'utilise simplement il suffit de donner la longueur de l'arrêt demander en millisecondes. Ici nous ferons une pause de 0,5 secondes donc 500 millisecondes.  ⏱️

Ce qui nous donne le code :

L'instruction clear

Pour dire à l'écran LCD d'effacer tout ce qu'il a écrit nous utilisons la fonction clear. 🧽

La fonction clear est une fonction particulière de la bibliothèque LiquidCrystal.Pour l'utiliser il suffit d'écrire la ligne lcd.clear () et tout ce qui aura été écrit précédemment sera effacé.

Ce qui fait :

Ensuit il vous suffit de remettre une pause de 500 millisecondes avec la fonction delay et votre texte se mettra à clignoter !

Ecran lcd

Voilà le code final  que vous devez obtenir :

Une fois le code réalisé vous pouvez brancher la Arduino à l'ordinateur via le câble usb et Téleverser votre code. Puis regardez si le message s'affiche bien.

Si vous voyez apparaitre des caractère étranges débranchez et rebranchez la carte Arduino.

Si rien ne s'affiche,  tournez le potentiomètre jusqu'à ce que les caractères apparaissent !

 

Sinon, vérifiez si vous n'avez pas d'erreurs dans votre code et regardez si le montage est bien réalisé et vérifiez si les câbles sont bien branchés aux bonnes bornes pins de la carte Arduino.

Si l'écran reste vide ou clignote

Si aucun message n'apparaît, il peut être nécessaire de régler le contraste. Pour ce faire, tournez le potentiomètre jusqu'à ce que vous puissiez voir les caractères à l'écran. Ajustez le contraste en tournant le potentiomètre. S'il est mal réglé, vous ne pourrez pas lire le texte clairement. Vérifiez également le potentiomètre et assurez-vous qu'il est correctement branché

. Si vous ne voyez toujours rien, vérifiez à nouveau le câblage pour vous assurer que les fils sont bien connectés. Vérifiez également vos soudures pour vous assurer que la connexion est suffisante.

Si tout s'affiche bien, c'est que le tutoriel est complétement réussi ! Toutes mes félicitations, il n'était pas facile !

🎆 🖥️ 🎆

​​

C'était le neuvième tutoriel !  🤘🤘 🖐️ Vous pouvez  dès maintenant vous servir de ce que vous avez appris pour utiliser une led multicolore !  🖥️

Voy yeux brillent des milles couleurs de l'impatience ? Calmez vous un peu et sélectionnez le bouton :

Pour aller plus loin, créer vos propres graphiques personnalisés

Si vous avez besoin de créer des personnages personnalisés, il existe quelques outils en ligne permettant de générer un graphique défini par l'utilisateur. Consultez le lien ci-dessous pour créer votre propre graphique personnalisé ou utiliser les caractères créés dans la bibliothèque de motifs.

Pour plus de simplicité, nous n'utiliserons qu'un des motifs déjà générés dans la bibliothèque. Créons un cœur vide. Tout d'abord, vous devez sélectionner votre taille de caractère. L'affichage que nous utilisons dans cet exemple est un espace de 8x5 caractères. Vous devez sélectionner "Taille des caractères : 5 par 8" dans le menu déroulant pour qu'il y ait 8 lignes et 5 colonnes de pixels.

Description tutoriel caractère spéciale écran lcd 1

Ensuite, faites défiler la page Web et cliquez sur le cœur vide figurant dans la bibliothèque de modèles. Vous verrez apparaître des valeurs représentant le caractère personnalisé en décimal, en hexagone et en binaire.

Description tutoriel caractère spéciale écran lcd 2

Nous utiliserons la représentation binaire du cœur vide. Chaque valeur entre la virgule représente une tranche de l'espace personnalisé du personnage en partant du haut de votre espace de personnage. Un pixel est effacé lorsque la valeur est 0 et assombri lorsque la valeur est 1.

Vous devrez copier les valeurs et les formater dans votre code. Comme nous utilisons un Arduino pour contrôler l'affichage des caractères de base, nous placerons les valeurs dans un tableau. Nous nommerons ce tableau emptyHeart[]. Pour faciliter la lecture et s'assurer que le pixel est désactivé, nous remplirons les bits les plus significatifs avec des 0 à gauche des valeurs, de sorte que chaque tranche de l'espace de caractères personnalisé ait une taille de 1x5. Après avoir formaté les valeurs, votre tableau devrait ressembler au code ci-dessous dans Arduino.

Félicitations ! Vous venez de créer un personnage personnalisé ! Répétez les étapes pour un maximum de 8x les caractères personnalisés si nécessaire.

Un exemple de code

Maintenant que nous avons créé un graphique personnalisé par l'utilisateur, affichons-le sur un écran avec un message. L'exemple de code ci-dessous charge trois caractères personnalisés et les affiche sur l'écran LCD avec un message. Copiez le code et collez-le dans l'IDE Arduino. Sélectionnez votre carte (dans ce cas, l'Arduino/ Genuino Uno) et le port COM. Ensuite, téléchargez le code sur votre Arduino.

Après le téléchargement, un message s'affichera avec un cœur vide et plein !

bottom of page