WPF CheckBox

WPF CheckBox Control

This article demonstrates how to create and use a CheckBox control in WPF with the help of XAML and C#.

Creating a CheckBox

The CheckBox element represents a WPF CheckBox control in XAML.

 

<CheckBox/>

 

The Content attribute represents the text of a CheckBox. 

 

The Name attribute represents the name of the control, which is a unique identifier of a control.

The Foreground attribute defines the foreground color of the text of the CheckBox.

The Content attribute defines the text of the CheckBox.

FontFamily, FontStyle, FontWeight, FontSize and FontStretch are font related attributes.

 

The code snippet in Listing 1 creates a CheckBox control and sets the name, content, foreground, and font related properties of a CheckBox control.

 

<CheckBox Name="McCheckBox" Foreground="Orange"

    Canvas.Left="20" Canvas.Top="10" Content="Check Me"

    FontFamily="Georgia" FontSize="20" FontWeight="Bold" >

</CheckBox>

Listing 1

The output looks like Figure 1.

Figure 1

The IsChecked property represents the state of the CheckBox control. The IsThreeState property represents whether the CheckBox has two or three states. Three states are checked, unchecked, or indeterminate.  The code snippet in Listing 2 sets IsChecked and IsThreeState properties of the CheckBox.

<CheckBox Name="McCheckBox"

          Canvas.Left="10" Canvas.Top="10"

          Content="Check Me"

          IsChecked="True" IsThreeState="True" >            

</CheckBox>

Listing 2

Adding a CheckBox Click Event Handler

The Checked and Unchecked attributes of the CheckBox element adds the checked and unchecked event handler. These events are fired when a CheckBox state is changed to checked and unchecked respectively. The code in Listing 3 adds these two event handlers.

<CheckBox Name="McCheckBox"

          Canvas.Left="10" Canvas.Top="10"

          Content="Check Me"

          IsChecked="True" IsThreeState="True"

          Checked="McCheckBox_Checked" Unchecked="McCheckBox_Unchecked">            

</CheckBox>

Listing 3

The code for the click event handler looks like following.

private void McCheckBox_Checked(object sender, RoutedEventArgs e)

{

}

 

private void McCheckBox_Unchecked(object sender, RoutedEventArgs e)

{

}

The code listed in Listing 4 sets the content of a CheckBox on both checked and unchecked events. When you check or uncheck the CheckBox, you will notice the content of the CheckBox changing.

private void McCheckBox_Checked(object sender, RoutedEventArgs e)

{

    McCheckBox.Content= "Checked";

}

 

private void McCheckBox_Unchecked(object sender, RoutedEventArgs e)

{

    McCheckBox.Content= "Unchecked";

}

                                                                                                Listing 4

Creating a CheckBox Dynamically

The code listed in Listing 5 creates a CheckBox control and sets some of its properties at run-time.

private void CreateDynamicCheckBox()

{

    CheckBox chb = new CheckBox();

    chb.Content = "Click me";

    chb.IsChecked = true;

    chb.Foreground = new SolidColorBrush(Colors.Orange);

    chb.IsChecked = true;

 

    LayoutRoot.Children.Add(chb);

}

Listing 5

Summary

In this article, I discussed how we can create a CheckBox control in WPF at design-time using XAML and at run-time using C#.