Элемент RadioButton

С помощью RadioButton Вы можете предоставить конечному пользователю возможность выбора между несколькими вариантами, при этом, в один момент времени, выбран может быть только один. Вы можете достичь такой же эффект с помощью элемента CheckBox, но набор RadioButton'ов дает пользователю лучший обзор на доступные варианты.

<Window x:Class="WpfTutorialSamples.Basic_controls.RadioButtonSample"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="RadioButtonSample" Height="150" Width="250">
	<StackPanel Margin="10">
		<Label FontWeight="Bold">Are you ready?</Label>
		<RadioButton>Yes</RadioButton>
		<RadioButton>No</RadioButton>
		<RadioButton IsChecked="True">Maybe</RadioButton>
	</StackPanel>
</Window>

Все что мы сделали, это добавили Label с вопросом и три RadioButton'а (возможных ответа). Мы определили вариант по умолчанию с помощью свойства IsChecked последнего элемента, причем пользователь в силах изменить это, просто кликнув на другой вариант. Также, возможно, Вы захотите использовать это свойство в CodeBehind, для того, чтобы проверить выбран RadioButton или нет.

Группы RadioButton'ов

При запуске этого примера Вы убедитесь в том, что одновременно может быть выбран только один RadioButton. Но что, если Вы захотите создать несколько групп этих элементов, каждая из которых будет иметь свои индивидуальные варианты выбора? Этот механизм реализует свойство GroupName, которое позволяет Вам объединить несколько RadioButton'ов вместе. Вот пример:

<Window x:Class="WpfTutorialSamples.Basic_controls.RadioButtonSample"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="RadioButtonSample" Height="230" Width="250">
	<StackPanel Margin="10">
		<Label FontWeight="Bold">Are you ready?</Label>
		<RadioButton GroupName="ready">Yes</RadioButton>
		<RadioButton GroupName="ready">No</RadioButton>
		<RadioButton GroupName="ready" IsChecked="True">Maybe</RadioButton>

		<Label FontWeight="Bold">Male or female?</Label>
		<RadioButton GroupName="sex">Male</RadioButton>
		<RadioButton GroupName="sex">Female</RadioButton>
		<RadioButton GroupName="sex" IsChecked="True">Not sure</RadioButton>
	</StackPanel>
</Window>

Введение свойства GroupName для каждого из RadioButton'ов позволяет осуществлять выбор отдельно в двух группах этих элементов. При отсутствии выше рассмотренного свойства из 6 опций можно было бы выбрать только одну.

Специальный контент

RadioButton наследует класс ContentControl и, следовательно, может содержать в себе нетипичный контент. Если Вы просто определяете текст в элементе, как я сделал это выше, WPF помещает внутрь него элемент TextBlock для отображения текста, но это всего лишь упрощение. При желании Вы можете использовать любой элемент управления внутри RadioButton, как на примере ниже:

<Window x:Class="WpfTutorialSamples.Basic_controls.RadioButtonCustomContentSample"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="RadioButtonCustomContentSample" Height="150" Width="250">
	<StackPanel Margin="10">
		<Label FontWeight="Bold">Are you ready?</Label>
		<RadioButton>
			<WrapPanel>
				<Image Source="/WpfTutorialSamples;component/Images/accept.png" Width="16" Height="16" Margin="0,0,5,0" />
				<TextBlock Text="Yes" Foreground="Green" />
			</WrapPanel>
		</RadioButton>
		<RadioButton Margin="0,5">
			<WrapPanel>
				<Image Source="/WpfTutorialSamples;component/Images/cancel.png" Width="16" Height="16" Margin="0,0,5,0" />
				<TextBlock Text="No" Foreground="Red" />
			</WrapPanel>
		</RadioButton>
		<RadioButton IsChecked="True">
			<WrapPanel>
				<Image Source="/WpfTutorialSamples;component/Images/question.png" Width="16" Height="16" Margin="0,0,5,0" />
				<TextBlock Text="Maybe" Foreground="Gray" />
			</WrapPanel>
		</RadioButton>
	</StackPanel>
</Window>

Разметка в этом примере может показать сложной, но сама концепция является крайне простой. Для каждого RadioButton'а мы определили контейнер WrapPanel с изображением и текстом внутри. С использованием TextBlock мы получаем больший контроль, например, можно сформатировать текст так, как нам нужно. В этом примере я изменил цвет текста опций. Элемент Image (позже будет рассмотрен более подробно) позволяет отображать любое удобное нам изображение.

Заметьте, Вы можете нажать на любое место RadioButton'а: на изображение либо на текст, и вариант будет выбран. Это связано с тем, что мы сами определили специализированное содержание элемента. Если Вы разместите отдельно RadioButton и текстовое поле - пользователь сможет осуществить выбор, исключительно, при нажатии на круглую иконку RadioButton, что менее практично.