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
Utilizzare politiche di resiliency con Azure Container App
Sottoscrizione agli eventi sul contenitore in JavaScript
Sfruttare lo streaming di una chiamata Http da Blazor
Creare moduli CSS in React
Utilizzare Model as a Service su Microsoft Azure
Gestire errori funzionali tramite exception in ASP.NET Core Web API
Eseguire attività basate su eventi con Azure Container Jobs
Gestire domini wildcard in Azure Container Apps
Creare alias per tipi generici e tuple in C#
Eseguire un metodo asincrono dopo il set di una proprietà in Blazor 8
Hosting di componenti WebAssembly in un'applicazione Blazor static
Effettuare il pull di git LFS in un workflow di GitHub