Lettere in sequenza

Visualizzazione progressiva di una frase, ottenuta mostrando a ogni passo una parte più lunga della stringa.

    let frase = "una frase che compare una lettera alla volta";
let ritmo = 4;    // fotogrammi per ogni lettera
let pausa = 15;   // passi di attesa con la frase completa

function setup() {
    createCanvas( 670, 120 );
    textFont( "Courier New", 24 );
}

function draw() {
    background( 255 );
    let quante = floor( frameCount / ritmo ) % (frase.length + pausa);
    text( frase.substring( 0, quante ), 20, 70 );
}

Algoritmo

a ogni fotogramma:                                                draw()
    calcolare quante lettere mostrare: una ogni ritmo fotogrammi  floor()
    dopo la frase, attendere pausa passi e ripartire da zero      %
    disegnare solo le prime lettere della frase                   substring()

Istruzioni

La funzione floor() toglie la parte decimale: il risultato aumenta di 1 ogni ritmo fotogrammi.

L’operatore % fa ripartire il conteggio da 0. I passi in più rispetto alla lunghezza della frase sono una pausa, con la frase completa.

Restituisce la parte della stringa che va dall’indice 0 all’indice quante, escluso. Se quante supera la lunghezza della stringa, restituisce la stringa intera.

Variazioni

Un cursore in fondo al testo si ottiene aggiungendo un carattere alla stringa:

Senza il secondo parametro, frase.substring( quante ) restituisce la parte che resta da quante in poi: la frase si consuma invece di comporsi.

Approfondimenti: