Alessandro Del Sole's Blog

{ A programming space about Microsoft® .NET® }
posts - 1909, comments - 2047, trackbacks - 352

My Links

News

Your host

This is me! Questo spazio è dedicato a Microsoft® .NET®, di cui sono molto appassionato :-)

Cookie e Privacy

Disabilita cookie ShinyStat

Microsoft MVP

My MVP Profile

Microsoft Certified Professional

Microsoft Specialist

Xamarin Certified Mobile Developer

Il mio libro su VB 2015!

Pre-ordina il mio libro su VB 2015 Pre-ordina il mio libro "Visual Basic 2015 Unleashed". Clicca sulla copertina per informazioni!

Il mio libro su WPF 4.5.1!

Clicca sulla copertina per informazioni! E' uscito il mio libro "Programmare con WPF 4.5.1". Clicca sulla copertina per informazioni!

These postings are provided 'AS IS' for entertainment purposes only with absolutely no warranty expressed or implied and confer no rights.
If you're not an Italian user, please visit my English blog

Le vostre visite

I'm a VB!

Guarda la mia intervista a Seattle

Follow me on Twitter!

Altri spazi

GitHub
I miei progetti open-source su GitHub

Article Categories

Archives

Post Categories

Image Galleries

Privacy Policy

WPF e Blend: applicare stili agli elementi di una ListBox

In WPF, come ormai sapete, i controlli utente sono altamente personalizzabili. È questo il caso anche della ListBox, in cui è possibile modificare l’aspetto dei singoli elementi dell’elenco, per esempio quando si seleziona ciascun elemento. In questo post vedremo come far sì che alla selezione, lo sfondo di ciascun elemento sia riportato come gradiente lineare.

 

Utilizzando codice XAML puro, il lavoro, sebbene ovviamente fattibile, diventa un po’ improbo. Utilizzeremo, quindi, uno strumento di design specifico, come Microsoft Expression Blend nella sua versione June 2005 CTP, scaricabile a questo indirizzo.

 

Una volta aperto, create un nuovo progetto di applicazione WPF. Quando pronto, dalla asset library posta sulla sinistra fate clic sull’ultimo elemento, selezionate il controllo ListBox e poi disegnatelo sulla finestra, come in figura:

 

 

Il passaggio successivo è quello di definire un ItemContainerStyle, ossia uno stile per elementi caratterizzanti ListBox e ListView. Ne creeremo uno vuoto, utilizzando il comando Edit other styles|Edit ItemContainerStyle|Create empty del menu Object, come in figura:

 

 

Quando richiesto, assegnate un nuovo identificatore allo stile. Fatto questo, nella finestra Objects and Timeline, fate clic destro sul nuovo oggetto aggiunto e selezionate, dal menu di contesto, il comando Edit Control Parts (Template)|Edit a copy, riportato in figura:

 

 

Anche in questo caso vi verrà richiesto di specificare un identificatore per lo stile. Questa operazione farà si che possiate vedere, sempre nella finestra Objects and Timeline, il control template relativo al ListBoxItem, composto da un controllo Border e da un ContentPresenter.

 

Fate clic sul Border. Ora è necessario selezionare la proprietà all’attivazione della quale deve essere applicato il nuovo stile. Supponendo di voler cambiare lo stile quando si fa clic su un elemento, la proprietà da selezionare nella sovrastante finestra Triggers è la IsSelected. Fate clic per attivare la registrazione del trigger per vedere lo schermo così raffigurato:

 

 

Spostatevi nella finestra delle proprietà e selezionate dapprima la proprietà Background, quindi il GradientBrush e la combinazione di colori desiderata, come in figura:

 

 

Questo farà si che Expression Blend generi codice XAML dapprima per gli stili, definiti nelle Window.Resources, quindi assegnerà lo stile alla ListBox. Ovviamente, in Blend potete osservare coi vostri occhi la progressiva generazione di codice XAML per ciascuna azione e rendervi conto del perché stiamo usando Blend J. Fate doppio clic per terminare la registrazione del trigger, quindi un ulteriore doppio clic per terminare l’editing del template.

 

Ora vogliamo rendere operativa l’applicazione e vedere il risultato del nostro lavoro. Salvete il progetto e riapritelo in Visual Studio 2008. Per questa demo ho utilizzato Visual Basic 2008 Express. Modificate lo XAML relativo alla ListBox, aggiungendo un attributo Name che assegni un nome al controllo, dato che Blend non lo fa.

 

Quindi, passate all’editor di codice Visual Basic. Supponiamo, ad esempio, di voler mostrare nella ListBox l’elenco dei drive presenti sul sistema. Il codice è molto semplice:

 

    Private Sub Window1_Loaded(ByVal sender As Object, ByVal e As System.Windows.RoutedEventArgs) Handles Me.Loaded

 

        Me.ListBox1.ItemsSource = My.Computer.FileSystem.Drives

 

    End Sub

Si assegna, infatti, la nostra collezione alla proprietà ItemsSource del controllo (avremmo potuto, per esempio, assegnare alla proprietà il risultato di una query LINQ). Avviando l’applicazione e selezionando un elemento della ListBox, potete vedere come sia stato stilizzato con il nostro gradiente:

 

 

Il procedimento è analogo anche nei confronti di controlli ListView.

 

Alessandro

Print | posted on domenica 6 luglio 2008 18:08 | Filed Under [ Visual Basic Windows Presentation Foundation ]

Powered by:
Powered By Subtext Powered By ASP.NET