In Silverlight è possibile caricare in modo asincrono risorse esterne al sito come font, immagini, codice XAML, video e audio per posizionarli all'occorrenza nel sito web.
Il caricamento asincrono consente di diminuire il download iniziale del sito in modo da velocizzarne la consultazione e migliorare la visita dell'utente procedendo al caricamento mirato delle sezioni e delle immagini desiderate.
Tale funzionalità è possibile attraverso l'oggetto downloader istanziabile con la funzione CreateObject esposta direttamente dal plugin.
var downloader1 = host.CreateObject("downloader");
L'oggetto downloader dispone tre eventi: DownloadProgressChanged,Completed e DownloadFailed, con essi è possibile controllare rispettivamente lo stato di scaricamento della risorsa, il momento in cui il download è terminato ed l'eventualità in cui si verifichi un errore.
Come tutti gli altri eventi è possibile farne gestione attraverso il metodo AddEventListener:
d1_onProgressChangedTK = downloader1.AddEventListener("DownloadProgressChanged", downloader1_onProgressChanged); d1_onDownloadFailedTK = downloader1.AddEventListener("DownloadFailed", downloader1_onDownloadFailed); d1_onCompletedTK = downloader1.AddEventListener("Completed", downloader1_onCompleted);
La risorsa da scaricare può essere impostata come parametro del metodo Open specificando l'indirizzo del file corrispondente:
downloader1.Open("GET", "silverlightitalia.png?id="+Math.random());
In questo snippet viene richiesto il download di un file di tipo immagine; posponendo un parametro nell'URI del file, ad esempio id con un codice casuale generato ad ogni richiesta, si evita che tale risorsa sia recuperata dalla cache del browser; questo stratagemma è utile sia per quelle risorse che è importante siano scaricate ogni volta, sia durante la fase di sviluppo per rendere agevole la verifica del funzionamento.
Successivamente si da inizio all'effettiva richiesta e download della risorsa richiamando il metodo Send.
downloader1.Send();
Durante il download viene scatenato l'evento DownloadProgressChanged e viene richiamato il corrispondente metodo; la proprietà downloadProgress del parametro sender di tale metodo riporta lo stato di avanzamento del download con un valore compreso tra zero e 1 in cui 1 corrisponde al completo scaricamento.
Attraverso questo valore è possibile creare un messaggio di avanzamento in modo da darne un riscontro all'utente e realizzare i più diversi effetti grafici:
function downloader1_onProgressChanged(sender, eventArgs) { var percentageValue = sender.DownloadProgress * 100; var ForeGroundBarGlow = host.content.findName("ForeGroundBarGlow"); ForeGroundBarGlow.Width = Math.floor(percentageValue); } function downloader1_onCompleted(sender, eventArgs) { var Image1 = host.content.findName("Image1"); Image1.setSource(sender, ""); removeListener(); } function downloader1_onDownloadFailed(sender, eventArgs) { //gestire messaggio di errore per l'utente removeListener(); } function removeListener() { downloader1.RemoveEventListener("DownloadProgressChanged", d1_onProgressChangedTK); downloader1.RemoveEventListener("DownloadFailed", d1_onDownloadFailedTK); downloader1.RemoveEventListener("Completed", d1_onCompletedTK); }
In questo esempio viene realizzata una classica barra rettangolare che va ad aumentare la sua larghezza in funzione dello stato di avanzamento fino a riempire l'intera area del preloader.
Al termine del caricamento il file di immagine viene impostato come source di un controllo Image con il metodo setSource in modo che sia renderizzato a video.
Come per gli altri tipi di eventi è importante che anche quelli dell'oggetto downloader sia rimossi attraverso il metodo RemoveEventListener.
Ecco il risultato: https://www.silverlightitalia.com/script/demo/10/
Commenti
Per inserire un commento, devi avere un account.
Fai il login e torna a questa pagina, oppure registrati alla nostra community.