We Keep Coding

how to create the blue border on checkbox when mouse is over the containing element C# WPF

I have a WrapPanel containing a Label and a CheckBox. The idea is to make the Label and the CheckBox look like 1 element, so when the WrapPanel's MouseLeftButtonUp is fired (weather the event happens on the CheckBox, or the Label), the checkbox inside it becomes checked (or unchecked if it was already checked).
In WPF, when you move your mouse over a CheckBox it gets this blue border. i want it to happen when the mouse goes over any part of the WrapPanel (the Label or the CheckBox itself)
I tried to call the myCheckbox.Focus(); when the MouseEnter for the WrapPanel is fired, but didn't do the trick.
I also saw this link on how to make checkbox focus border apear when calling CheckBox.Focus(), but it didn't answer my question either.
Any help is appreciated.

Modify the template of the CheckBox to use a WrapPanel instead of the default Grid:
<CheckBox>
<TextBlock>Label that wraps with the CheckBox...</TextBlock>
<CheckBox.Style>
<Style TargetType="{x:Type CheckBox}">
<Style.Resources>
<Style x:Key="FocusVisual">
<Setter Property="Control.Template">
<Setter.Value>
<ControlTemplate>
<Rectangle Margin="2" StrokeDashArray="1 2" Stroke="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}" SnapsToDevicePixels="true" StrokeThickness="1"/>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="OptionMarkFocusVisual">
<Setter Property="Control.Template">
<Setter.Value>
<ControlTemplate>
<Rectangle Margin="14,0,0,0" StrokeDashArray="1 2" Stroke="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}" SnapsToDevicePixels="true" StrokeThickness="1"/>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<SolidColorBrush x:Key="OptionMark.Static.Background" Color="#FFFFFFFF"/>
<SolidColorBrush x:Key="OptionMark.Static.Border" Color="#FF707070"/>
<SolidColorBrush x:Key="OptionMark.Static.Glyph" Color="#FF212121"/>
<SolidColorBrush x:Key="OptionMark.MouseOver.Background" Color="#FFF3F9FF"/>
<SolidColorBrush x:Key="OptionMark.MouseOver.Border" Color="#FF5593FF"/>
<SolidColorBrush x:Key="OptionMark.MouseOver.Glyph" Color="#FF212121"/>
<SolidColorBrush x:Key="OptionMark.Pressed.Background" Color="#FFD9ECFF"/>
<SolidColorBrush x:Key="OptionMark.Pressed.Border" Color="#FF3C77DD"/>
<SolidColorBrush x:Key="OptionMark.Pressed.Glyph" Color="#FF212121"/>
<SolidColorBrush x:Key="OptionMark.Disabled.Background" Color="#FFE6E6E6"/>
<SolidColorBrush x:Key="OptionMark.Disabled.Border" Color="#FFBCBCBC"/>
<SolidColorBrush x:Key="OptionMark.Disabled.Glyph" Color="#FF707070"/>
</Style.Resources>
<Setter Property="FocusVisualStyle" Value="{StaticResource FocusVisual}"/>
<Setter Property="Background" Value="{StaticResource OptionMark.Static.Background}"/>
<Setter Property="BorderBrush" Value="{StaticResource OptionMark.Static.Border}"/>
<Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/>
<Setter Property="BorderThickness" Value="1"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type CheckBox}">
<WrapPanel x:Name="templateRoot" Background="Transparent" SnapsToDevicePixels="True">
<Border x:Name="checkBoxBorder" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="1" VerticalAlignment="{TemplateBinding VerticalContentAlignment}">
<Grid x:Name="markGrid">
<Path x:Name="optionMark" Data="F1 M 9.97498,1.22334L 4.6983,9.09834L 4.52164,9.09834L 0,5.19331L 1.27664,3.52165L 4.255,6.08833L 8.33331,1.52588e-005L 9.97498,1.22334 Z " Fill="{StaticResource OptionMark.Static.Glyph}" Margin="1" Opacity="0" Stretch="None"/>
<Rectangle x:Name="indeterminateMark" Fill="{StaticResource OptionMark.Static.Glyph}" Margin="2" Opacity="0"/>
</Grid>
</Border>
<ContentPresenter x:Name="contentPresenter" Focusable="False" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
</WrapPanel>
<ControlTemplate.Triggers>
<Trigger Property="HasContent" Value="true">
<Setter Property="FocusVisualStyle" Value="{StaticResource OptionMarkFocusVisual}"/>
<Setter Property="Padding" Value="4,-1,0,0"/>
</Trigger>
<Trigger Property="IsMouseOver" Value="true">
<Setter Property="Background" TargetName="checkBoxBorder" Value="{StaticResource OptionMark.MouseOver.Background}"/>
<Setter Property="BorderBrush" TargetName="checkBoxBorder" Value="{StaticResource OptionMark.MouseOver.Border}"/>
<Setter Property="Fill" TargetName="optionMark" Value="{StaticResource OptionMark.MouseOver.Glyph}"/>
<Setter Property="Fill" TargetName="indeterminateMark" Value="{StaticResource OptionMark.MouseOver.Glyph}"/>
</Trigger>
<Trigger Property="IsEnabled" Value="false">
<Setter Property="Background" TargetName="checkBoxBorder" Value="{StaticResource OptionMark.Disabled.Background}"/>
<Setter Property="BorderBrush" TargetName="checkBoxBorder" Value="{StaticResource OptionMark.Disabled.Border}"/>
<Setter Property="Fill" TargetName="optionMark" Value="{StaticResource OptionMark.Disabled.Glyph}"/>
<Setter Property="Fill" TargetName="indeterminateMark" Value="{StaticResource OptionMark.Disabled.Glyph}"/>
</Trigger>
<Trigger Property="IsPressed" Value="true">
<Setter Property="Background" TargetName="checkBoxBorder" Value="{StaticResource OptionMark.Pressed.Background}"/>
<Setter Property="BorderBrush" TargetName="checkBoxBorder" Value="{StaticResource OptionMark.Pressed.Border}"/>
<Setter Property="Fill" TargetName="optionMark" Value="{StaticResource OptionMark.Pressed.Glyph}"/>
<Setter Property="Fill" TargetName="indeterminateMark" Value="{StaticResource OptionMark.Pressed.Glyph}"/>
</Trigger>
<Trigger Property="IsChecked" Value="true">
<Setter Property="Opacity" TargetName="optionMark" Value="1"/>
<Setter Property="Opacity" TargetName="indeterminateMark" Value="0"/>
</Trigger>
<Trigger Property="IsChecked" Value="{x:Null}">
<Setter Property="Opacity" TargetName="optionMark" Value="0"/>
<Setter Property="Opacity" TargetName="indeterminateMark" Value="1"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</CheckBox.Style>
</CheckBox>

