All'interno dello script precedente abbiamo visto come i contenuti possono adattarsi e riempire tutto lo spazio disponibile offerto dalla griglia contenitore, scegliendo il controllo AdaptiveGridViewControl, anche durante il ridimensionamento della finestra. Tuttavia, uno degli effetti collaterali del metodo scelto era quello dell'aspect ratio: non viene mantenuto durante il resize.
Per mantenere anche l'aspect ratio, bisogna eliminare l'impostazione della proprietà ItemHeight vista nel precedente script. Nonostante questo, è comunque richiesto un controllo contenitore che vada a creare la logica di scaling per l'ItemTemplate scelto, per questo esistono due alternative:
- il controllo ViewBox: i contenuti scalano in modo lineare al variare di altezza e larghezza, causando un effetto di zoom, come mostrato nell'esempio seguente...
<DataTemplate x:Key="MyTemplate"> <Viewbox> <Grid Height="200" Width="200"> <Image Source="{Binding ImageUrl}" Stretch="UniformToFill"/> </Grid> </Viewbox> </DataTemplate>
oppure...
- il set manuale dei parametri di altezza e larghezza al variare del resize tramite il metodo MeasureOverride:
public class AspectContentControl : ContentControl { protected override Size MeasureOverride(Size availableSize) { return new Size(availableSize.Width, availableSize.Height * 2); } }
<DataTemplate x:Key="MyTemplate"> <local:AspectContentControl> <!-- ... --> </local:AspectContentControl> </DataTemplate>
In entrambi i casi viene mantenuto l'aspect ratio, anche se il secondo metodo, essendo più "manuale", consente un maggior controllo sui singoli elementi da visualizzare.
Commenti
Per inserire un commento, devi avere un account.
Fai il login e torna a questa pagina, oppure registrati alla nostra community.
Approfondimenti
Testare l'invio dei messaggi con Event Hubs Data Explorer
Supportare lo HierarchyID di Sql Server in Entity Framework 8
Registrare servizi multipli tramite chiavi in ASP.NET Core 8
Paginare i risultati con QuickGrid in Blazor
Eseguire query verso tipi non mappati in Entity Framework Core
Miglioramenti nelle performance di Angular 16
Usare un KeyedService di default in ASP.NET Core 8
Disabilitare automaticamente un workflow di GitHub (parte 2)
Generare HTML a runtime a partire da un componente Razor in ASP.NET Core
Sfruttare MQTT in cloud e in edge con Azure Event Grid
Criptare la comunicazione con mTLS in Azure Container Apps
Usare le collection expression per inizializzare una lista di oggetti in C#