Il controllo CheckBox

Il controllo CheckBox consente all'utente finale di attivare o disattivare un'opzione, che di solito riflette un valore booleano nel Code-behind. Passiamo direttamente a un esempio, nel caso in cui tu non sia sicuro di come appare un CheckBox:

<Window x:Class="WpfTutorialSamples.Basic_controls.CheckBoxSample"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="CheckBoxSample" Height="140" Width="250">
    <StackPanel Margin="10">
		<Label FontWeight="Bold">Application Options</Label>
		<CheckBox>Enable feature ABC</CheckBox>
		<CheckBox IsChecked="True">Enable feature XYZ</CheckBox>
		<CheckBox>Enable feature WWW</CheckBox>
	</StackPanel>
</Window>

Come puoi vedere, il CheckBox è molto facile da usare. Sul secondo CheckBox, io uso la proprietà IsChecked per farlo controllare per impostazione predefinita, ma a parte questo, non sono necessarie proprietà per usarlo. La proprietà IsChecked dovrebbe anche essere utilizzata da Code-behind se si desidera verificare se un determinato CheckBox è selezionato o meno.

Contenuto personalizzato

Il controllo CheckBox eredita dalla classe ContentControl, il che significa che può contenere contenuti personalizzati e visualizzarli accanto ad esso. Se si specifica solo una parte di testo, come nell'esempio precedente, WPF lo inserirà in un controllo TextBlock e lo visualizzerà, ma questa è solo una scorciatoia per semplificare le cose. Puoi utilizzare qualsiasi tipo di controllo al suo interno, come vedremo nel prossimo esempio:

<Window x:Class="WpfTutorialSamples.Basic_controls.CheckBoxSample"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="CheckBoxSample" Height="140" Width="250">
    <StackPanel Margin="10">
		<Label FontWeight="Bold">Application Options</Label>
		<CheckBox>
			<TextBlock>
				Enable feature <Run Foreground="Green" FontWeight="Bold">ABC</Run>
			</TextBlock>
		</CheckBox>
		<CheckBox IsChecked="True">
			<WrapPanel>
				<TextBlock>
					Enable feature <Run FontWeight="Bold">XYZ</Run>
				</TextBlock>
				<Image Source="/WpfTutorialSamples;component/Images/question.png" Width="16" Height="16" Margin="5,0" />
			</WrapPanel>
		</CheckBox>
		<CheckBox>
			<TextBlock>
				Enable feature <Run Foreground="Blue" TextDecorations="Underline" FontWeight="Bold">WWW</Run>
			</TextBlock>
		</CheckBox>
	</StackPanel>
</Window>

Come puoi vedere dal markup di esempio, puoi fare praticamente tutto quello che vuoi con il contenuto. In tutte e tre le caselle di controllo, faccio qualcosa in modo diverso con il testo, e in quello centrale ho persino inserito un controllo Immagine. Specificando un controllo come contenuto, invece del solo testo, otteniamo un controllo molto maggiore dell'aspetto e la cosa interessante è che indipendentemente dalla parte del contenuto su cui fai clic, esso attiva o disattiva il CheckBox.

La proprietà IsThreeState

Come accennato, il CheckBox di solito corrisponde a un valore booleano, il che significa che ha solo due stati: vero o falso (acceso o spento). Tuttavia, poiché un tipo di dati booleano potrebbe essere annullabile, consentendo in pratica una terza opzione (true, false o null), il controllo CheckBox può supportare anche questo caso. Impostando la proprietà IsThreeState su true, il CheckBox otterrà un terzo stato chiamato "lo stato indeterminato".

Un uso comune per questo è avere un CheckBox "Abilita tutti", che può controllare un set di caselle di controllo figlio, oltre a mostrare il loro stato collettivo. Il nostro esempio mostra come puoi creare un elenco di funzionalità che possono essere attivate e disattivate, con un comune CheckBox "Abilita tutti" nella parte superiore:

<Window x:Class="WpfTutorialSamples.Basic_controls.CheckBoxThreeStateSample"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="CheckBoxThreeStateSample" Height="170" Width="300">
	<StackPanel Margin="10">
		<Label FontWeight="Bold">Application Options</Label>
		<StackPanel Margin="10,5">
			<CheckBox IsThreeState="True" Name="cbAllFeatures" Checked="cbAllFeatures_CheckedChanged" Unchecked="cbAllFeatures_CheckedChanged">Enable all</CheckBox>
			<StackPanel Margin="20,5">
				<CheckBox Name="cbFeatureAbc" Checked="cbFeature_CheckedChanged" Unchecked="cbFeature_CheckedChanged">Enable feature ABC</CheckBox>
				<CheckBox Name="cbFeatureXyz" IsChecked="True" Checked="cbFeature_CheckedChanged" Unchecked="cbFeature_CheckedChanged">Enable feature XYZ</CheckBox>
				<CheckBox Name="cbFeatureWww" Checked="cbFeature_CheckedChanged" Unchecked="cbFeature_CheckedChanged">Enable feature WWW</CheckBox>
			</StackPanel>
		</StackPanel>
	</StackPanel>
</Window>

using System;
using System.Windows;

namespace WpfTutorialSamples.Basic_controls
{
	public partial class CheckBoxThreeStateSample : Window
	{
		public CheckBoxThreeStateSample()
		{
			InitializeComponent();
		}


		private void cbAllFeatures_CheckedChanged(object sender, RoutedEventArgs e)
		{
			bool newVal = (cbAllFeatures.IsChecked == true);
			cbFeatureAbc.IsChecked = newVal;
			cbFeatureXyz.IsChecked = newVal;
			cbFeatureWww.IsChecked = newVal;
		}

		private void cbFeature_CheckedChanged(object sender, RoutedEventArgs e)
		{
			cbAllFeatures.IsChecked = null;
			if((cbFeatureAbc.IsChecked == true) && (cbFeatureXyz.IsChecked == true) && (cbFeatureWww.IsChecked == true))
				cbAllFeatures.IsChecked = true;
			if((cbFeatureAbc.IsChecked == false) && (cbFeatureXyz.IsChecked == false) && (cbFeatureWww.IsChecked == false))
				cbAllFeatures.IsChecked = false;
		}

	}
}

Questo esempio funziona da due angolazioni diverse: se si seleziona o deseleziona la casella di controllo "Abilita tutti", tutte le caselle di controllo secondarie, ciascuna delle quali rappresenta una funzione dell'applicazione nel nostro esempio, sono selezionate o deselezionate. Funziona anche il contrario, in cui il controllo o la deselezione di un checkBox secondario influisce sullo stato CheckBox di "Abilita tutti": se sono tutti selezionati o deselezionati, il CheckBox "Abilita tutti" ottiene lo stesso stato, altrimenti il valore sarà lasciato con un null, che costringe il CheckBox nello stato indeterminato.

Tutto questo comportamento può essere visto sugli screenshot qui sopra, ed è ottenuto sottoscrivendo gli eventi Checked e Unchecked dei controlli CheckBox. In un esempio reale, è probabile che i valori vengano associati, ma questo esempio mostra solo le basi dell'utilizzo della proprietà IsThreeState per creare un effetto "Attiva tutto".