• Web Design » Flash » Programmazione Flash

Caricare in modo dinamico immagini sul nostro sito èun buon trucco per mantenerlo più leggero, riducendonecosì i tempi di caricamento. In cosa consiste?Anzichè caricare in contemporanea alla pagina tutte leimmagini presenti in essa, le si fanno caricare ad una aduna. Ciò farà sì che i visitatoricaricheranno solamente le immagini che effettivamentevorranno vedere (ecco un esempio di caricamento dinamico). Vediamo in 4 semplicipassi come farlo.

Passo 1:

Innanzitutto, controlliamo di avere sul nostro PC tutte leimmagini di cui vogliamo servirci (magari ragruppandole inun' unica cartella "immagini") e cheabbiamo grossomodo la stessa dimensione. Nel nostro esempioandremo ad usare sue fotografie di chitarre. Apriamo Flash,cambiamo il nome del livello1 da "Layer1"a "Images". Se non è presente alcunlivello con molta probabilità avremo impostato di nonmostrare il Component Manager; semplicementeclickando Ctrl + F7 lo faremo riapparire. Aquesto punto apriamo l' interfaccia relativa aiComponenti, clickando sulla relativa freccettinaverso il basso. Tra gli elementi che appariranno selezioniamo"Loader" e trasciniamolo nello stage.

 Passo 2:

Una volta trascinato viene creato, nel punto dellapagina in cui abbiamo inserito il Loader, un piccolorettangolo bianco contenente un tratto blu, contenente lascritta: "mx.control.Loader". Dobbiamo oraridimensionarlo, facendolo grande quanto tutto lo stage; perfar ciò selezioniamolo, clickiamoci sopra con il tastodestro, e poi click su "Properties";ora siamo in grado di modificare l' estensione dell'elemento tanto in altezza quanto in larghezza, in modo dasovrapporlo all' intero stage. Fatto ciòimpostiamo le posizioni X e Yentrambe a 0, il che allineerà il Loaderallo stage.

Dobbiamo ora dare un nome al Loader, chiamandolo,con grande fantasia, "loader".Salviamo il tutto, creando un FLA da posizionare nella stessacartella nella quale si trovano le fotografie; il caricamentodinamico infatti per funzionare richiede che l' SWF e leimmagini si trovino nella stessa directory.

Passo 3:

Ora creiamo 2 bottoni, il primo dei quali caricherà,al click, la prima immagine, mentre il secondorichiamerà la seconda. Per fare tutto ciòcreiamo un nuovo livello da chiamare"Buttons" ed accertarsi che esso si trovisopra quello chiamato "Images". Disegnamonel livello "Buttons" il primobottone, rendendolo tale clickandovi sopra con il tastodestro e scegliando "Converto to abutton" (o più semplicemente selezionandoloe premendo F8). Il primo lo chiameremo"button1" e lo collocheremo a sinistra

Stessa procedura seguiremo per creare il secondo bottone, dachiamare "button2" e da posizionare sulladestra, alla stessa altezza del primo.

Passo 4:

Dobbiamo ora dire cosa fare, tramite codice, ai bottoni.Selezioniamo il primo bottone, e premendo F9 ci verràaperto il pannello "Actions" , nel qualeinseriremo il codice:

    on (release){    loader.contentPath = "guitar1.jpg";}

Il codice è piuttosto elementare, ma comunque la primariga dice a Flash di eseguire l' operazione solamentequando il bottone viene clickato; Il codice successivo inveceè quello necessario per far caricare all'applicazione una immagine e mostrarla nell' oggetto"loader"; naturalmente al posto di"guitar1.jpg" andrà messo il nomedell' immagine che si vuole caricare. A questo puntochiudiamo il pannello "Actions" eselezioniamo il secondo bottone. Come per il primo, clickiamosu F9 ed inseriamovi il codice:

    on (release){    loader.contentPath = "guitar2.jpg";}

Chiuso il pannello "Actions" , possiamotestare quanto appena creato: inizialmente vedremo solamente la pagina bianca con i due bottoni;clickando su cascuno di essi ci verrà mostrata ol' immagine guitar1.jpg o guitar2.jpg,a seconda del bottone premuto.