.. note::

    Ciao, benvenuto nella Community di appassionati di Raspberry Pi, Arduino e ESP32 di SunFounder su Facebook! Approfondisci il tuo viaggio con Raspberry Pi, Arduino ed ESP32 insieme ad altri appassionati.

    **Perché unirti a noi?**

    - **Supporto esperto**: Risolvi i problemi post-vendita e le sfide tecniche con l'aiuto della nostra community e del nostro team.
    - **Impara e Condividi**: Scambia consigli e tutorial per migliorare le tue competenze.
    - **Anteprime esclusive**: Ottieni accesso anticipato a nuovi annunci di prodotti e anteprime.
    - **Sconti speciali**: Godi di sconti esclusivi sui nostri prodotti più recenti.
    - **Promozioni e concorsi festivi**: Partecipa a concorsi e promozioni durante le festività.

    👉 Pronto a esplorare e creare con noi? Clicca su [|link_sf_facebook|] e unisciti oggi stesso!

.. _1.1.5_js:

1.1.5 Display a 7 segmenti a 4 cifre
=======================================

Introduzione
--------------------

Ora proviamo a controllare un display a 7 segmenti a 4 cifre.

Componenti necessari
---------------------------------

In questo progetto, abbiamo bisogno dei seguenti componenti.

.. image:: img/list_4_digit.png

È sicuramente conveniente acquistare un kit completo, ecco il link:

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

    *   - Nome
        - OGGETTI IN QUESTO KIT
        - LINK
    *   - Raphael Kit
        - 337
        - |link_Raphael_kit|

Puoi anche acquistarli separatamente dai link sottostanti.

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

    *   - INTRODUZIONE AI COMPONENTI
        - LINK PER L'ACQUISTO

    *   - :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::
    In questo progetto, per il display a 7 segmenti a 4 cifre dobbiamo utilizzare il modello BS; se usi il modello AS potrebbe non accendersi.

Schema elettrico
----------------------

.. image:: img/schmatic_4_digit.png


Procedure sperimentali
---------------------------

**Passo 1**: Costruisci il circuito.

.. image:: img/image80.png

**Passo 2**: Vai alla cartella del codice.

.. raw:: html

    <run></run>

.. code-block::

    cd ~/raphael-kit/nodejs/

**Passo 3**: Esegui il codice.

.. raw:: html

    <run></run>

.. code-block::

    sudo node 4_digit_7_segment_display.js

Dopo l'esecuzione del codice, il programma inizia a contare, aumentando di 1 ogni secondo, e il display a 7 segmenti a 4 cifre visualizza il conteggio.

**Codice**

.. code-block:: js

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

    var counter = 0;

    const number = [0xc0, 0xf9, 0xa4, 0xb0, 0x99, 0x92, 0x82, 0xf8, 0x80, 0x90]; //per 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); //per 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);

**Spiegazione del codice**

.. 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];    

Inizializza i pin 10, 25, 27 e 17 in modalità output e posizionali nell'array ``placePin`` per facilitare il controllo dell'anodo comune del display a 7 segmenti a quattro cifre.

.. code-block:: js

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

Definisci un array costante ``number`` per rappresentare il codice esadecimale dei segmenti da 0 a 9 (anodo comune).

.. code-block:: js

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

Scrivi 0xff per spegnere il display digitale.

.. code-block:: js

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

Seleziona la posizione del valore.
Ogni volta, solo una posizione deve essere attivata. 
La posizione attivata verrà impostata su alto.

.. 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);

Questo codice viene utilizzato per impostare il numero visualizzato sul display a 7 segmenti a 4 cifre.

Prima, attiva il quarto segmento del display e scrivi il numero delle unità.
Poi attiva il terzo segmento del display e inserisci il numero delle decine;
successivamente, attiva rispettivamente il secondo e il primo segmento del display 
e inserisci rispettivamente le centinaia e le migliaia. Poiché la velocità di aggiornamento è molto rapida, vediamo un display completo a quattro cifre.

.. code-block:: js

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

Aggiungi uno al ``counter`` 
(il display a quattro cifre visualizza il numero aumentato di uno) 
ogni secondo che passa.

Immagine del fenomeno
--------------------------

.. image:: img/image81.jpeg