如何覆盖wpf中选定的单选按钮背景

how to override selected radiobutton background in wpf

我对 wpf 单选按钮有一些问题: 首先,我应该为单选按钮添加边框,而不是将单选按钮包装在边框中 我决定覆盖单选按钮默认模板,类似于下面的代码:

<Style TargetType="RadioButton" x:Key="navigationButton" >
        <Setter Property="Foreground" Value="White" />
        <Setter Property="FontWeight" Value="Bold" />
        <Setter Property="FontSize" Value="15" />
        <Setter Property="Template" >
            <Setter.Value>
                <ControlTemplate TargetType="RadioButton">
                    <Border Style="{StaticResource navigationButtonBorder}">
                        <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" />
                    </Border>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

所以现在我应该在选中时为这个单选按钮添加背景颜色,但是因为 覆盖,背景颜色应应用于边框(选中单选按钮时) 但我不知道该怎么做。

很简单。只需为边框命名并在 ControlTemplate 上实现触发器。

仅供参考,检查下面的代码片段(修改了您的代码)

<Style TargetType="RadioButton" x:Key="NavigationButton">
        <Setter Property="Foreground" Value="White" />
        <Setter Property="FontWeight" Value="Bold" />
        <Setter Property="FontSize" Value="15" />
        <Setter Property="Template" >
            <Setter.Value>
                <ControlTemplate TargetType="RadioButton">
                    <Border x:Name="MainBorder" Background="Red" Style="{StaticResource navigationButtonBorder}">
                        <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" />
                    </Border>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsChecked" Value="True">
                            <Setter TargetName="MainBorder" Property="Background" Value="Black"></Setter>
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

尝试一下,如果有任何其他问题,请告诉我们。

我建议你把模板的定义和颜色的变化根据状态分开。
由于模板可以通用,而且需要的颜色,在应用的不同地方,可能要求不同。

基于默认模板的示例:

    <Window.Resources>
        <ControlTemplate x:Key="RadioButtonControlTemplate1" TargetType="{x:Type RadioButton}">
            <Border x:Name="radioButtonBorder" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}">
                <Grid x:Name="templateRoot" SnapsToDevicePixels="True">
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="Auto"/>
                        <ColumnDefinition Width="*"/>
                    </Grid.ColumnDefinitions>
                    <Border BorderBrush="{Binding BorderBrush, ElementName=radioButtonBorder}"
                            BorderThickness="{Binding BorderThickness, ElementName=radioButtonBorder}"
                            CornerRadius="100"
                            HorizontalAlignment="{Binding HorizontalAlignment, ElementName=radioButtonBorder}"
                            Margin="1,1,2,1"
                            VerticalAlignment="{Binding VerticalAlignment, ElementName=radioButtonBorder}">
                        <Grid x:Name="markGrid" Margin="2">
                            <Ellipse x:Name="optionMark" Fill="#FF212121" MinWidth="6" MinHeight="6" Opacity="0"/>
                        </Grid>
                    </Border>
                    <ContentPresenter x:Name="contentPresenter" ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" Grid.Column="1" ContentStringFormat="{TemplateBinding ContentStringFormat}" Focusable="False" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
                </Grid>
            </Border>
            <ControlTemplate.Triggers>
                <Trigger Property="HasContent" Value="True">
                    <Setter Property="FocusVisualStyle">
                        <Setter.Value>
                            <Style>
                                <Setter Property="Control.Template">
                                    <Setter.Value>
                                        <ControlTemplate>
                                            <Rectangle Margin="14,0,0,0" SnapsToDevicePixels="True"
                                                       Stroke="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"
                                                       StrokeThickness="1" StrokeDashArray="1 2"/>
                                        </ControlTemplate>
                                    </Setter.Value>
                                </Setter>
                            </Style>
                        </Setter.Value>
                    </Setter>
                    <Setter Property="Padding" Value="4,-1,0,0"/>
                </Trigger>
                <Trigger Property="IsMouseOver" Value="True">
                    <Setter Property="Background" TargetName="radioButtonBorder" Value="#FFF3F9FF"/>
                    <Setter Property="BorderBrush" TargetName="radioButtonBorder" Value="#FF5593FF"/>
                    <Setter Property="Fill" TargetName="optionMark" Value="#FF212121"/>
                </Trigger>
                <Trigger Property="IsEnabled" Value="False">
                    <Setter Property="Background" TargetName="radioButtonBorder" Value="#FFE6E6E6"/>
                    <Setter Property="BorderBrush" TargetName="radioButtonBorder" Value="#FFBCBCBC"/>
                    <Setter Property="Fill" TargetName="optionMark" Value="#FF707070"/>
                </Trigger>
                <Trigger Property="IsPressed" Value="True">
                    <Setter Property="Background" TargetName="radioButtonBorder" Value="#FFD9ECFF"/>
                    <Setter Property="BorderBrush" TargetName="radioButtonBorder" Value="#FF3C77DD"/>
                    <Setter Property="Fill" TargetName="optionMark" Value="#FF212121"/>
                </Trigger>
                <Trigger Property="IsChecked" Value="True">
                    <Setter Property="Opacity" TargetName="optionMark" Value="1"/>
                </Trigger>
                <Trigger Property="IsChecked" Value="{x:Null}">
                    <Setter Property="Opacity" TargetName="optionMark" Value="0.56"/>
                </Trigger>
            </ControlTemplate.Triggers>
        </ControlTemplate>
    </Window.Resources>
    <StackPanel>
        <FrameworkElement.Resources>
            <Style TargetType="RadioButton">
                <Setter Property="Template" Value="{DynamicResource RadioButtonControlTemplate1}"/>
                <Setter Property="BorderThickness" Value="2"/>
                <Setter Property="BorderBrush" Value="Red"/>
                <Setter Property="Foreground" Value="{Binding BorderBrush, RelativeSource={RelativeSource Self}}"/>
                <Setter Property="Background" Value="#FFEE9090"/>
                <Style.Triggers>
                    <Trigger Property="IsChecked" Value="True">
                        <Setter Property="BorderBrush" Value="Green"/>
                        <Setter Property="Background" Value="LightGreen"/>
                    </Trigger>
                </Style.Triggers>
            </Style>
        </FrameworkElement.Resources>
        <RadioButton Content="First"/>
        <RadioButton Content="Second"/>
    </StackPanel>