L'interfaccia grafica delle applicazioni può diventare complicata in breve tempo e spesso si rischia di avere centinaia di componenti da dover disegnare a schermo: talvolta i dati e i componenti della UI possono essere semplificati tramite l'uso di liste o di template, mentre molte altre volte ci sono elementi scorrelati e che vogliamo comunque mostrare all'interno della view. Per questo interviene il controllo ScrollViewer, che crea una sorta di canvas che ci permette di disegnare controlli all'infinito, garantendoci la visibilità di tutti tramite l'uso delle scrollbar sia verticale che orizzontale.
Si può raggiungere ed effettuare lo scroll automatico ad un elemento posto in fondo allo ScrollViewer, o in una qualsiasi altra posizione all'interno di esso, tramite il metodo ChangeView (che va a rimpiazzare il deprecato ScrollToVerticalOffset) e conoscendo l'elemento di destinazione:
public static void ScrollToElement(this ScrollViewer scrollViewer, UIElement element) { var transform = element.TransformToVisual((UIElement)scrollViewer.Content); var position = transform.TransformPoint(new Point(0, 0)); scrollViewer.ChangeView(null, position.Y, null, false); }
In questo caso si è fatto uso di un extension method in modo da poter riciclare la funzionalità per tutti i controlli ScrollViewer presenti nell'applicazione. Supponendo un layout tipo quello mostrato nell'esempio di seguito:
<ScrollViewer x:Name ="MyScrollView"> <Grid x:Name="ContentsPanel"> <TextBlock x:Name="TB1" /> <TextBlock x:Name="TB2" /> <Button x:Name="MyButton" /> </Grid> </ScrollViewer>
Per raggiungere il pulsante MyButton sarà sufficiente lanciare questa istruzione:
MyScrollView.ScrollToElement(MyButton);
Nell'esempio mostrato, lo scrolling avviene solamente in modalità verticale, ma non è complesso aggiungere il supporto anche per lo scrolling orizzontale ad un elemento. Basterà infatti cambiare i parametri passati al metodo ChangeView in modo che venga presa anche la coordinata X.
Il codice sorgente di questo script è disponibile su GitHub al seguente indirizzo https://github.com/aspitalia/scripts-windows/tree/master/script-207
Commenti
Per inserire un commento, devi avere un account.
Fai il login e torna a questa pagina, oppure registrati alla nostra community.
Approfondimenti
Gestire server e pc on premise con Azure Arc
Azure Functions e OpenAPI: la coppia perfetta!
Impostare il tema light o dark utilizzando i CSS
Utilizzare i WebSocket con Azure API Management
Utilizzare flat e flatMap per appiattire array innestati in array
Sfruttare i tag nell'output cache di ASP.NET Core 7
Organizzare i moduli sfruttando CommonJS
Determinare lo stato di un pod in Kubernetes
Specificare il numero di parentesi graffe nella string interpolation in combinazione con i string literal in C#
Collegare servizi a Azure Container App con i service connector
Fare automaticamente il merge di una pull request con un workflow di GitHub
Terminare l'esecuzione di un workflow di GitHub
I più letti di oggi
- .NET Conference Italia 2022 - Milano e Online
- devConf 2022 - Online
- Real Code Day 4.0: costruire applicazioni reali - Firenze
- Real Code Conference 4.0 - Firenze
- Blazor Conference 2020 Live - Online
- PWAConf 2020 - Online
- Visual Studio 2019 Live - Milano
- Global Azure Milan 2020 - Online
- Blazor Conference 2021 - Online
- Visual Studio 2015 Preview Live - Online