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

时间:2021-09-25 21:04:31

I am trying to figure out how to bind the background color of the content for a checkbox. Here is the code I have, of course the background setting just changes the color of the checkbox not the color behind the text.

我试图找出如何绑定内容的背景颜色的复选框。这是我的代码,当然背景设置只是改变复选框的颜色而不是文本背后的颜色。

        <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>

2 个解决方案

#1


6  

Try this:

<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>

#2


1  

I don't think you're able to style the background of a CheckBox without using your own ControlTemplate instead of the default one.

我不认为你可以在不使用自己的ControlTemplate而不是默认的ControlTemplate的情况下设置CheckBox的背景。

Tou could use a ControlTemplate along these lines (I've just grabbed the basic template from Kaxaml) - I've made the background Red - you'll want to replace that with your {Binding color}

Tou可以沿着这些线使用ControlTemplate(我刚刚从Kaxaml中获取了基本模板) - 我已经将背景设置为红色 - 你将要用你的{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>

Which will produce something that looks like this: 如何通过在WPF中绑定来设置复选框内容的背景颜色

这会产生如下所示的东西:

You can use this style simply by placing it within a local ResourceDictionary e.g:

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

<Window....

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

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

Although it may be better off in a separate ResourceDictionary, if you intend to use throughout your application. This style will be applied to all CheckBoxes; if you wish to apply it to only a select few, you should change the x:Key="{x:Type CheckBox}" to x:Key="NameOfYourChoice", and reference the style on individual CheckBoxes - Style="{StaticResource ResourceKey=NameOfYourChoice}"

虽然在单独的ResourceDictionary中可能会更好,但如果您打算在整个应用程序中使用它。此样式将应用于所有CheckBoxes;如果你只希望将它应用于少数几个,你应该将x:Key =“{x:Type CheckBox}”更改为x:Key =“NameOfYourChoice”,并引用单个CheckBoxes上的样式 - Style =“{StaticResource的ResourceKey = NameOfYourChoice}”

You can style the rest to your liking. You can actually grab the default ControlTemplate from MSDN if you'd prefer to use that as a basis.

您可以根据自己的喜好设计其余部分。实际上,如果您希望以此为基础,可以从MSDN获取默认的ControlTemplate。

#1


6  

Try this:

<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>

#2


1  

I don't think you're able to style the background of a CheckBox without using your own ControlTemplate instead of the default one.

我不认为你可以在不使用自己的ControlTemplate而不是默认的ControlTemplate的情况下设置CheckBox的背景。

Tou could use a ControlTemplate along these lines (I've just grabbed the basic template from Kaxaml) - I've made the background Red - you'll want to replace that with your {Binding color}

Tou可以沿着这些线使用ControlTemplate(我刚刚从Kaxaml中获取了基本模板) - 我已经将背景设置为红色 - 你将要用你的{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>

Which will produce something that looks like this: 如何通过在WPF中绑定来设置复选框内容的背景颜色

这会产生如下所示的东西:

You can use this style simply by placing it within a local ResourceDictionary e.g:

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

<Window....

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

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

Although it may be better off in a separate ResourceDictionary, if you intend to use throughout your application. This style will be applied to all CheckBoxes; if you wish to apply it to only a select few, you should change the x:Key="{x:Type CheckBox}" to x:Key="NameOfYourChoice", and reference the style on individual CheckBoxes - Style="{StaticResource ResourceKey=NameOfYourChoice}"

虽然在单独的ResourceDictionary中可能会更好,但如果您打算在整个应用程序中使用它。此样式将应用于所有CheckBoxes;如果你只希望将它应用于少数几个,你应该将x:Key =“{x:Type CheckBox}”更改为x:Key =“NameOfYourChoice”,并引用单个CheckBoxes上的样式 - Style =“{StaticResource的ResourceKey = NameOfYourChoice}”

You can style the rest to your liking. You can actually grab the default ControlTemplate from MSDN if you'd prefer to use that as a basis.

您可以根据自己的喜好设计其余部分。实际上,如果您希望以此为基础,可以从MSDN获取默认的ControlTemplate。