The WPF RadioButton

Being an old VB coder, I fondly remember this control as the Option Button, but these days it’s been renamed to the RadioButton. They are used to present the user with a set of mutually exclusive options.

Adding them is simple, just use the <RadioButton> tag. For the button you wish to be the default (if any) you add the IsChecked=”true” flag.

WPF adds a huge improvement over it’s predecessor. No longer are you forced to use a container control to group your radio buttons. Instead, WPF adds a GroupName property. Take a look at this example:  

  <StackPanel>

    <RadioButton GroupName=One IsChecked=True>Option 1</RadioButton>

    <RadioButton GroupName=One IsChecked=False>Option 2</RadioButton>

    <RadioButton GroupName=Two IsChecked=False>Option 3</RadioButton>

    <RadioButton GroupName=Two IsChecked=True>Option 4</RadioButton>

  </StackPanel>

wpf045

Note the GroupName, for the first two items, I’ve set it to One, on the second two it’s Two. This means you can change Option 1 and Option 2 without affection Options 3 or 4. Go ahead and run the app, click on the options a bit and watch what happens.

In my example, I only entered two items for each, the actual number you can do is limited only by the space you have available on your Window.

The C# code for checking the value is identical to yesterday’s code for the CheckBox so I won’t reiterate it, all you have to do is look at the IsChecked property.

One last point, event though adding containers are not required to separate the option groups, it’s important to provide some sort of visual indicator so the user knows which groups do what.

About these ads

4 Responses to “The WPF RadioButton”

  1. Carlos de Luna Sáenz Says:

    In your example… how do i know wich one is selected by the user?
    Greetings

  2. Carlos de Luna Sáenz Says:

    What i meant is… i have to “iterate” or “look” on each one of the radio Buttons… how if you didn’t use the Name property… can i use the groupName and get the radioButtons inside the group???
    Thanks

  3. Mark Heydenrych Says:

    Fantastic little tutorial. Quick, helpful, clear. I’ve found lots of useful stuff on this site. Thanks ;)

  4. John Q. Public Says:

    Excellent article. Here is something just to complete the loop.

    Given this XAML:
    ///

    Option 1
    Option 2
    Option 3

    /// and this code behind (C#)

    bool? testWhichRadioButtonClickedBool = null;

    testWhichRadioButtonClickedBool = RadioBtn1.IsChecked;

    if (testWhichRadioButtonClickedBool != null)
    {
    if (testWhichRadioButtonClickedBool != false)
    {
    //do first procedure here

    }
    }

    testWhichRadioButtonClickedBool = RadioBtn2.IsChecked;

    if (testWhichRadioButtonClickedBool != null)
    {
    if (testWhichRadioButtonClickedBool != false)
    {
    //do second procedure here

    }
    }

    testWhichRadioButtonClickedBool = RadioBtn3.IsChecked;

    if (testWhichRadioButtonClickedBool != null)
    {
    if (testWhichRadioButtonClickedBool != false)
    {
    //do third procedure here

    }
    }

    //only one of these three if statements is true at any time


Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

Follow

Get every new post delivered to your Inbox.

Join 93 other followers

%d bloggers like this: