如何通过在 WPF 中绑定来设置复选框内容的背景颜色答案

【问题标题】：How to set the background color of a checkbox's content by binding in WPF如何通过在 WPF 中绑定来设置复选框内容的背景颜色
【发布时间】：2013-12-27 00:40:50
【问题描述】：

我试图弄清楚如何为复选框绑定内容的背景颜色。这是我的代码，当然背景设置只是改变复选框的颜色而不是文本后面的颜色。

        <ListBox Name="ListBox1" ItemsSource="{Binding Path=relationshipTypesTable.dataTable.DefaultView}">
            <ListBox.ItemsPanel>
                <ItemsPanelTemplate>
                    <StackPanel Orientation="Horizontal"/>
                </ItemsPanelTemplate>
            </ListBox.ItemsPanel>

            <ListBox.ItemTemplate>
                <DataTemplate>
                    <CheckBox IsChecked="True" Content="{Binding typeDesc}" Background="{Binding color}"/>
                </DataTemplate>
            </ListBox.ItemTemplate>
        </ListBox>

【问题讨论】：

我使用了下面文章中显示的“复选框”样式。没有它，我在我们的一台 Windows Server 2008 机器上看到白色背景上的白色刻度：eidias.com/blog/2012/6/1/…

标签： wpf checkbox styling

【解决方案1】：

试试这个：

<ListBox Name="ListBox1" ItemsSource="{Binding Path=relationshipTypesTable.dataTable.DefaultView}">
    <ListBox.ItemsPanel>
        <ItemsPanelTemplate>
            <StackPanel Orientation="Horizontal"/>
        </ItemsPanelTemplate>
    </ListBox.ItemsPanel>

    <ListBox.ItemTemplate>
        <DataTemplate>
            <CheckBox IsChecked="True">
                <TextBlock Text="{Binding typeDesc}" Background="{Binding color}"/>
            </CheckBox>
        </DataTemplate>
    </ListBox.ItemTemplate>
</ListBox>

【讨论】：

谢谢@ryrich，这是我想做的一个简单而干净的解决方案。

【解决方案2】：

如果不使用自己的 ControlTemplate 而不是默认设置，我认为您无法设置 CheckBox 的背景样式。

你可以使用 ControlTemplate 沿着这些线（我刚刚从 Kaxaml 获取了基本模板） - 我已经制作了背景 Red - 你会想要用你的 {Binding color} 替换它

 <Style x:Key="{x:Type CheckBox}" TargetType="{x:Type CheckBox}">
            <Setter Property="SnapsToDevicePixels" Value="true"/>
            <Setter Property="OverridesDefaultStyle" Value="true"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type CheckBox}">
                        <BulletDecorator Background="Transparent">
                            <BulletDecorator.Bullet>
                                <Border x:Name="Border"  
          Width="13" 
          Height="13" 
          CornerRadius="0" 
          Background="Red"
          BorderThickness="1"
          BorderBrush="#404040">
                                    <Path 
            Width="7" Height="7" 
            x:Name="CheckMark"
            SnapsToDevicePixels="False" 
            Stroke="#404040"
            StrokeThickness="2"
            Data="M 0 0 L 7 7 M 0 7 L 7 0" />
                                </Border>
                            </BulletDecorator.Bullet>
                            <ContentPresenter Margin="4,0,0,0"
        VerticalAlignment="Center"
        HorizontalAlignment="Left"
        RecognizesAccessKey="True"/>
                        </BulletDecorator>
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsChecked" Value="false">
                                <Setter TargetName="CheckMark" Property="Visibility" Value="Collapsed"/>
                            </Trigger>
                            <Trigger Property="IsChecked" Value="{x:Null}">
                                <Setter TargetName="CheckMark" Property="Data" Value="M 0 7 L 7 0" />
                            </Trigger>
                            <Trigger Property="IsMouseOver" Value="true">
                                <Setter TargetName="Border" Property="Background" Value="#808080" />
                            </Trigger>
                            <Trigger Property="IsPressed" Value="true">
                                <Setter TargetName="Border" Property="Background" Value="#E0E0E0" />
                                <Setter TargetName="Border" Property="BorderBrush" Value="#606060" />
                            </Trigger>
                            <Trigger Property="IsEnabled" Value="false">
                                <Setter TargetName="Border" Property="Background" Value="#EEEEEE" />
                                <Setter TargetName="Border" Property="BorderBrush" Value="#AAAAAA" />
                                <Setter Property="Foreground" Value="#888888"/>
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

这将产生如下所示的内容：

您只需将其放在本地 ResourceDictionary 中即可使用此样式，例如：

<Window....

    <Window.Resources>
        <!-- Style Goes Here -->
    </Window.Resources>

    <!-- Your Code -->
</Window>

如果您打算在整个应用程序中使用它，单独的ResourceDictionary 可能会更好。此样式将应用于所有CheckBoxes；如果您希望仅将其应用于少数几个，则应将x:Key="{x:Type CheckBox}" 更改为x:Key="NameOfYourChoice"，并在个人CheckBoxes - Style="{StaticResource ResourceKey=NameOfYourChoice}" 上引用样式

您可以根据自己的喜好设计其余部分。如果您愿意将其用作基础，您实际上可以从 MSDN 中获取默认的 ControlTemplate。

【讨论】：