If you're open to an alternative (simpler) solution, This is how you should do it: define a custom style for the checkbox and override the Template so to get the WrapPanel and whatever controls you want look as part of the CheckBox..
<Style TargetType="{x:Type CheckBox}" x:Key="myCheckboxStyle">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type CheckBox}">
<WrapPanel>
<Label />
<!-- other Controls -->
<ContentPresenter/>
</WrapPanel>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
Apply the custom style to the checkbox
<CheckBox Style="{StaticResource myCheckboxStyle}" Content="Check Me"/>

How to disable a button and change it's color?

I have this code I found on here, that generates me a grid of buttons - I know this may not be the best way to do this, but for now I'd like to do it this way, I am quite new at this. So the button should be either Black(1) or White(0), depending on it's value. This all works, until I hover the button and I can see it's value. If I just add the Visibility property = "false" to the button, it does not even get displayed.
This is my code:
<Window.Resources>
<DataTemplate x:Key="DataTemplate_Level2">
<Button Content="{Binding}" Height="15" Width="15" Margin="1,1,1,1">
<Button.Style>
<Style TargetType="Button">
<Style.Triggers>
<DataTrigger Binding="{Binding}" Value="1">
<Setter Property="Background" Value="Black"/>
<Setter Property="Foreground" Value="Black" />
</DataTrigger>
<DataTrigger Binding="{Binding}" Value="0">
<Setter Property="Background" Value="White"/>
<Setter Property="Foreground" Value="White" />
</DataTrigger>
</Style.Triggers>
</Style>
</Button.Style>
</Button>
</DataTemplate>
<DataTemplate x:Key="DataTemplate_Level1">
<ItemsControl ItemsSource="{Binding}" ItemTemplate="{DynamicResource DataTemplate_Level2}">
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<StackPanel Orientation="Horizontal"/>
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
</ItemsControl>
</DataTemplate>
</Window.Resources>
And then I display the grid here:
<Grid Margin="10,10,10,-636" Grid.Row="3">
<ItemsControl x:Name="automata" ItemTemplate="{DynamicResource DataTemplate_Level1}" Margin="0,0,0,-119"/>
</Grid>
I would also be happy of a recommendation on how to display these values in another way.

