Ovládací prvek RadioButton

Ovládací prvek RadioButton poskytuje uživateli seznam možností, z nichž jen jedna může být vybrána. Stejného výsledku je možné využít při menším obsazení prostoru pomocí ovládacího prvku ComboBox, ale skupina přepínačů poskytuje uživateli lepší přehled o nabízených možnostech.

<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>

Přidali jsme Label s otázkou a tři přepínače s možností výběru požadované odpovědi. Předvybranou variantu nastavíme pomocí vlastnosti IsChecked na posledním přepínači, kterou může uživatel snadno změnit kliknutím na jinou z možností. Pomocí této vlastnosti můžeme také v kódu kontrolovat, jestli byl RadioButton vybrán nebo ne.

Skupiny RadioButtonů

Pokud zkusíte spustit příklad výše, zjistíte, že skutečně může být vybrána pouze jedna možnost. Co ale dělat, když budeme chtít mít více skupin přepínačů s vlastním výběrem? K tomu slouží vlastnost GroupName, která umožňuje určit, které přepínače patří k sobě. Zde je příklad:

<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>

Pomocí vlastnosti GroupName na každém přepínači je možné nyní vybrat variantu z obou skupin. Bez této vlastnosti by bylo možné vybrat jen jeden ze všech šesti přepínačů.

Vlastní obsah

RadioButton dědí ze třídy ContentControl, což znamená, že může vedle přepínače zobrazit vlastní obsah. Pokud zadáte pouze text (jako v příkladu výše), WPF ho dá do TextBlocku a zobrazí ho. To je ale pouze pro zjednodušení. Obsahem může být jakýkoliv jiný ovládací prvek, jak si ukážeme v následujícím příkladu:

<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>

Příklad je sice trochu těžkopádný, ale princip je jednoduchý. Každý RadioButton má WrapPanel s obrázkem a textem. Protože používáme ovládací prvek TextBlock, můžeme text i libovolně naformátovat. V tomto příkladu jsme nastavili barvu textu, aby odpovídala zvolené variantě. Ovládací prvek Image (o tom si řekneme později) se používá pro zobrazení obrázku u každé varianty.

Všimněte se, že můžeme kliknout kdekoliv na RadioButton, dokonce i na obrázek nebo text, a varianta se vybere, protože se jedná o obsah daného přepínače. Pokud by byl popisek umístěn v samostatném panelu vedle přepínače, musel by uživatel kliknout pouze přesně na kolečko s výběrem, což není praktické.