Rendere le applicazioni sempre più dinamiche e accattivanti con delle animazioni è spesso complesso, in quanto le competenze tecniche richieste devono spaziare tra diversi ambiti, tra cui il designer, l'animatore e lo sviluppatore che dovrebbe lavorare all'implementazione effettiva. L'implementazione, solitamente, viene spesso fatta in DirectX oppure sfruttando le Windows Composition API (che abbiamo già avuto modo di affrontare in script precedenti), proprio per via del fatto che si vogliono mantenere alte le performance dell'animazione stessa e i 60fps per l'utente che la potrà vedere fluida.
Purtroppo però, come abbiamo visto in passato, le API non sono banali e richiedono anche una certa conoscenza matematica per la realizzazione. Per questo Airbnb, la nota azienda che si occupa di affitti, ha creato una libreria per le sue applicazioni, chiamata Lottie, che è in grado di convertire animazioni fatte in Adobe After Effects in file JSON, che poi possono essere interpretati dall'applicazione stessa tramite un plugin. Anche per la Universal Windows Platform è disponibile un porting della versione ufficiale, disponibile qui: https://github.com/azchohfi/LottieUWP
Per l'implementazione all'interno delle nostre applicazioni, sarà sufficiente installare il pacchetto di NuGet LottieUWP, per avere accesso al nuovo componente LottieAnimationView che permette di renderizzare il file JSON creato in precedenza, come mostrato nell'esempio seguente:
<Page xmlns:lottieUwp="using:LottieUWP" ...> <lottieUwp:LottieAnimationView FileName="Assets/loader.json" RepeatCount="-1" AutoPlay="True" /> <!-- ... --!> </Page>
Il file laoder.json è stato pre-importanto all'interno della cartella degli Asset dell'applicazione stessa. Questo sistema rende più semplice integrare le animazioni poiché il render verrà effettuato dal componente LottieAnimationView stesso e, inoltre, sono già moltissimi i siti web che permettono di scaricare migliaia di asset JSON con le animazioni pre-costruite.
Commenti
Per inserire un commento, devi avere un account.
Fai il login e torna a questa pagina, oppure registrati alla nostra community.
Approfondimenti
Applicare un filtro per recuperare alcune issue di GitHub
Hosting di componenti WebAssembly in un'applicazione Blazor static
.NET Conference Italia 2024
Usare lo spread operator con i collection initializer in C#
Utilizzare il trigger SQL con le Azure Function
Inference di dati strutturati da testo con Semantic Kernel e ASP.NET Core Web API
Limitare le richieste lato server con l'interactive routing di Blazor 8
Gestire gli accessi con Token su Azure Container Registry
Utilizzare Copilot con Azure Cosmos DB
Sfruttare MQTT in cloud e in edge con Azure Event Grid
Estrarre dati randomici da una lista di oggetti in C#
Creare un webhook in Azure DevOps
I più letti di oggi
- Build 2015: segui con noi tutte le novità per gli sviluppatori in diretta da San Francisco
- Speciale Windows Live Services: come integrarli nelle proprie applicazioni
- Rilasciata la RTM di SQL Server 2012, la versione Express subito in download
- Build 2014: tutte le novità per gli sviluppatori in diretta da San Francisco
- .NET Managed provider per MySQL
- WS-I approva Basic Profile 1.0
- Due regali dal Tech-Ed USA 2004: WSE 2.0 e VS 2005 Team System
- VS 2005 e SQL Server 2005 Express da scaricare
- Microsoft aggiorna WinFS beta 1 per VS 2005
- Utilizzare CLEditor per consentire l'input di HTML in ASP.NET MVC