If you want to change the appearance or visual states of a control, create a style with a ControlTemplate that fits your requirements. You can also extract the default style using Blen or Visual Studio and adapt it.
In the following, I took the default style with its control template for Button and commented out the triggers for MouseOver, Pressed and other states so they are ineffective, but you still see where to continue since your question certainly is only the starting point for further customization. I adapted and added your triggers to the ControlTemplate. What this does is simply show a black button for 1 and white for 0.
<Style x:Key="MyButtonStyle" TargetType="{x:Type Button}">
<Style.Resources>
<SolidColorBrush x:Key="Button.Static.Background" Color="#FFDDDDDD"/>
<SolidColorBrush x:Key="Button.Static.Border" Color="#FF707070"/>
<SolidColorBrush x:Key="Button.MouseOver.Background" Color="#FFBEE6FD"/>
<SolidColorBrush x:Key="Button.MouseOver.Border" Color="#FF3C7FB1"/>
<SolidColorBrush x:Key="Button.Pressed.Background" Color="#FFC4E5F6"/>
<SolidColorBrush x:Key="Button.Pressed.Border" Color="#FF2C628B"/>
<SolidColorBrush x:Key="Button.Disabled.Background" Color="#FFF4F4F4"/>
<SolidColorBrush x:Key="Button.Disabled.Border" Color="#FFADB2B5"/>
<SolidColorBrush x:Key="Button.Disabled.Foreground" Color="#FF838383"/>
</Style.Resources>
<Setter Property="FocusVisualStyle">
<Setter.Value>
<Style>
<Setter Property="Control.Template">
<Setter.Value>
<ControlTemplate>
<Rectangle Margin="2" StrokeDashArray="1 2" SnapsToDevicePixels="true" StrokeThickness="1" Stroke="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</Setter.Value>
</Setter>
<Setter Property="Background" Value="{StaticResource Button.Static.Background}"/>
<Setter Property="BorderBrush" Value="{StaticResource Button.Static.Border}"/>
<Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/>
<Setter Property="BorderThickness" Value="1"/>
<Setter Property="HorizontalContentAlignment" Value="Center"/>
<Setter Property="VerticalContentAlignment" Value="Center"/>
<Setter Property="Padding" Value="1"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Button}">
<Border x:Name="border" Background="{TemplateBinding Background}" BorderThickness="{TemplateBinding BorderThickness}" BorderBrush="{TemplateBinding BorderBrush}" SnapsToDevicePixels="true">
<ContentPresenter x:Name="contentPresenter" Focusable="False" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
</Border>
<ControlTemplate.Triggers>
<!-- These are the default triggers, which you might customize to fit your style. -->
<!--<Trigger Property="IsDefaulted" Value="true">
<Setter Property="BorderBrush" TargetName="border" Value="{DynamicResource {x:Static SystemColors.HighlightBrushKey}}"/>
</Trigger>
<Trigger Property="IsMouseOver" Value="true">
<Setter Property="Background" TargetName="border" Value="{StaticResource Button.MouseOver.Background}"/>
<Setter Property="BorderBrush" TargetName="border" Value="{StaticResource Button.MouseOver.Border}"/>
</Trigger>
<Trigger Property="IsPressed" Value="true">
<Setter Property="Background" TargetName="border" Value="{StaticResource Button.Pressed.Background}"/>
<Setter Property="BorderBrush" TargetName="border" Value="{StaticResource Button.Pressed.Border}"/>
</Trigger>
<Trigger Property="IsEnabled" Value="false">
<Setter Property="Background" TargetName="border" Value="{StaticResource Button.Disabled.Background}"/>
<Setter Property="BorderBrush" TargetName="border" Value="{StaticResource Button.Disabled.Border}"/>
<Setter Property="TextElement.Foreground" TargetName="contentPresenter" Value="{StaticResource Button.Disabled.Foreground}"/>
</Trigger>-->
<!-- These are your triggers, which now act on the Content property of the templated button. -->
<DataTrigger Binding="{Binding Content, RelativeSource={RelativeSource TemplatedParent}}" Value="1">
<Setter Property="Background" Value="Black"/>
<Setter Property="Foreground" Value="Black" />
</DataTrigger>
<DataTrigger Binding="{Binding Content, RelativeSource={RelativeSource TemplatedParent}}" Value="0">
<Setter Property="Background" Value="White"/>
<Setter Property="Foreground" Value="White" />
</DataTrigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
Use this style in your data template and you should get the expected result.
<DataTemplate x:Key="DataTemplate_Level2">
<Button Content="{Binding}" Height="15" Width="15" Margin="1,1,1,1" Style="{DynamicResource MyButtonStyle}"/>
</DataTemplate>
Since you try to make the text 1 and 0 invisible by setting the background and foreground to the same color, you could also simply remove the ContentPresenter from the ControlTemplate, so there is no content displayed at all and the Foreground setters are not needed.
Another thing to note is that your binary state maybe suggests to use a ToggleButton instead.
Base class for controls that can switch states, such as CheckBox.
This is an example style for a ToggleButton that does not show content and sets the background like in your question, but dependening on its IsChecked property.
<Style x:Key="MyToggleButtonStyle" TargetType="{x:Type ToggleButton}">
<Style.Resources>
<SolidColorBrush x:Key="Button.Static.Background" Color="#FFDDDDDD"/>
<SolidColorBrush x:Key="Button.Static.Border" Color="#FF707070"/>
</Style.Resources>
<Setter Property="FocusVisualStyle">
<Setter.Value>
<Style>
<Setter Property="Control.Template">
<Setter.Value>
<ControlTemplate>
<Rectangle Margin="2" StrokeDashArray="1 2" SnapsToDevicePixels="true" StrokeThickness="1" Stroke="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</Setter.Value>
</Setter>
<Setter Property="Background" Value="{StaticResource Button.Static.Background}"/>
<Setter Property="BorderBrush" Value="{StaticResource Button.Static.Border}"/>
<Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/>
<Setter Property="BorderThickness" Value="1"/>
<Setter Property="HorizontalContentAlignment" Value="Center"/>
<Setter Property="VerticalContentAlignment" Value="Center"/>
<Setter Property="Padding" Value="1"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type ToggleButton}">
<Border x:Name="border" Background="{TemplateBinding Background}" BorderThickness="{TemplateBinding BorderThickness}" BorderBrush="{TemplateBinding BorderBrush}" SnapsToDevicePixels="true"/>
<ControlTemplate.Triggers>
<Trigger Property="IsChecked" Value="True">
<Setter Property="Background" Value="Black"/>
</Trigger>
<Trigger Property="IsChecked" Value="False">
<Setter Property="Background" Value="White"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
Change the binding in your data template from Content to IsChecked.
<DataTemplate x:Key="DataTemplate_Level2">
<ToggleButton IsChecked="{Binding}" Height="15" Width="15" Margin="1,1,1,1" Style="{DynamicResource MyToggleButtonStyle}"/>
</DataTemplate>
This buys you the advantage of toggling the states automatically, but only if you can provide a property for two-way binding (getter and setter), otherwise an exception will be thrown.

