Introduzione
Continua la serie di articoli dedicati allo sviluppo web con la tecnologia Silverlight 2.0.
Dopo il controllo Button, in questo articolo viene illustrato l’utilizzo del controllo checkbox, un controllo che permette di selezionare uno o più dati da una determinata lista.
Gli stati che si possono avere con questo controllo, sono checked ed unchecked, mentre l’evento click viene generato quando si fa click su tale controllo, sia in fatto di spuntare che non.
Il controllo
Si crea un nuovo progetto silverlight applicazione, e dalla finestra che viene aperta, lasciamo l’opzione che ci viene indicata, ossia “aggiungi un nuovo progetto web Asp.net alla soluzione per ospitare Silverlight” e nel menu di scelta rapida, riportata nella parte inferiore lasciamo i valori di default, ossia “Progetto applicazione web Asp.Net”
Dalla barra degli strumenti, trasciniamo il controllo checkbox, ne inseriamo ben tre, va ricordato, che prima di tali controlli è stato aggiunto il controllo StackPanel che ne abbiamo già discusso in un precedente articolo, con questo controllo possiamo applicare più controlli in maniera ordinata.
Dopo aver aggiunto i tre checkbox, aggiungiamo un controllo button, il tutto dev’essere simile alla figura 1.
Figura 1
Qui di seguito, si riporta il codice xaml di tali controlli.
<StackPanel>
<CheckBox Content="Mela" IsChecked="true" IsThreeState="True" Checked="Controllo_Checked" Unchecked="Controllo_Unchecked" x:Name="Mela" ></CheckBox>
<CheckBox Content="Pera" x:Name="Pera" Checked="Controllo_Checked" Unchecked="Controllo_Unchecked"></CheckBox>
<CheckBox Content="Banana" x:Name="Banana" Checked="Controllo_Checked" Unchecked="Controllo_Unchecked"></CheckBox>
<Button x:Name="Verifica" Content="Verifica" Click="Button_Click" Width="100" Height="50"></Button>
</StackPanel>
Vediamo in dettaglio il codice per il checkbox.
Come per il controllo button, per impostare il testo, si utilizza la proprietà content, mentre la proprietà ischecked che accetta due valori (true e false) permette di impostare il controllo con la spunta se viene impostato con il valore a true.
La proprietà isThreestate, permette di avere il controllo in tre stati, con la possibilità di visualizzare il simbolo -.
L’evento checked ed unChecked, simile per i tre controlli checketed, viene scatenato quando al controllo viene applicata la spunta (checked) e unchecked quando gli si toglie la spunta.
Dopo aver digitato checked, scriviamo Controllo_Checked e digitiamo il pulsante tab della tastiera in modo che viene generato tale evento.
Mentre per l’evento Uncked, digitiamo il testo Controllo_Uncked.
Ora passiamo all’evento click del pulsante, in questo caso, viene visualizzata un messaggio a video per indicare quali sono i controlli con la spunta e quali no.
Qui di seguito si riporta il codice .Net
Codice VB.Net
Dim testoChecket As String = ""
Dim testoUncketed As String = ""
If Mela.IsChecked = True Then
testoChecket = "Mela"
Else
testoUncketed = "Mela"
End If
If Pera.IsChecked = True Then
testoChecket += " Pera"
Else
testoUncketed += " Pera"
End If
If Banana.IsChecked = True Then
testoChecket += " Banana"
Else
testoUncketed += " Banana"
End If
MessageBox.Show("Il controllo Selezionato è: " & testoChecket)
MessageBox.Show("Il controllo deselezionatoè: " & testoUncketed)
Codice C#
string testoChecket = "";
string testoUncketed = "";
if (Mela.IsChecked == true)
{
testoChecket = "Mela";
}
else
{
testoUncketed = "Mela";
}
if (Pera.IsChecked == true)
{
testoChecket += " Pera";
}
else
{
testoUncketed += " Pera";
}
if (Banana.IsChecked == true)
{
testoChecket += " Banana";
}
else
{
testoUncketed += " Banana";
}
MessageBox.Show("Il controllo Selezionato è: " + testoChecket);
MessageBox.Show("Il controllo deselezionatoè: " + testoUncketed);
Come si vede dal codice precedente, tramite la proprietà isChecked rileviamo se il controllo è stato spuntato o no.
Ora passiamo all’evento checked in questo caso, in base al nome del controllo selezionato cambiamo il colore di sfondo del pulsante.
Dopo aver rilevato l’oggetto selezionato,verifichiamo il nome del controllo, impostando il colore rosso per le mele, verde per la pere e giallo per le banane. Prima di impostare la proprietà background dell’oggetto pulsante verificare che non sia nullo, in quanto all’avvio dell’applicazione, il codice potrebbe essere eseguito ed in tale circostanza il controllo non è detto che sia stato già caricato.
L’oggetto solidcolorBrush verrà passato alla proprietà background, sempre l’oggetto solidColorBush, impostiamo la proprietà color con un determinato colore.
Da notare che a differenza del codice C#, è stato utilizzata una If, ma si può utilizzare benissimo la parola chiave select case.
Qui di seguito si riporta il codice .Net
Codice VB.Net
'in base al tipo di check cambio il colore del pulsante
Dim oggettoCheck As CheckBox = CType(sender, CheckBox)
'oggetto sfondo
Dim sfondo As New Windows.Media.SolidColorBrush
'verifico che il pulsante sia attivo, in fase di avvio dell'applicativo
If Verifica Is Nothing Then Exit Sub
'verifico quale controllo è stato spuntato ed imposto lo sfondo
If oggettoCheck.Name = "Mela" Then
sfondo.Color = Windows.Media.Colors.Red
Verifica.Background = sfondo
ElseIf oggettoCheck.Name = "Pera" Then
sfondo.Color = Windows.Media.Colors.Green
Verifica.Background = sfondo
Else
sfondo.Color = Windows.Media.Colors.Yellow
Verifica.Background = sfondo
End If
Codice C#
//verifico che il pulsante sia attivo, in fase di avvio dell'applicativo
if (Verifica == null) return; //in base al tipo di check cambio il colore del pulsante
CheckBox oggettoCheck = (CheckBox)sender;
//oggetto sfondo
SolidColorBrush sfondo = new SolidColorBrush();
//verifico quale controllo è stato spuntato ed imposto lo sfondo
switch (oggettoCheck.Name)
{
case "Mela":
sfondo.Color = Colors.Red;
Verifica.Background = sfondo;
break;
case "Pera":
sfondo.Color = Colors.Green;
Verifica.Background = sfondo;
break;
case "Banana":
sfondo.Color = Colors.Yellow;
Verifica.Background = sfondo;
break;
}
Mentre per l’evento unCkecked, viene riportato il colore dello sfondo del pulsante, al colore iniziale ossia griglio. Anche in questo caso, una volta ottenuto l’oggetto a cui si è verificato l’evento uncketd, impostiamo la proprietà background, con il colore griglio.
Qui di seguito si riporta il codice .Net
Codice VB.Net
Dim oggettoCheck As CheckBox = CType(sender, CheckBox)
'oggetto per il colore di sfondo
Dim sfondo As New Windows.Media.SolidColorBrush
'verifico che il pulsante sia attivo, in fase di avvio dell'applicativo
If Verifica Is Nothing Then Exit Sub
sfondo.Color = Windows.Media.Colors.Gray ' colore
Verifica.Background = sfondo
Codice C#
CheckBox oggettoCheck = (CheckBox)sender;
//oggetto per il colore di sfondo
SolidColorBrush sfondo = new SolidColorBrush();
//verifico che il pulsante sia attivo, in fase di avvio dell'applicativo
if(Verifica == null) return;
sfondo.Color = Colors.Gray; //colore
Verifica.Background = sfondo;
Conclusioni:
Si è visto come utilizzare il controllo Checkbox, come impostare le proprietà ed utilizzare gli eventi ckecked ed unchecked, che si scatenano quando viene applicata la spunta oppure no. Inoltre si sono visti le classi per la gestione dei colori. Le proprietà ed eventi messi a disposizione dal controllo Checkbox, sono molte permettendo un valido utilizzo di questo controllo.
Tramite la parola Download potete scaricare il file contenente il codice VB.Net e C#, utilizzato in questo articolo.
Download