Radio​Button Radio​Button Radio​Button Radio​Button Class

Definition

Represents a button that allows a user to select a single option from a group of options.

public : class RadioButton : ToggleButton, IRadioButtonpublic class RadioButton : ToggleButton, IRadioButtonPublic Class RadioButton Inherits ToggleButton Implements IRadioButton// This API is not available in Javascript.
<RadioButton .../>
-or-
<RadioButton ...>
  content
</RadioButton>
-or-
<RadioButton ...>stringContent</RadioButton>
Inheritance
Attributes
Windows 10 requirements
Device family
Windows 10 (introduced v10.0.10240.0)
API contract
Windows.Foundation.UniversalApiContract (introduced v1)

Inherited Members

Inherited properties

Inherited events

Inherited methods

Examples

The following example shows three radio buttons. The first two radio buttons are grouped together. The remaining radio button is not grouped explicitly, which means that you can select the third radio button and either the first or second. When you select a radio button, a TextBlock displays the name of the group, if the radio button has an explicit group name, and the name of the radio button.

  <TextBlock Text="First Group:"  Margin="5" />
  <RadioButton x:Name="TopButton" Margin="5" Checked="HandleCheck"
 GroupName="First Group" Content="First Choice" />
  <RadioButton x:Name="MiddleButton" Margin="5" Checked="HandleCheck"
 GroupName="First Group" Content="Second Choice" />
  <TextBlock Text="Ungrouped:" Margin="5" />
  <RadioButton x:Name="LowerButton" Margin="5" Checked="HandleCheck"
Content="Third Choice" />
  <TextBlock x:Name="choiceTextBlock" Margin="5" />
private void HandleCheck(object sender, RoutedEventArgs e)
{
    RadioButton rb = sender as RadioButton;
    choiceTextBlock.Text = "You chose: " + rb.GroupName + ": " + rb.Name;
}
Private Sub HandleCheck(ByVal sender As Object, ByVal e As RoutedEventArgs)
    Dim rb As RadioButton = TryCast(sender, RadioButton)
    choiceTextBlock.Text = "You chose: " + rb.GroupName + ": " + rb.Name
End Sub

Remarks

Use RadioButton controls to limit a user's selection to a single choice within a set of related, but mutually exclusive, choices. You group RadioButton controls by putting them inside the same parent container or by setting the GroupName property on each RadioButton to the same value.

Radio button controls

A RadioButton has two states: selected or cleared. When a RadioButton is selected, its IsChecked property is true. When a RadioButton is cleared, its IsChecked property is false. A RadioButton can be cleared by clicking another RadioButton in the same group, but it cannot be cleared by clicking it again. However, a RadioButton can be cleared programmatically by setting its IsChecked property to false.

Control style and template

You can modify the default Style and ControlTemplate to give the control a unique appearance. For information about modifying a control's style and template, see Styling controls. The default style, template, and resources that define the look of the control are included in the generic.xaml file. For design purposes, generic.xaml is available in the (Program Files)\Windows Kits\10\DesignTime\CommonConfiguration\Neutral\UAP&lt;SDK version>\Generic folder from a Windows Software Development Kit (SDK) installation. Styles and resources from different versions of the SDK might have different values.

Starting in Windows 10, version 1607 (Windows Software Development Kit (SDK) version 10.0.14393.0), generic.xaml includes resources that you can use to modify the colors of a control in different visual states without modifying the control template. In apps that target this software development kit (SDK) or later, modifying these resources is preferred to setting properties such as Background and Foreground. For more info, see the Light-weight styling section of the Styling controls article.

This table shows the resources used by the RadioButton control.

Resource keyDescription
RadioButtonBackgroundBackground color of entire control bounds at rest
RadioButtonBackgroundPointerOverBackground color on hover
RadioButtonBackgroundPressedBackground color when pressed
RadioButtonBackgroundDisabledBackground color when disabled
RadioButtonForegroundLabel color at rest
RadioButtonForegroundPointerOverLabel color on hover
RadioButtonForegroundPressedLabel color when pressed
RadioButtonForegroundDisabledLabel color when disabled
RadioButtonBorderBrushBorder color of entire control bounds at rest
RadioButtonBorderBrushPointerOverBorder color on hover
RadioButtonBorderBrushPressedBorder color when pressed
RadioButtonBorderBrushDisabledBorder color when disabled
RadioButtonOuterEllipseStrokeBorder color of unselected circular button
RadioButtonOuterEllipseStrokePointerOverBorder color of unselected circular button on hover
RadioButtonOuterEllipseStrokePressedBorder color of unselected circular button when pressed
RadioButtonOuterEllipseStrokeDisabledBorder color of unselected circular button when disabled
RadioButtonOuterEllipseFillBackground color of unselected circular button
RadioButtonOuterEllipseFillPointerOverBackground color of unselected circular button on hover
RadioButtonOuterEllipseFillPressedBackground color of unselected circular button when pressed
RadioButtonOuterEllipseFillDisabledBackground color of unselected circular button when disabled
RadioButtonOuterEllipseCheckedStrokeBorder color of selected circular button
RadioButtonOuterEllipseCheckedStrokePointerOverBorder color of selected circular button on hover
RadioButtonOuterEllipseCheckedStrokePressedBorder color of selected circular button when pressed
RadioButtonOuterEllipseCheckedStrokeDisabledBorder color of selected circular button when disabled
RadioButtonOuterEllipseCheckedFillBackground color of selected circular button
RadioButtonOuterEllipseCheckedFillPointerOverBackground color selected circular button on hover
RadioButtonOuterEllipseCheckedFillPressedBackground color selected circular button when pressed
RadioButtonOuterEllipseCheckedFillDisabledBackground color selected circular button when disabled
RadioButtonCheckGlyphStrokeBorder color of the selected button's 'dot'
RadioButtonCheckGlyphStrokePointerOverBorder color of the selected button's 'dot' on hover
RadioButtonCheckGlyphStrokePressedBorder color of the selected button's 'dot' when pressed
RadioButtonCheckGlyphStrokeDisabledBorder color of the selected button's 'dot' when disabled
RadioButtonCheckGlyphFillColor of the selected button's 'dot'
RadioButtonCheckGlyphFillPointerOverColor of the selected button's 'dot' on hover
RadioButtonCheckGlyphFillPressedColor of the selected button's 'dot' when pressed
RadioButtonCheckGlyphFillDisabledColor of the selected button's 'dot' when disabled

Constructors

RadioButton() RadioButton() RadioButton() RadioButton()

Initializes a new instance of the RadioButton class.

public : RadioButton()public RadioButton()Public Sub New()// This API is not available in Javascript.

Properties

GroupName GroupName GroupName GroupName

Gets or sets the name that specifies which RadioButton controls are mutually exclusive.

public : PlatForm::String GroupName { get; set; }public string GroupName { get; set; }Public ReadWrite Property GroupName As string// This API is not available in Javascript.
<RadioButton GroupName="nameString"/>
Value
PlatForm::String string string string

The name that specifies which RadioButton controls are mutually exclusive. The default is null.

GroupNameProperty GroupNameProperty GroupNameProperty GroupNameProperty

Identifies the GroupName dependency property.

public : static DependencyProperty GroupNameProperty { get; }public static DependencyProperty GroupNameProperty { get; }Public Static ReadOnly Property GroupNameProperty As DependencyProperty// This API is not available in Javascript.

See Also