WPF中20个RadioButton仿ToggleButton样式及状态切换实现咨询

方案1：改造现有ToggleButton用户控件实现单选逻辑 #

• 给你的ToggleButton用户控件新增GroupName依赖属性，用于标记同组控件
• 在用户控件的选中状态变更事件里，遍历当前容器内同组的其他控件，将它们的选中状态设为false，实现单选效果
• 绑定用户控件的显示文本和背景色到自身选中状态：未选中时显示“IN”、背景设为绿色；选中时显示“OUT”、背景设为红色

示例代码（用户控件后台）：

public static readonly DependencyProperty GroupNameProperty =
    DependencyProperty.Register("GroupName", typeof(string), typeof(YourToggleUserControl));

public string GroupName
{
    get => (string)GetValue(GroupNameProperty);
    set => SetValue(GroupNameProperty, value);
}

private void OnIsCheckedChanged(object sender, RoutedEventArgs e)
{
    if (IsChecked && !string.IsNullOrEmpty(GroupName))
    {
        var parentWindow = Window.GetWindow(this);
        var sameGroupControls = parentWindow.FindVisualChildren<YourToggleUserControl>()
            .Where(c => c.GroupName == GroupName && c != this);
        foreach (var ctrl in sameGroupControls)
        {
            ctrl.IsChecked = false;
        }
    }
}

（注：FindVisualChildren是遍历可视化树的扩展方法，需自行实现）

方案2：直接为RadioButton定制Style，复用状态逻辑 #

• 放弃直接引用ToggleButton样式的思路，给RadioButton编写专属Style，通过触发器绑定IsChecked属性切换文本和背景
• 保留RadioButton原生的GroupName机制，无需额外处理单选逻辑

示例XAML代码：

<Style TargetType="RadioButton" x:Key="INOUTRadioButtonStyle">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="RadioButton">
                <Border x:Name="btnBorder" Background="Green" CornerRadius="4">
                    <TextBlock x:Name="btnText" Text="IN" Foreground="White" 
                               HorizontalAlignment="Center" VerticalAlignment="Center"/>
                </Border>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsChecked" Value="True">
                        <Setter TargetName="btnBorder" Property="Background" Value="Red"/>
                        <Setter TargetName="btnText" Property="Text" Value="OUT"/>
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

使用时给RadioButton应用该Style并设置相同GroupName：

<RadioButton Style="{StaticResource INOUTRadioButtonStyle}" GroupName="INOUTGroup"/>

方案3：将现有ToggleButton用户控件作为RadioButton的ControlTemplate #

• 把你的ToggleButton用户控件嵌入到RadioButton的ControlTemplate中，将RadioButton的IsChecked属性双向绑定到用户控件的选中状态
• 既复用用户控件的外观逻辑，又保留RadioButton原生的单选机制

示例XAML代码：

<Style TargetType="RadioButton" x:Key="RadioButtonWithToggleUC">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="RadioButton">
                <local:YourToggleUserControl 
                    IsChecked="{Binding IsChecked, RelativeSource={RelativeSource TemplatedParent}, Mode=TwoWay}"/>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

使用时设置GroupName保证单选：

<RadioButton Style="{StaticResource RadioButtonWithToggleUC}" GroupName="INOUTGroup"/>

内容的提问来源于stack exchange，提问作者mudahan