TOC

This article is currently in the process of being translated into Czech (~72% done).

Základní ovládací prvky ("Controls"):

The CheckBox control

Komponenta CheckBox dovoluje konečnému uživateli přepnout volbu na zapnuto/vypnuto, obvykle odrážející Boolean hodnotu v Code-Behind (.cs - pozn. překladatele). Pojďme rovnou na příklad, pokud si nejste jistí, jak CheckBox vypadá:

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

Jak můžete vidět, CheckBox je velice stadné používat. V druhém CheckBoxu jsem použil vlastnost IsChecked abych měl defaultně zaškrtlý CheckBox, ale kromě toho nejsou potřeba žádné jiné vlastnosti k užívání. Pokud chcete kontrolovat zda je CheckBox zaškrtnutý či ne, můžete použít vlastnost IsChacked také z Code-behind.

Vlastní obsah

Ovládací prvek CheckBox dědí třídu ContentControl, což znamená, že přijímá jakýkoliv vlastní obsah a umí ho zobrazit. Pokud zadáte pouze text, jako v příkladu výše, WPF ho vloží do TextBlocku a zobrazí ho. To je ale pouze pro zjednodušení práce. Obsahem může být jakýkoliv ovládací prvek, jak si ukážeme v následujícím příkladu:

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

Jak můžeme vidět na ukázce, s obsahem můžeme dělat co chceme. Na všech třech zaškrtávačích jsme použili různé formátování textu a ovládací prvek Image. Pokud jako obsah použijeme ovládací prvky, získáme mnohem větší kontrolu nad výsledným vzhledem a pokud uživatel klikne kdekoliv na tento obsah, dojde k aktivaci na zaškrtávací políčko.

Vlastnost IsThreeState

Jak bylo zmíněno, CheckBox zpravidla odpovídá hodnotě boolean, která znamená, že má jen dva stavy: true nebo false (pravda, nepravda / zapnuto, vypnuto). Nicméně od té doby, co datový typ boolean může být "nulovatelný", je fakticky přidaná třetí možtnost (true, false nebo null), CheckBox také podporuje tuto možnost. Pomocí nastavení vlastnosti IsThreeState na "true" bude CheckBox mít třetí stav zvaný "neurčitý stav".

Běžné použití je CheckBox "Povolit vše", který může ovládat podřízené checkboxy a zobrazovat jejich celkový stav. Náš příklad ukazuje seznam funkcionalit, které můžeme vypínat a zapínat a nad tím máme souhrnný "Povolit vše" CheckBox:

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

	}
}

This example works from two different angles: If you check or uncheck the "Enable all" CheckBox, then all of the child check boxes, each representing an application feature in our example, is either checked or unchecked. It also works the other way around though, where checking or unchecking a child CheckBox affects the "Enable all" CheckBox state: If they are all checked or unchecked, then the "Enable all" CheckBox gets the same state - otherwise the value will be left with a null, which forces the CheckBox into the indeterminate state.

Veškeré toto chování můžeme vidět na obrázku nahoře a je zajištěno odběrem Checked a Unchecked událostí v kontrolním panelu CheckBoxu. V realitě bychom radši spárovali tyto hodnoty společně, ale tento příklad ukazuje základy používání IsThreeState vlastnosti, pro vytvoření "Toggle all" efektu.

This article has been fully translated into the following languages: Is your preferred language not on the list? Click here to help us translate this article into your language!