venerdì 4 dicembre 2009

Tutorial silverlight utilizzare il controllo checkbox

Si riporta l'articolo preposto per il sito http://www.iprogrammatori.it/articoli/programmazione/art_i-controlli-di-silverlight-20-il-control_755.aspx

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.

CheckBoxSLFigura1.png

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

'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":

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

Nessun commento: