Nel rilascio del Fall Creators Update, tramite l'introduzione del Fluent Design System, è possibile creare degli effetti di luce sulla interfaccia grafica.
Il tipo XamlLight permette di applicare questi effetti direttamente sull'elemento grafico dichiarato mediante lo XAML:
public sealed class OrangeSpotLight : XamlLight { public static readonly DependencyProperty IsTargetProperty = DependencyProperty.RegisterAttached( "IsTarget", typeof(bool), typeof(OrangeSpotLight), new PropertyMetadata(null, OnIsTargetChanged) ); public static void SetIsTarget(DependencyObject target, bool value) { target.SetValue(IsTargetProperty, value); } public static Boolean GetIsTarget(DependencyObject target) { return (bool)target.GetValue(IsTargetProperty); } // Handle attached property changed to automatically target and untarget UIElements and Brushes. private static void OnIsTargetChanged(DependencyObject obj, DependencyPropertyChangedEventArgs e) { var isAdding = (bool)e.NewValue; if (isAdding) { if (obj is UIElement) { XamlLight.AddTargetElement(GetIdStatic(), obj as UIElement); } else if (obj is Brush) { XamlLight.AddTargetBrush(GetIdStatic(), obj as Brush); } } else { if (obj is UIElement) { XamlLight.RemoveTargetElement(GetIdStatic(), obj as UIElement); } else if (obj is Brush) { XamlLight.RemoveTargetBrush(GetIdStatic(), obj as Brush); } } } protected override void OnConnected(UIElement newElement) { if (CompositionLight == null) { var spotLight = Window.Current.Compositor.CreateSpotLight(); spotLight.InnerConeColor = Colors.Orange; spotLight.OuterConeColor = Colors.Yellow; spotLight.InnerConeAngleInDegrees = 30; spotLight.OuterConeAngleInDegrees = 45; spotLight.Offset = new System.Numerics.Vector3(30, 30, 200); CompositionLight = spotLight; } } protected override void OnDisconnected(UIElement oldElement) { if (CompositionLight != null) { CompositionLight.Dispose(); CompositionLight = null; } } protected override string GetId() { return GetIdStatic(); } private static string GetIdStatic() { return typeof(OrangeSpotLight).FullName; } }
Quello che a prima vista può sembrare un codice complesso è in realtà molto semplice ed ha il suo cuore nell'override del metodo OnConnected dove mediante l'API Window.Current.Compositor.CreateSpotLight viene creata la luce "spot".
L'applicazione dell'effetto viene fatta nel callback della proprietà IsTarget.
<Border BorderThickness="5"> <Border.BorderBrush> <SolidColorBrush Color="White" local:OrangeSpotLight.IsTarget="true" /> </Border.BorderBrush> <TextBlock Text="Ciao Marco" /> </Border>
La proprietà IsTatarget indica l'oggetto al quale viene applicato il nostro effetto.
Commenti
Per inserire un commento, devi avere un account.
Fai il login e torna a questa pagina, oppure registrati alla nostra community.
Approfondimenti
Usare i servizi di Azure OpenAI e ChatGPT in ASP.NET Core con Semantic Kernel
Garantire la provenienza e l'integrità degli artefatti prodotti su GitHub
Eliminare una project wiki di Azure DevOps
Persistere la ChatHistory di Semantic Kernel in ASP.NET Core Web API per GPT
Supporto ai tipi DateOnly e TimeOnly in Entity Framework Core
Utilizzare Azure Cosmos DB con i vettori
Gestire i dati con Azure Cosmos DB Data Explorer
Utilizzare il trigger SQL con le Azure Function
Potenziare la ricerca su Cosmos DB con Full Text Search
Usare il colore CSS per migliorare lo stile della pagina
Path addizionali per gli asset in ASP.NET Core MVC
Combinare Container Queries e Media Queries