Checkbox, RadioButton и ToggleSwitch

CheckBox

Флажок или CheckBox применяется для выбора из двух вариантов по принципу "да-нет", а также когда нам надо выбрать несколько опций из группы опций.

Формально CheckBox может принимать три состояния: Checked, Unchecked и Intermediate. Для установки состояния применяется свойство IsChecked:

<StackPanel>
    <CheckBox x:Name="checkBox1" IsChecked="False" IsThreeState="True" Content="Неотмечено" />
    <CheckBox x:Name="checkBox2" IsChecked="True" Content="Отмечено" />
    <CheckBox x:Name="checkBox3" IsChecked="{x:Null}" IsThreeState="True" Content="Неопределено"/>
</StackPanel>

Значение свойства IsChecked="{x:Null}" устанавливает флажок в неопределенное состояние. Остальные два состояния задаются с помощью значений true и false. Кроме того, чтобы можно было переключаться между всеми тремя состояниями, надо установить свойство IsThreeState="True"

С помощью событий Checked (генерируется при установке флажка в отмеченное состояние), Unchecked (генерируется при снятии отметки с флажка) и Indeterminate (флажок переведен в неопределенное состояние) мы можем отследить изменение состояния флажка. Например, определим элемент checkBox:

<CheckBox x:Name="checkBox" IsThreeState="True" Content="Неопределено"
		Unchecked="checkBox_Unchecked" 
		Checked="checkBox_Checked" 
		Indeterminate="checkBox_Indeterminate" />

И в файле кода c# определим все обработчики:

private void checkBox_Checked(object sender, RoutedEventArgs e)
{
    textBlock1.Text = checkBox.Content.ToString() + " отмечен";
}

private void checkBox_Unchecked(object sender, RoutedEventArgs e)
{
    textBlock1.Text = checkBox.Content.ToString() + " не отмечен";
}

private void checkBox_Indeterminate(object sender, RoutedEventArgs e)
{
    textBlock1.Text = checkBox.Content.ToString() + " в неопределенном состоянии";
}

Также для нас представляет интерес еще два события - Tapped и Click, которые возникают при нажатии на флажок. Мы можем обработать одно из них:

<StackPanel Orientation="Horizontal" VerticalAlignment="Top">
    <CheckBox x:Name="checkBox" IsChecked="False" Height="20" Content="Флажок" Tapped="checkBox_Tapped" />
    <TextBlock x:Name="textBlock1" />
</StackPanel>

private void checkBox_Tapped(object sender, TappedRoutedEventArgs e)
{
    textBlock1.Text = checkBox.IsChecked.ToString();
}

Создание флажка в коде c#:

CheckBox chBox = new CheckBox();
chBox.IsChecked = true;
chBox.Content = "Новый флажок";

RadioButton

RadioButton представляет переключатель или радиокнопку. Переключатель используется для выбора из двух и более взаимоисключающих вариантов. Элемент RadioButton, как и CheckBox, может быть в отмеченном, неотмеченном и неопределенном состоянии. Отличительной чертой этих элементов является свойство GroupName, которое задает группу радиокнопок. И в один момент времени мы можем отметить в одной группе только одну радиокнопку. Например,

<StackPanel>
    <RadioButton GroupName="phones" Content="iPhone 6s Plus" IsChecked="True" />
    <RadioButton GroupName="phones" Content="Nexus 6P" />
    <RadioButton GroupName="phones" Content="Lumia 950 XL" />
</StackPanel>

Если бы радиокнопки принадлежали бы к двум разным группам, то соответственно мы могли бы выбрать две радиокнопки:

<StackPanel>
    <RadioButton GroupName="phones" Content="iPhone 6s Plus" IsChecked="True" />
    <RadioButton GroupName="phones" Content="Nexus 6P" />
    <RadioButton GroupName="phones" Content="Lumia 950 XL" />
	<RadioButton GroupName="Languages" Content="C#" IsChecked="True" />
    <RadioButton GroupName="Languages" Content="VB.NET" />
    <RadioButton GroupName="Languages" Content="C++" />
</StackPanel>

Чтобы проследить за выбором того или иного элемента, мы также можем определить у элементов событие Checked и его обрабатывать в коде:

<StackPanel>
    <TextBlock x:Name="textBlock1" />
    <RadioButton GroupName="phones" Content="iPhone 6s Plus" IsChecked="True" Checked="RadioButton_Checked" />
    <RadioButton GroupName="phones" Content="Nexus 6P" Checked="RadioButton_Checked" />
    <RadioButton GroupName="phones" Content="Lumia 950 XL" Checked="RadioButton_Checked" />
</StackPanel>

А в файле кода C# зададим обработчик:

private void RadioButton_Checked(object sender, RoutedEventArgs e)
{
    RadioButton pressed = (RadioButton)sender;
    textBlock1.Text = pressed.Content.ToString();
}

ToggleSwitch

ToggleSwitch служит для переключения между двумя состояниями, которые вступают в силу сразу после изменения состояния переключателя. В этом плане элемент похож на CheckBox. Для определения текущего состояния используется свойство IsOn:

<ToggleSwitch IsOn="True" Header="On/Off" VerticalAlignment="Top" />

Свойство Header позволяет задать заголовок. При этом кроме заголовка элемент хранит текстовые метки для включенного и выключенного состояний. По умолчанию это "on" и "off". При выборе текстовые метки отображаются рядом с элементом. Но с помощью свойств OnContent и OffContent мы можем изменить эти метки или вложить более сложное содержимое, чем обычный текст:

<ToggleSwitch IsOn="True" OnContent="Включено" OffContent="Выключено" VerticalAlignment="Top" />

Несмотря на то, что можно задать длинные метки в качестве текста, рекомендуется использовать короткие метки для обозначения состояния, не длиннее 4 символов, например, вкл. и выкл.

Для отслеживания изменения состояния элементы мы можем задействовать событие Toggled:

<StackPanel>
    <TextBlock x:Name="textBlock1" />
    <ToggleSwitch x:Name="toggleSwitch1" Toggled="toggleSwitch1_Toggled" IsOn="True" 
		OnContent="Включено" OffContent="Выключено" />
</StackPanel>

А в коде c# пропишем обработчик:

private void toggleSwitch1_Toggled(object sender, RoutedEventArgs e)
{
    textBlock1.Text = toggleSwitch1.IsOn.ToString();
}

Программное создание ToggleSwitch:

ToggleSwitch toggleSwitch2 = new ToggleSwitch();
toggleSwitch2.IsOn = true;
toggleSwitch2.OnContent = "Включено";
toggleSwitch2.OffContent = "Выключено";
toggleSwitch2.Header = "Переключатель";