How can I trigger style to ContentPresenters inside

I want to trigger style to ContentPresenter's items.
How can I do it?
I have template like this. (almost default button style)
<Style x:Key="ImageButtonStyle2" TargetType="{x:Type Button}">
<Setter Property="FocusVisualStyle" Value="{StaticResource FocusVisual}"/>
<Setter Property="Background" Value="{StaticResource Button.Static.Background3}"/>
<Setter Property="BorderBrush" Value="{StaticResource Button.Static.Border3}"/>
<Setter Property="Foreground" Value="{StaticResource Button.Static.Foreground3}"/>
<Setter Property="BorderThickness" Value="1"/>
<Setter Property="HorizontalContentAlignment" Value="Center"/>
<Setter Property="VerticalContentAlignment" Value="Center"/>
<Setter Property="Padding" Value="1"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Button}">
<Border x:Name="border" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" SnapsToDevicePixels="true">
<ContentPresenter x:Name="contentPresenter" Focusable="False" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
</Border>
<ControlTemplate.Triggers>
<Trigger Property="IsDefaulted" Value="true">
<Setter Property="BorderBrush" TargetName="border" Value="{StaticResource Button.Static.Foreground3}"/>
</Trigger>
<Trigger Property="IsMouseOver" Value="true">
<Setter Property="Background" TargetName="border" Value="{StaticResource Button.MouseOver.Background3}"/>
<Setter Property="BorderBrush" TargetName="border" Value="{StaticResource Button.MouseOver.Border3}"/>
</Trigger>
<Trigger Property="IsPressed" Value="true">
<Setter Property="Background" TargetName="border" Value="{StaticResource Button.Pressed.Background3}"/>
<Setter Property="BorderBrush" TargetName="border" Value="{StaticResource Button.Pressed.Border3}"/>
</Trigger>
<Trigger Property="IsEnabled" Value="false">
<Setter Property="Background" TargetName="border" Value="{StaticResource Button.Disabled.Background3}"/>
<Setter Property="BorderBrush" TargetName="border" Value="{StaticResource Button.Disabled.Border3}"/>
<Setter Property="TextElement.Foreground" TargetName="contentPresenter" Value="{StaticResource Button.Disabled.Foreground3}"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
And, I'm using button like this.
<Button x:Name="ImageButton2" Style="{DynamicResource ImageButtonStyle2}">
<StackPanel Orientation="Vertical">
<Viewbox Width="48.000" Height="30.000">
<Canvas Width="48.000" Height="30.000">
<Path Fill="..." Data="..." />
</Canvas>
</Viewbox>
<TextBlock Text="XXX"/>
</StackPanel>
</Button>
When disabling button, I want to change the Fill, Foreground and Background color of Path and TextBlock items.
I was thinking to write a Setter tag to the Trigger "IsEnable" tag... but I'm stuck with that.
Is there any good way to do that?

