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
Eseguire le GitHub Actions offline
Usare un KeyedService di default in ASP.NET Core 8
Creare gruppi di client per Event Grid MQTT
Eseguire una query su SQL Azure tramite un workflow di GitHub
Utilizzare le Cache API di JavaScript per salvare elementi nella cache del browser
Miglioramenti agli screen reader e al contrasto in Angular
Effettuare lo stream della risposta in ASP.NET Core tramite IAsyncEnumerable
Autenticarsi in modo sicuro su Azure tramite GitHub Actions
Utilizzare Tailwind CSS all'interno di React: installazione
Ottimizzazione dei block template in Angular 17
Hosting di componenti WebAssembly in un'applicazione Blazor static
Eseguire operazioni sui blob con Azure Storage Actions
I più letti di oggi
- PWAConf 2020 - Online
- Reactive form tipizzati con FormBuilder in Angular
- Utilizzare ChatGPT con Azure OpenAI
- Mantenere sempre reattiva una Lambda di AWS
- Messaggi in tempo reale con Blazor Server
- Una chat con #aspnetcore e #websockets https://aspit.co/bmh di @GentiliMoreno #webapi #aspnetcore2
- Autenticarsi in modo sicuro su Azure tramite GitHub Actions
- Effettuare il multi-checkout in linea nelle pipeline di Azure DevOps
- Creare una MarkupExtension per accedere alle proprietà statiche in Silverlight 5.0
- Navigare la struttura visuale di un UIElement fino a recuperare l'elemento logico in Silverlight 3.0