Uno dei benefici dell'interop tra il Composition Engine e lo XAML è l'aggiunta di nuove API che ci consentono di utilizzare il Composition Engine direttamente nello XAML.
Ad esempio, creando una classe che estende il tipo XamlCompositionBrushBase è possibile creare qualsiasi effetto, come ad esempio invertire il disegno del brush:
public class InvertBrush : XamlCompositionBrushBase { protected override void OnConnected() { if (CompositionBrush == null) { // creiamo lo sfondo, con ciò che è dietro l'UI element var backdrop = Window.Current.Compositor.CreateBackdropBrush(); // controlliamo le capabilities: se gli effetti non sono supportati usciamo if (!CompositionCapabilities.GetForCurrentView().AreEffectsSupported()) { return; } // Creiamo l'effetto // usiamo Win2D in particolare l'InvertEffect e usiamo il BackdropBrush come sorgente var invertEffect = new InvertEffect { Source = new CompositionEffectSourceParameter("backdrop"); }; // facciamo il setup dell'EffectFactory var effectFactory = Window.Current.Compositor.CreateEffectFactory(invertEffect); // e infine creiamo il CompositionEffectBrush var effectBrush = effectFactory.CreateBrush(); // impostiamo la sorgente effectBrush.SetSourceParameter("backdrop", backdrop); // e infine assegniamo la CompositionBrush CompositionBrush = effectBrush; } } protected override void OnDisconnected() { // facciamo pulizia CompositionBrush?.Dispose(); CompositionBrush = null; } }
E infine nello XAML creiamo il brush vero e proprio:
<Grid> <Grid.Background> <ImageBrush ImageSource="ms-appx:///Images/myImage.png"/> </Grid.Background> <Grid Width="250" Height="250" HorizontalAlignment="Center" VerticalAlignment="Center"> <Grid.Background> <brushes:InvertBrush /> </Grid.Background> </Grid> </Grid>
Creare un effetto custom non è semplice, per questo motivo ne possiamo trovare alcuni già pronti come, ad esempio, RevealBrush, RevealBorderBrush, RevealBackgroundBrush e infine AcrylicBrush, che riveste un ruolo importantissimo nel nuovo Fluent Design System di Microsoft, perché aggiunge un effetto di trasparenza acrilica, già pronto per l'utilizzo.
Commenti
Per inserire un commento, devi avere un account.
Fai il login e torna a questa pagina, oppure registrati alla nostra community.
Approfondimenti
Workflow di continuous deployment tramite pull request label in GitHub
Assegnare un valore di default a un parametro di una lambda in C#
Effettuare delete massive con Entity Framework Core 7
Eseguire query manipolando le liste contenute in un oggetto mappato verso una colonna JSON
Short-circuiting della Pipeline in ASP.NET Core
Sfruttare lo stream rendering per le pagine statiche di Blazor 8
Registrare servizi multipli tramite chiavi in ASP.NET Core 8
Supportare il sorting di dati tabellari in Blazor con QuickGrid
Esportare ed analizzare le issue di GitHub con la CLI e GraphQL
Utilizzare le Cache API di JavaScript per salvare elementi nella cache del browser
Utilizzare i primary constructor di C# per inizializzare le proprietà
Specificare il versioning nel path degli URL in ASP.NET Web API