Chi proviene da WPF (o ancora prima da WinForms) rischia di trovarsi spesso spiazzato poiché approcciando la Universal Windows Platform rischia di non trovare determinati controlli alla quale è già familiare, sia che essi siano nativi sia che siano derivati da componenti di terze parti. Uno di questi componenti è senz'altro System.Windows.Media.GradientBrush, utilizzato, al contrario del LinearBrush, per realizzare effetti di luce e colori sotto forma di gradiente radiale.
Per realizzare lo stesso nella Universal Windows Platform abbiamo bisogno del Windows Community Toolkit e, prima di tutto, è necessario aggiungere i pacchetti di NuGet Microsoft.Toolkit.Uwp e Microsoft.Toolkit.Uwp.UI che ci danno accesso ai controlli da utilizzare, quindi importiamo il namespace necessario a livello di pagina XAML:
xmlns:media="using:Microsoft.Toolkit.Uwp.UI.Media"
Una volta importato il namespace, è possibile aggiungere il controllo RadialGradientBrush come riempimento per un qualsiasi oggetto di tipo UIElement. Nel caso dell'esempio seguente, viene applicato per riempire il contenuto di un Rectangle:
<Rectangle Width="300" Height="300"> <Rectangle.Fill> <media:RadialGradientBrush AlphaMode="Premultiplied" RadiusX="0.2" RadiusY="0.2" SpreadMethod="Reflect"> <GradientStop Color="Red" Offset="0" /> <GradientStop Color="Transparent" Offset="0.25" /> <GradientStop Color="Yellow" Offset="0.50" /> <GradientStop Color="Transparent" Offset="0.75" /> <GradientStop Color="Green" Offset="1.0" /> </media:RadialGradientBrush> </Rectangle.Fill> </Rectangle>
La collezione di colori da mostrare come gradiente è impostata all'interno della proprietà GradientStops ma, un particolare da evidenziare per quanto riguarda l'esempio, è il riferimento al valore di AlphaMode: se questo è impostato al valore consigliato di Premultiplied si otterrà una miglior transizione tra i colori e l'effetto trasparente mentre, impostandolo al valore Straight si otterrà un comportamento simile a quanto avveniva in WPF.
Il caso evidenziato produce un risultato simile al seguente:

Commenti
Per inserire un commento, devi avere un account.
Fai il login e torna a questa pagina, oppure registrati alla nostra community.
Approfondimenti
.NET Conference Italia 2024
Sfruttare gli embedding e la ricerca vettoriale con Azure SQL Database
Referenziare un @layer più alto in CSS
Triggerare una pipeline su un altro repository di Azure DevOps
Cancellare una run di un workflow di GitHub
Migliorare i tempi di risposta di GPT tramite lo streaming endpoint in ASP.NET Core
Migliorare la scalabilità delle Azure Function con il Flex Consumption
Cambiare la chiave di partizionamento di Azure Cosmos DB
Utilizzare un numero per gestire la concorrenza ottimistica con SQL Server ed Entity Framework
Usare i servizi di Azure OpenAI e ChatGPT in ASP.NET Core con Semantic Kernel
Come EF 8 ha ottimizzato le query che usano il metodo Contains
Effettuare il log delle chiamate a function di GPT in ASP.NET Web API