If you want the same Background color of Button to reflect in your Path and TextBlock, You can Bind Background property of Button to Path's Fill and TextBlock's Foreground property.
<Button x:Name="ImageButton2" Height="30" Width="100">
<StackPanel Orientation="Vertical">
<Viewbox Width="48.000" Height="30.000">
<Canvas Width="48.000" Height="30.000">
<Path Fill="{Binding Path=Background, RelativeSource={RelativeSource AncestorType=Button}}"
Data="..." />
</Canvas>
</Viewbox>
<TextBlock Foreground="{Binding Path=Background, RelativeSource={RelativeSource AncestorType=Button}}"
Text="XXX"/>
</StackPanel>
</Button>
Or
If you are looking for different Backgroud, you can try setting Foreground using separate Triggers. Like,
<TextBlock Text="XXX">
<TextBlock.Style>
<Style TargetType="TextBlock">
<Setter Property="Foreground" Value="Green"/>
<Style.Triggers>
<DataTrigger Binding="{Binding IsEnabled, RelativeSource={RelativeSource AncestorType=Button}}"
Value="False">
<Setter Property="Foreground" Value="Red"/>
</DataTrigger>
</Style.Triggers>
</Style>
</TextBlock.Style>
</TextBlock>

How do I change the colour of a WPF Checkbox tick?

I would like to change the colour of the tick in my WPF CheckBox from black to white. I have tried to do this in the CheckBoxdeclaration as such:
<CheckBox Background="black" Foreground="White" BorderBrush="#262626"/>
The background and border successfully change, but not the tick itself.

