Negli script precedenti abbiamo visto come grazie alle Composition API sia facile creare delle animazioni ad alte performance con pochissime righe di codice.
Questa settimana andremo a vedere come sia altrettanto semplice applicare effetti "speciali" alle immagini.
Consideriamo il seguente snippet di codice associato all'evento Loaded della nostra MainPage. Il codice sottostante fa riferimento ad un controllo Canvas al centro della nostra UI di nome CanvasDraw:
private void MainPageLoaded(object sender, RoutedEventArgs e) { ContainerVisual _leftRoot = CanvasDraw.GetVisual(); var _compositor = _leftRoot.Compositor; var _imageFactory = CompositionImageFactory.CreateCompositionImageFactory(_compositor); var sepiaVisual = _compositor.CreateSpriteVisual(); sepiaVisual.Size = new Vector2(208, 208); _leftRoot.Children.InsertAtTop(sepiaVisual); CompositionSurfaceBrush surfaceBrush = _compositor.CreateSurfaceBrush(); surfaceBrush.Surface = _imageFactory.CreateImageFromUri(new Uri("ms-appx:///Assets/Pics/mvp.png")).Surface; var graphicsEffect = new SepiaEffect { Name = "sepiaEffect", Source = new CompositionEffectSourceParameter("source") }; var effectFactory = _compositor.CreateEffectFactory(graphicsEffect); var effectBrush = effectFactory.CreateBrush(); sepiaVisual.Brush = effectBrush; effectBrush.SetSourceParameter("source", surfaceBrush); }
Per prima cosa otteniamo una riferimento al ContainerVisual del nostro Canvas e tramite esso al suo relativo Compositor. Successivamente, usiamo la classe CompositionImageFactory per creare il loader dell'immagine che useremo come esempio.
La classe CompositionImageFactory è disponibile tramite il Windows.UI.Composition.Toolkit attualmente disponibile solo su GitHub.
Essendo il codice di creazione del Visual e del caricamento dell'immagine abbastanza auto esplicativo, passiamo direttamente alla parte dove istanziamo l'oggetto di tipo SepiaEffect.
Questo oggetto rappresenta l'effetto che verrà applicato alla nostra immagine. Dopo averlo compilato e averne creato un Brush che associamo al nostro Visual non ci rimane che settare la sorgente del nostro effect brush tramite il metodo SetSourceParameter.
Il risultato di questo codice è mostrato nell'immagine sottostante (che riporta anche la versione originale dell'immagine)

Commenti
Per inserire un commento, devi avere un account.
Fai il login e torna a questa pagina, oppure registrati alla nostra community.
Approfondimenti
Definire la durata dell'output cache in ASP.NET Core 7
ChatOps con GitHub
Utilizzare la parola chiave file nel codice C#
Intercettare gli eventi di creazione degli oggetti con Entity Framework 7
Definire lo stile CSS in base alle dimensioni del container
Utilizzare HiLo per ottimizzare le insert in un database con Entity Framework
Condividere i workflow tra più repository in GitHub
GitHub Actions e Terraform: l'infrastruttura, dalla definizione al deploy
Organizzare i moduli sfruttando CommonJS
Effettuare il download di un file via FTP con la libreria FluentFTP di .NET
Effettuare il pull di git LFS in un workflow di GitHub
Creare applicazioni distribuite con Azure Container Apps e Dapr
I più letti di oggi
- .NET Conference Italia 2022 - Milano e Online
- Visual Studio 2019 sarà disponibile a partire dal 2 Aprile
- Windows Phone 8.1 Day - Milano
- Speciale per il lancio di Visual Studio 2008, SQL Server 2008 e Windows Server 2008 dal 25/02 al 07/03
- ASP.NET 3.5 Extensions in beta la settimana prossima
- ASPItalia.com Future Web Conference: 15 gennaio 2008, L'Aquila
- Rilasciata la CTP Preview di ASP.NET 3.5 Extensions
- Tutto per portare Visual Studio 2015, ASP.NET 5 e Windows 10 sotto l'ombrellone!
- Real Code Day 4.0: costruire applicazioni reali - Firenze
- Tutto per portarsi il .NET Framework 3.5 sotto l'ombrellone