.. note::

    Bonjour et bienvenue dans la Communauté Facebook des passionnés de Raspberry Pi, Arduino et ESP32 de SunFounder ! Plongez plus profondément dans l'univers des Raspberry Pi, Arduino et ESP32 avec d'autres passionnés.

    **Pourquoi rejoindre ?**

    - **Support d'experts** : Résolvez les problèmes après-vente et les défis techniques avec l'aide de notre communauté et de notre équipe.
    - **Apprendre et partager** : Échangez des astuces et des tutoriels pour améliorer vos compétences.
    - **Aperçus exclusifs** : Accédez en avant-première aux annonces de nouveaux produits et aux aperçus.
    - **Réductions spéciales** : Profitez de réductions exclusives sur nos produits les plus récents.
    - **Promotions festives et cadeaux** : Participez à des cadeaux et des promotions de vacances.

    👉 Prêt à explorer et à créer avec nous ? Cliquez [|link_sf_facebook|] et rejoignez-nous aujourd'hui !

.. _1.1.5_js:

1.1.5 Afficheur 7 segments à 4 chiffres
==============================================

Introduction
------------

Ensuite, suivez-moi pour essayer de contrôler l'afficheur 7 segments à 4 chiffres.

Composants nécessaires
----------------------

Pour ce projet, nous avons besoin des composants suivants.

.. image:: img/list_4_digit.png

Il est très pratique d'acheter un kit complet, voici le lien :

.. list-table::
    :widths: 20 20 20
    :header-rows: 1

    *   - Nom
        - ARTICLES DANS CE KIT
        - LIEN
    *   - Kit Raphael
        - 337
        - |link_Raphael_kit|

Vous pouvez également les acheter séparément aux liens ci-dessous.

.. list-table::
    :widths: 30 20
    :header-rows: 1

    *   - INTRODUCTION AUX COMPOSANTS
        - LIEN D'ACHAT

    *   - :ref:`cpn_gpio_extension_board`
        - |link_gpio_board_buy|
    *   - :ref:`cpn_breadboard`
        - |link_breadboard_buy|
    *   - :ref:`cpn_wires`
        - |link_wires_buy|
    *   - :ref:`cpn_resistor`
        - |link_resistor_buy|
    *   - :ref:`cpn_4_digit`
        - \-
    *   - :ref:`cpn_74hc595`
        - |link_74hc595_buy|

.. note::
    Dans ce projet, pour l'afficheur 7 segments à 4 chiffres, nous devons utiliser le modèle BS. Si vous utilisez le modèle AS, il se peut qu'il ne s'allume pas.

Schéma de câblage
----------------------

.. image:: img/schmatic_4_digit.png


Procédures expérimentales
-------------------------

**Étape 1** : Construire le circuit.

.. image:: img/image80.png

**Étape 2** : Aller dans le dossier du code.

.. raw:: html

    <run></run>

.. code-block::

    cd ~/raphael-kit/nodejs/

**Étape 3** : Exécuter le code.

.. raw:: html

    <run></run>

.. code-block::

    sudo node 4_digit_7_segment_display.js

Après l'exécution du code, le programme effectue un comptage, augmentant de 1 par seconde, et l'afficheur 7 segments à 4 chiffres affiche le comptage.

**Code**