You could copy the entire checkbox style from the MSDN server but because its very confusing to work with in the beginning of any WPF carreer, I compiled the (in my opinion) neccessary bits into one style thats a little easier to understand:
<Style TargetType="{x:Type CheckBox}">
<Setter Property="Background" Value="White" />
<Setter Property="BorderBrush" Value="#FF262E34"/>
<Setter Property="Foreground" Value="#FF262E34"/>
<Setter Property="BorderThickness" Value="1"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type CheckBox}">
<StackPanel Orientation="Horizontal" HorizontalAlignment="Stretch" >
<Border BorderBrush="{TemplateBinding BorderBrush}" Background="{TemplateBinding Background}" BorderThickness="{TemplateBinding BorderThickness}" Width="15" Height="15">
<!-- your color here -->
<Path Stretch="Uniform" Width="15" Height="10" Fill="HotPink" Name="eliCheck" Data="F1 M 9.97498,1.22334L 4.6983,9.09834L 4.52164,9.09834L 0,5.19331L 1.27664,3.52165L 4.255,6.08833L 8.33331,1.52588e-005L 9.97498,1.22334 Z " Visibility="Collapsed"/>
</Border>
<TextBlock Margin="5,0,0,0" VerticalAlignment="Center" Foreground="{TemplateBinding Foreground}" Text="{TemplateBinding Content}"></TextBlock>
</StackPanel>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Background" Value="LightGray" />
</Trigger>
<Trigger Property="IsPressed" Value="True">
<Setter Property="Background" Value="#FF9C9E9F" />
</Trigger>
<Trigger Property="IsEnabled" Value="False">
<Setter Property="Background" Value="LightGray" />
<Setter Property="Foreground" Value="Gray" />
<Setter Property="BorderBrush" Value="Gray"/>
<Setter TargetName="eliCheck" Property="Opacity" Value="0.5" />
</Trigger>
<Trigger Property="IsChecked" Value="True">
<Setter TargetName="eliCheck" Property="Visibility" Value="Visible"></Setter>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>

