Nell'articolo sul controllo PivotViewer
(https://www.silverlightitalia.com/articoli/silverlight/pivotviewer-v2-silverlight-5.0.aspx),
disponibile nell'SDK di Silverlight 5.0, abbiamo introdotto le possibilità di personalizzazione del layout delle tradecards. Anche il pannello di dettaglio può essere fortemente personalizzato.
La scelta dei colori si può gestire attraverso le proprietà:
- SecondaryBackground
- BorderBrush
- AccentColor
- ControlBackground
- Foreground
- SecondaryForeground
- PrimaryItemValueBackgroundColor
- SecondaryItemValueBackgroundColo
Con i seguenti valori:

Si può ottenere il risultato seguente:

La barra, inoltre, può essere anche completamente ridefinita: trattandosi del controllo PivotViewerDetailPane possiamo ridefinire il suo Style ed il suo Template.
Ecco un esempio:
<Style TargetType="sdk:PivotViewerDetailPane" x:Key="DetailPaneStyle1"> <Setter Property="Foreground" Value="{Binding Foreground, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=sdk:PivotViewer}}" /> <Setter Property="BorderBrush" Value="{Binding BorderBrush, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=sdk:PivotViewer}}" /> <Setter Property="AccentColor" Value="{Binding AccentColor, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=sdk:PivotViewer}}" /> <Setter Property="Background" Value="{Binding SecondaryBackground, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=sdk:PivotViewer}}" /> <Setter Property="ControlBackground" Value="{Binding ControlBackground, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=sdk:PivotViewer}}" /> <Setter Property="SecondaryForeground" Value="{Binding SecondaryForeground, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=sdk:PivotViewer}}" /> <Setter Property="PrimaryItemValueBackgroundColor" Value="{Binding PrimaryItemValueBackgroundColor, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=sdk:PivotViewer}}" /> <Setter Property="SecondaryItemValueBackgroundColor" Value="{Binding SecondaryItemValueBackgroundColor, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=sdk:PivotViewer}}" /> <Setter Property="ContentTemplate"> <Setter.Value> <DataTemplate> <Grid Width="190"> <StackPanel Margin="10"> <TextBlock Text="{Binding Title, StringFormat='Titolo: {0}'}" FontSize="30" Margin="5" HorizontalAlignment="Left" /> <Image Source="{Binding WebsiteLogo}" Height="150" Margin="5" Stretch="Uniform" /> <TextBlock Text="{Binding AuthorName}" FontSize="30" FontWeight="Bold" Margin="5,0,5,0" HorizontalAlignment="Left" /> <TextBlock Text="{Binding Abstract}" FontSize="20" Margin="5" TextWrapping="Wrap" /> </StackPanel> </Grid> </DataTemplate> </Setter.Value> </Setter> </Style>
Nello Style precedente possiamo vedere come le proprietà della barra vengano prese dai valori impostati sul controllo PivotViewer attraverso le espressioni di binding con RelativeSource e FindAncestor, novità introdotta proprio in Silverlight 5.
Nel ContentTemplate, invece, abbiamo la possibilità di definire tutto il markup per mostrare un layout completamente personalizzato.

Ovviamente, ridefinendo il ContentTemplate, ci perdiamo le molte funzionalità implementate nativamente dal controllo, che se necessario devono essere reimplementate manualmente.
Commenti
Per inserire un commento, devi avere un account.
Fai il login e torna a questa pagina, oppure registrati alla nostra community.
Approfondimenti
Aggiungere temi custom a Blazor
Gestire gli errori di caricamento delle immagini
Utilizzare azurite come simulatore di Azure Storage
Tracciare gli eventi tramite i DevTools di Chrome
Utilizzare i metodi Linq MinBy e MaxBy per semplificare le ricerche degli elementi minimi e massimi in liste di oggetti complessi con LINQ
Caricare un asset come parte di una release con un workflow di GitHub
.NET 7 Live Q&A
Eseguire query in parallelo con Entity Framework Core and ASP.NET Core
Impostare il forward degli header in un sito ASP.NET Core dietro a un reverse proxy
Caricare automaticamente i dati delle relazioni in EF Core 6
Utilizzare la keyword with in JavaScript
Utilizzare Front Door come CDN di contenuti statici
I più letti di oggi
- Gestire il breaking change di Entity Framework Core 7 con tabelle che usano identity e trigger
- Leggere e scrivere su cookie tramite Blazor
- Realizzare applicazioni SaaS con ASP.NET Core e Azure
- ecco tutte le novità pubblicate sui nostri siti questa settimana: https://aspit.co/wkly buon week-end!
- Raggruppare i parametri di una minimal API in un singolo oggetto in ASP.NET Core