C#WPFの道#15!RadioButtonの書き方と使い方を解説

当サイトではアフィリエイト広告を利用しています。

WPF

RadioButton(ラジオボタン)とは

RadioButton(ラジオボタン)とは、とあるグループの中から1つの項目を選択させるためのコントロールです。例えば、性別グループの「男性」「女性」「その他」を選ばせるみたいな感じのやつです。

グルーピング

基本的に同一のコンテナ(パネル等)上にあるラジオボタンは同一のグループと認識され、その中の1つの項目のみを選択することができます。

<StackPanel Margin="10">
    <RadioButton x:Name="ARadioButton"
                 Content="AAA" FontSize="20"/>
    <RadioButton x:Name="BRadioButton"
                 Content="BBB"
                 FontSize="20"/>
</StackPanel>
<StackPanel>
	<StackPanel Margin="10">
	    <RadioButton x:Name="ARadioButton"
	                 Content="AAA" FontSize="20"/>
	    <RadioButton x:Name="BRadioButton"
	                 Content="BBB"
	                 FontSize="20"/>
	</StackPanel>

	<StackPanel Margin="10">
	    <RadioButton x:Name="CRadioButton"
	                 Content="CCC" FontSize="20"/>
	    <RadioButton x:Name="DRadioButton" 
	                 Content="DDD" FontSize="20"/>
	</StackPanel>
</StackPanel>

パネルを2つに分けたため、AAA、BBBのグループとCCC、DDDのグループで別々に動作します。

GroupName

GroupNameプロパティを指定すると、同一のコンテナ(パネル等)上にあっても、別のグループとして動作させることができます。

<StackPanel Margin="10">
    <RadioButton x:Name="CRadioButton"
                 Content="CCC" FontSize="20"/>
    <RadioButton x:Name="DRadioButton" 
                 Content="DDD" FontSize="20"/>

    <RadioButton x:Name="ERadioButton" 
                 Content="EEE" FontSize="20"
                 GroupName="1"/>
    <RadioButton x:Name="FRadioButton" 
                 Content="FFF" FontSize="20"
                 GroupName="1"/>
</StackPanel>

4つのラジオボタンが同一のパネル上にありますが、EEEとFFFにGroupNameを指定しているため、CCC、DDDのグループと、EEE、FFFのグループは別グループとして動作します。

状態

状態は、チェックボックスと同様にIsCheckedで確認できます。内容はTrue、False、null(未確定)の3種類です。

イベント

イベントはChecked、Uncheckedで通知されます。Indeterminateの通知も受けることができますが、あまり用途はないような気がします。

サンプルコード

<Window x:Class="WPF015.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:WPF015"
        mc:Ignorable="d"
        Title="MainWindow" Height="300" Width="300">
    <Grid>
        <StackPanel>
            <StackPanel Margin="10">
                <RadioButton x:Name="ARadioButton"
                             Content="AAA" FontSize="20"
                             Checked="ARadioButton_Checked"/>
                <RadioButton x:Name="BRadioButton"
                             Content="BBB"
                             FontSize="20"
                             Checked="BRadioButton_Checked"/>
            </StackPanel>

            <StackPanel Margin="10">
                <RadioButton x:Name="CRadioButton"
                             Content="CCC" FontSize="20"
                             Checked="CRadioButton_Checked"/>
                <RadioButton x:Name="DRadioButton" Content="DDD" FontSize="20"
                             Checked="CRadioButton_Checked"/>

                <RadioButton x:Name="ERadioButton" Content="EEE" FontSize="20"
                             GroupName="1"/>
                <RadioButton x:Name="FRadioButton" Content="FFF" FontSize="20"
                             GroupName="1"/>
            </StackPanel>
        </StackPanel>

    </Grid>
</Window>

AAAとBBBはそれぞれにCheckedイベントを実装。CCC、DDDはCRadioButton_Checkedという同じCheckedイベントを実装。

using System.Windows;
using System.Windows.Controls;

namespace WPF015
{
    ///
    /// MainWindow.xaml の相互作用ロジック
    /// 
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
        }

        private void ARadioButton_Checked(object sender, RoutedEventArgs e)
        {

        }

        private void BRadioButton_Checked(object sender, RoutedEventArgs e)
        {

        }

        private void CRadioButton_Checked(object sender, RoutedEventArgs e)
        {
            var radioButton = sender as RadioButton;
            if(radioButton == CRadioButton)
            {

            }
            else if(radioButton == DRadioButton)
            {

            }
        }
    }
}

ARadioButtonとBRadioButtonはそれぞれのCheckedイベントにチェック状態になると通知されますが、CRadioButtonとDRadioButtonは同一のCRadioButton_Checkedに通知されるため、イベントの中で、どちらの通知かを判断して処理をすることができます。

<画面イメージ>