The CheckBox control has various visual states with different colors for background, border and option mark glyph. You can refer to the documentation for the required parts and visual states.
If you want to edit the colors, you have to change the default style and control template. You can extract it using Blend or Visual Studio. Below is the default template. What you need to do is copy these resources to a resource dictionary in scope, e.g. the application resources and adapt the SolidColorBurshes.
<SolidColorBrush x:Key="OptionMark.Static.Background" Color="#FFFFFFFF"/>
<SolidColorBrush x:Key="OptionMark.Static.Border" Color="#FF707070"/>
<SolidColorBrush x:Key="OptionMark.Static.Glyph" Color="#FF212121"/>
<SolidColorBrush x:Key="OptionMark.MouseOver.Background" Color="#FFF3F9FF"/>
<SolidColorBrush x:Key="OptionMark.MouseOver.Border" Color="#FF5593FF"/>
<SolidColorBrush x:Key="OptionMark.MouseOver.Glyph" Color="#FF212121"/>
<SolidColorBrush x:Key="OptionMark.Pressed.Background" Color="#FFD9ECFF"/>
<SolidColorBrush x:Key="OptionMark.Pressed.Border" Color="#FF3C77DD"/>
<SolidColorBrush x:Key="OptionMark.Pressed.Glyph" Color="#FF212121"/>
<SolidColorBrush x:Key="OptionMark.Disabled.Background" Color="#FFE6E6E6"/>
<SolidColorBrush x:Key="OptionMark.Disabled.Border" Color="#FFBCBCBC"/>
<SolidColorBrush x:Key="OptionMark.Disabled.Glyph" Color="#FF707070"/>
<Style x:Key="FocusVisual">
<Setter Property="Control.Template">
<Setter.Value>
<ControlTemplate>
<Rectangle Margin="2"
SnapsToDevicePixels="true"
Stroke="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"
StrokeDashArray="1 2"
StrokeThickness="1" />
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="OptionMarkFocusVisual">
<Setter Property="Control.Template">
<Setter.Value>
<ControlTemplate>
<Rectangle Margin="14,0,0,0"
SnapsToDevicePixels="true"
Stroke="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"
StrokeDashArray="1 2"
StrokeThickness="1" />
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="CheckBoxStyle"
TargetType="{x:Type CheckBox}">
<Setter Property="FocusVisualStyle"
Value="{StaticResource FocusVisual}" />
<Setter Property="Background"
Value="{StaticResource OptionMark.Static.Background}" />
<Setter Property="BorderBrush"
Value="{StaticResource OptionMark.Static.Border}" />
<Setter Property="Foreground"
Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}" />
<Setter Property="BorderThickness"
Value="1" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type CheckBox}">
<Grid x:Name="templateRoot"
Background="Transparent"
SnapsToDevicePixels="True">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Border x:Name="checkBoxBorder"
Margin="1"
HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
Background="{TemplateBinding Background}"
BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="{TemplateBinding BorderThickness}">
<Grid x:Name="markGrid">
<Path x:Name="optionMark"
Margin="1"
Data="F1 M 9.97498,1.22334L 4.6983,9.09834L 4.52164,9.09834L 0,5.19331L 1.27664,3.52165L 4.255,6.08833L 8.33331,1.52588e-005L 9.97498,1.22334 Z "
Fill="{StaticResource OptionMark.Static.Glyph}"
Opacity="0"
Stretch="None" />
<Rectangle x:Name="indeterminateMark"
Margin="2"
Fill="{StaticResource OptionMark.Static.Glyph}"
Opacity="0" />
</Grid>
</Border>
<ContentPresenter x:Name="contentPresenter"
Grid.Column="1"
Margin="{TemplateBinding Padding}"
HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
Focusable="False"
RecognizesAccessKey="True"
SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" />
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="HasContent"
Value="true">
<Setter Property="FocusVisualStyle"
Value="{StaticResource OptionMarkFocusVisual}" />
<Setter Property="Padding"
Value="4,-1,0,0" />
</Trigger>
<Trigger Property="IsMouseOver"
Value="true">
<Setter TargetName="checkBoxBorder"
Property="Background"
Value="{StaticResource OptionMark.MouseOver.Background}" />
<Setter TargetName="checkBoxBorder"
Property="BorderBrush"
Value="{StaticResource OptionMark.MouseOver.Border}" />
<Setter TargetName="optionMark"
Property="Fill"
Value="{StaticResource OptionMark.MouseOver.Glyph}" />
<Setter TargetName="indeterminateMark"
Property="Fill"
Value="{StaticResource OptionMark.MouseOver.Glyph}" />
</Trigger>
<Trigger Property="IsEnabled"
Value="false">
<Setter TargetName="checkBoxBorder"
Property="Background"
Value="{StaticResource OptionMark.Disabled.Background}" />
<Setter TargetName="checkBoxBorder"
Property="BorderBrush"
Value="{StaticResource OptionMark.Disabled.Border}" />
<Setter TargetName="optionMark"
Property="Fill"
Value="{StaticResource OptionMark.Disabled.Glyph}" />
<Setter TargetName="indeterminateMark"
Property="Fill"
Value="{StaticResource OptionMark.Disabled.Glyph}" />
</Trigger>
<Trigger Property="IsPressed"
Value="true">
<Setter TargetName="checkBoxBorder"
Property="Background"
Value="{StaticResource OptionMark.Pressed.Background}" />
<Setter TargetName="checkBoxBorder"
Property="BorderBrush"
Value="{StaticResource OptionMark.Pressed.Border}" />
<Setter TargetName="optionMark"
Property="Fill"
Value="{StaticResource OptionMark.Pressed.Glyph}" />
<Setter TargetName="indeterminateMark"
Property="Fill"
Value="{StaticResource OptionMark.Pressed.Glyph}" />
</Trigger>
<Trigger Property="IsChecked"
Value="true">
<Setter TargetName="optionMark"
Property="Opacity"
Value="1" />
<Setter TargetName="indeterminateMark"
Property="Opacity"
Value="0" />
</Trigger>
<Trigger Property="IsChecked"
Value="{x:Null}">
<Setter TargetName="optionMark"
Property="Opacity"
Value="0" />
<Setter TargetName="indeterminateMark"
Property="Opacity"
Value="1" />
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
Since there are different colors for the Static, MouseOver, Pressed and Disabled states, you might have to derive a small color palette from your background, border and foreground colors.
In order to use the adapted check box style, you can reference it explicitly by key:
<CheckBox Style="{StaticResource CheckBoxStyle}" />
You can also define an implicit style like below after the other resources, so the style will automatically be applied to all CheckBoxes in scope of the containing resource dictionary.
<Style TargetType="{x:Type CheckBox}" BasedOn="{StaticResource CheckBoxStyle}"/>
In this case you do not reference the style explicitly anymore.
<CheckBox />

