Spesso può capitare di avere a disposizione una griglia di elementi, i cui contenuti hanno tutti una dimensione fissa definita a priori, ma, lavorando in ambiente principalmente desktop, si vuole comunque garantire che i contenuti si adattino alla dimensione della finestra durante il resize. Questo può principalmente essere realizzato in due modi:
- avendo i contenuti che si spostano e mantengono le dimensioni;
- avendo i contenuti che cambiano le dimensioni (sia di altezza che di larghezza) adattandosi al contesto.
Il Windows Community Toolkit è, come abbiamo già avuto modo di vedere in passato all'interno di altri script, un ottimo repository di utility che possono semplificarci la vita durante gli sviluppi delle nostre applicazioni UWP e, anche in questo caso, ci viene in aiuto per realizzare una griglia i cui contenuti possono "muoversi" all'interno dello spazio disponibile.
Per farlo, è sufficiente registrare il toolkit come namespace all'interno della pagina interessata e quindi sfruttare l'animazione di ReorderGridAnimation, come mostrato nell'esempio seguente:
<Page xmlns:animations="using:Microsoft.Toolkit.Uwp.UI.Animations" ...> <GridView x:Name="MyGridView" animations:ReorderGridAnimation.Duration="250" />
Al ridimensionarsi della finestra, i contenuti manterranno le dimensioni e, quando avranno sufficiente spazio, si sposteranno di una riga in alto o in basso, seguendo questa animazione che garantisce fluidità (poiché costruita tramite Windows Composition). Eventualmente è anche possibile cambiare la durata dell'animazione, anche se è consigliato mantenere un valore di 250ms per non creare un effetto "strano" agli occhi degli utenti.
Commenti
Per inserire un commento, devi avere un account.
Fai il login e torna a questa pagina, oppure registrati alla nostra community.
Approfondimenti
Potenziare Azure AI Search con la ricerca vettoriale
Miglioramenti nell'accessibilità con Angular CDK
Usare le variabili per personalizzare gli stili CSS
Eseguire operazioni con timeout in React
Utilizzare Model as a Service su Microsoft Azure
Usare un KeyedService di default in ASP.NET Core 8
Sfruttare i KeyedService in un'applicazione Blazor in .NET 8
Effettuare lo stream della risposta in ASP.NET Core tramite IAsyncEnumerable
Sfruttare lo streaming di una chiamata Http da Blazor
Load test di ASP.NET Core con k6
Creare form tipizzati con Angular
Criptare la comunicazione con mTLS in Azure Container Apps