App_Image, slider di immagini in Android

L’applicazione è uno slider di immagini. Nel componente Image vengono fatte scorrere immagini (avanti e indietro) al click su di un pulsante. In alternativa, sfruttando il TimerInterval del componente Clock viene realizzato uno scorrimento auto-matico.
Componenti e proprietà da assegnare:

Componente

Gruppo

Nome

Proprietà

Text

Width

Table

ScreenArr.

TA (3col. 3 righe)

Fill parent

Button

Basic

bPlayStop

|>

Automatic

Image

Basic

Picture=Start.png

Fill parent

Button

Basic

bAvanti

Avanti

50pixel

Button

Basic

bIndietro

Indietro

50pixel

Button

Basic

bZoomPiu

+

50pixel

Button

Basic

bZoomMeno

-

50pixel

Clock

Basic

TimeInterval 2000 (2 secondi)

Come dovrebbero presentarsi la pagina Design e l’Emulatore:

Sono necessarie 10 immagini delle quali va fatto upload, è possibile scaricare il codice sorgente.
Caricamento delle 10 immagini (da 0.png a 9.png).
L’immagine 0.png è l’immagine di avvio e sarà visibile solo all’avvio.
Utile per un titolo o un display di presentazione.
L’upload di questa può essere fatto da Picture nella finestra Properties,
le altre dal pulsante add nella finestra Media.

Per far scorrere le immagini, sono stai implementati 2 meccanismi, uno è manuale l’altro automatico.
Usando il metodo manuale occorre premere sui pulsanti < (precedente) e > (successiva).
Per il metodo automatico occorre fare click sul pulsante |> (play) che diviene || (stop).
Passando dal metodo manuale a quello automatico, il verso di scorrimento delle immagini non cambia.
Questo rendo possibile lo scorrimento automatico delle immagini in entrambe le direzioni.
Sotto i pulsanti di scorrimento 2 pulsanti + (più) e – (meno) permettono di fare lo zoom sull’immagine.

Aprire Blocks Editor

Fare click su Built-In e poi su Definition, dichiarare 4 variabili per gestire lo slider.
Assegnare loro il nome ed il valore come nelle immagini sotto.
Verso di scorrimento delle immagini nello slider.
Potrà assumere il valore 1 o -1

Il nome delle immagini è 0.png, 1.png ………. 9.png
Numero dell’immagine corrente nello slider.
Incremento dello zoom di 1/100
Valore corrente dello Zoom (default 0.70)
All’avvio il software viene inizializzato con Screen1.Initialize.
Questo blocco verrà sempre eseguito per primo all’avvio dell’applicazione.
bAvanti.Click

Fatto click su -->, verrà mostrata l’immagine numero 1.
L’azione è possibile per mezzo dell’esecuzione del codice i cui blocchi sono mostrati di seguito.
La variabile NUimma che in questo contesto sembra ridondante, serve a tenere traccia del senso di scorrimento, ma utile per mantenere il sanso di scorrimento al passaggio in automatico.
CambiaImma è la procedura che si occupa dello scorrimento delle immagini in image
bIndietro.Click
L’azione è possibile per mezzo dell’esecuzione del codice, i cui blocchi sono mostrati di seguito.
Per questi blocchi valgono le stesse considerazioni fatte per i blocchi in bAvanti.Click.
L’unica ma fondamentale considerazione è che il valore passato è -1 invece di 1.

In ogni momento è possibile passare dallo scorrimento manuale a quello automatico e viceversa.
Per farlo occorre fare click sul pulsante |> (Play) che diventa || e vicevera.
Con la somma nella procedura CambiaImma verrà sommato il numero negativo -1 e l’immagine visualizzata sarà la precedente.
 
bPlayStop.Click
L’azione è possibile per mezzo dell’esecuzione del codice i cui blocchi sono mostrati di seguito.

Il TimerInterval del componente Clock è impostato nella pagina Design a 2000 millisecondi, cioè 2 secondi.
Durante lo scorrimento viene interrogato TimerInterval, ogni 2’’ chiama la procedura CambiaImma per il cambio dell’immagine. La variabile NUimma che ha il valore di +1 o -1 ne determina il verso.
Click.Timer
Questo evento è possibile per mezzo dell’esecuzione del codice i cui blocchi sono mostrati di seguito.
E’ Acceso/Spento per mezzo del pulsante |> (Play)

Zoom delle immagini
Lo zoom è fatto agendo sulle proporzioni di image rispetto allo screen.
Due pulsanti, pressoché identici, si occupano di comandare lo zoom - e lo zoom +
La procedura Zoom si occupa di eseguirlo.
Procedura che esegue lo Zoom
Schema grafico dell’applicazione.