.. code-block:: js

    const Gpio = require('pigpio').Gpio;

    var counter = 0;

    const number = [0xc0, 0xf9, 0xa4, 0xb0, 0x99, 0x92, 0x82, 0xf8, 0x80, 0x90]; //for BS
    
    const SDI = new Gpio(24, { mode: Gpio.OUTPUT });
    const RCLK = new Gpio(23, { mode: Gpio.OUTPUT });
    const SRCLK = new Gpio(18, { mode: Gpio.OUTPUT });

    const pin1 = new Gpio(10, { mode: Gpio.OUTPUT });
    const pin2 = new Gpio(22, { mode: Gpio.OUTPUT });
    const pin3 = new Gpio(27, { mode: Gpio.OUTPUT });
    const pin4 = new Gpio(17, { mode: Gpio.OUTPUT });
    const placePin = [pin1, pin2, pin3, pin4];

    function clearDisplay() {
        hc595_shift(0xff); //for BS
    }

    function hc595_shift(dat) {
        for (let j = 0; j < 8; j++) {
            let code = 0x80 & (dat << j);
            if (code != 0) {
                code = 1;
            }
            SDI.digitalWrite(code);
            SRCLK.trigger(1,1);
        }
        RCLK.trigger(1,1);
    }

    function pickDigit(digit) {
        for(let i=0;i<4;i++){
            placePin[i].digitalWrite(0);
        }
        placePin[digit].digitalWrite(1);
    }


    let digit = -1
    setInterval(() => {
        digit = (digit +1)% 4
        clearDisplay();
        pickDigit(digit);
        switch(digit){
            case 0:
                hc595_shift(number[Math.floor(counter % 10)]);  
                break;
            case 1:
                hc595_shift(number[Math.floor(counter % 100 / 10)]);
                break;        
            case 2:
                hc595_shift(number[Math.floor(counter % 1000 / 100)]);
                break;        
            case 3:
                hc595_shift(number[Math.floor(counter % 10000 / 1000)]);
                break;
        }
    }, 5);

    setInterval(() => {
        counter++;
    }, 1000);

**Explication du Code**

.. code-block:: js

    const pin1 = new Gpio(10, {mode: Gpio.OUTPUT});
    const pin2 = new Gpio(25, {mode: Gpio.OUTPUT});
    const pin3 = new Gpio(27, {mode: Gpio.OUTPUT});
    const pin4 = new Gpio(17, {mode: Gpio.OUTPUT});
    const placePin = [pin1,pin2,pin3,pin4];    

Initialisez les broches 10, 25, 27 et 17 en mode sortie et placez-les dans le tableau ``placePin`` pour faciliter le contrôle de l'anode commune de l'afficheur 7 segments à quatre chiffres.

.. code-block:: js

    const number = [0xc0, 0xf9, 0xa4, 0xb0, 0x99, 0x92, 0x82, 0xf8, 0x80, 0x90];

Définissez un tableau constant ``number`` pour représenter le code segment hexadécimal de 0 à 9 (anode commune).

.. code-block:: js

    function clearDisplay() {
        hc595_shift(0xff); 
    }

Écrivez 0xff pour éteindre l'afficheur.

.. code-block:: js

    function pickDigit(digit) {
        for(let i=0;i<4;i++){
            placePin[i].digitalWrite(0);
        }
        placePin[digit].digitalWrite(1);
    }

Sélectionnez l'emplacement de la valeur.
Il ne doit y avoir qu'un seul emplacement activé à la fois.
L'emplacement activé sera mis en état haut.

.. code-block:: js

    let digit = -1
    setInterval(() => {
        digit = (digit +1)% 4
        clearDisplay();
        pickDigit(digit);
        switch(digit){
            case 0:
                hc595_shift(number[Math.floor(counter % 10)]);  
                break;
            case 1:
                hc595_shift(number[Math.floor(counter % 100 / 10)]);
                break;        
            case 2:
                hc595_shift(number[Math.floor(counter % 1000 / 100)]);
                break;        
            case 3:
                hc595_shift(number[Math.floor(counter % 10000 / 1000)]);
                break;
        }
    }, 5);

Ce code est utilisé pour définir le nombre affiché sur l'afficheur 7 segments à 4 chiffres.

Tout d'abord, démarrez le quatrième segment d'affichage et écrivez le chiffre des unités.
Ensuite, démarrez le troisième segment d'affichage et saisissez le chiffre des dizaines ;
après cela, démarrez respectivement les deuxième et premier segments d'affichage
et écrivez respectivement les chiffres des centaines et des milliers.
Comme la vitesse de rafraîchissement est très rapide, nous voyons un affichage complet à quatre chiffres.

.. code-block:: js

    setInterval(() => {
        counter++;
    }, 1000);

Ajoutez un au ``counter`` 
(l'afficheur numérique à quatre chiffres affiche le nombre plus un) 
chaque seconde qui passe.

Photo du Phénomène
-------------------------

.. image:: img/image81.jpeg