Change button property when IsEnabled change in wpf

I have a button in my view with style in staticResource. I have IsEnabled bind to a bool in my viewmodel and want to change background when is disable.
I tried to use Style.Triggers on IsEnabled = false but this don't change the background.
Styles.xaml
<Style x:Key="buttonNegative" TargetType="Button">
<Style.Triggers>
<Trigger Property="IsEnabled" Value="False">
<Setter Property="Background" Value="Green"/>
</Trigger>
</Style.Triggers>
</Style>
view.xaml
<Button Style="{StaticResource buttonNegative}" Command="{Binding InversionAxis_Command}" IsEnabled="{Binding SettingsButtonIsEnable}">
<TextBlock Text="{Binding Orientation}"/>
</Button>
viewModel.cs
private bool _settingsButtonIsEnable;
public bool SettingsButtonIsEnable
{
get { return _settingsButtonIsEnable; }
set
{
if (Equals(value, _settingsButtonIsEnable)) return;
_settingsButtonIsEnable = value;
RaisePropertyChanged();
}
}
public ICommand InversionAxis_Command
{
get { return new RelayCommand(InversionAxis, IsSettingsButtonIsEnable); }
}
private bool IsSettingsButtonIsEnable()
{
return _settingsButtonIsEnable;
}
The command was not execute because I use canExecute but the style not changing when SettingsButtonIsEnable change

It's more complicated to change the disabled background than adding a trigger to the style. You'll have to define a custom ControlTemplate:
<Style x:Key="buttonNegative" TargetType="Button">
<Style.Resources>
<Style x:Key="FocusVisual">
<Setter Property="Control.Template">
<Setter.Value>
<ControlTemplate>
<Rectangle Margin="2" SnapsToDevicePixels="true" Stroke="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}" StrokeThickness="1" StrokeDashArray="1 2"/>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<SolidColorBrush x:Key="Button.Static.Background" Color="#FFDDDDDD"/>
<SolidColorBrush x:Key="Button.Static.Border" Color="#FF707070"/>
<SolidColorBrush x:Key="Button.MouseOver.Background" Color="#FFBEE6FD"/>
<SolidColorBrush x:Key="Button.MouseOver.Border" Color="#FF3C7FB1"/>
<SolidColorBrush x:Key="Button.Pressed.Background" Color="#FFC4E5F6"/>
<SolidColorBrush x:Key="Button.Pressed.Border" Color="#FF2C628B"/>
<SolidColorBrush x:Key="Button.Disabled.Background" Color="Green"/>
<SolidColorBrush x:Key="Button.Disabled.Border" Color="#FFADB2B5"/>
<SolidColorBrush x:Key="Button.Disabled.Foreground" Color="#FF838383"/>
</Style.Resources>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Button}">
<Border x:Name="border" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" SnapsToDevicePixels="true">
<ContentPresenter x:Name="contentPresenter" Focusable="False" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
</Border>
<ControlTemplate.Triggers>
<Trigger Property="IsDefaulted" Value="true">
<Setter Property="BorderBrush" TargetName="border" Value="{DynamicResource {x:Static SystemColors.HighlightBrushKey}}"/>
</Trigger>
<Trigger Property="IsMouseOver" Value="true">
<Setter Property="Background" TargetName="border" Value="{StaticResource Button.MouseOver.Background}"/>
<Setter Property="BorderBrush" TargetName="border" Value="{StaticResource Button.MouseOver.Border}"/>
</Trigger>
<Trigger Property="IsPressed" Value="true">
<Setter Property="Background" TargetName="border" Value="{StaticResource Button.Pressed.Background}"/>
<Setter Property="BorderBrush" TargetName="border" Value="{StaticResource Button.Pressed.Border}"/>
</Trigger>
<Trigger Property="IsEnabled" Value="false">
<Setter Property="Background" TargetName="border" Value="{StaticResource Button.Disabled.Background}"/>
<Setter Property="BorderBrush" TargetName="border" Value="{StaticResource Button.Disabled.Border}"/>
<Setter Property="TextElement.Foreground" TargetName="contentPresenter" Value="{StaticResource Button.Disabled.Foreground}"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
The default disabled background is hardcoded into the default template and cannot be overridden with a style setter.