We Keep Coding

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 to remove the line between the content and the arrow in combobox control?

I have a combobox with below design.
But now I want to make it look like this, no seperate line with the arrow.
How can I achieve this?
I have customized a style for ComboBox, here is my code for style:
<Style x:Key="ComboBoxStyle" TargetType="{x:Type ComboBox}">
<Setter Property="FocusVisualStyle" Value="{x:Null}"/>
<Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.WindowTextBrushKey}}"/>
<Setter Property="Background" Value="{DynamicResource {x:Static SystemColors.WindowBrushKey}}"/>
<Setter Property="BorderBrush" Value="{DynamicResource {x:Static SystemColors.WindowBrushKey}}"/>
<Setter Property="BorderThickness" Value="1"/>
<Setter Property="Margin" Value="1,0"/>
<Setter Property="Padding" Value="0"/>
<Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto"/>
<Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto"/>
<Setter Property="ScrollViewer.CanContentScroll" Value="True"/>
<Setter Property="ScrollViewer.PanningMode" Value="Both"/>
<Setter Property="Stylus.IsFlicksEnabled" Value="False"/>
<Setter Property="HorizontalAlignment" Value="Center"/>
<Setter Property="VerticalAlignment" Value="Center"/>
<Setter Property="MinHeight" Value="18"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type ComboBox}">
<Grid SnapsToDevicePixels="True">
<Grid Grid.IsSharedSizeScope="True">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition SharedSizeGroup="ComboBoxButton" Width="Auto"/>
</Grid.ColumnDefinitions>
<Border x:Name="Background" Background="{TemplateBinding Background}"/>
<Border x:Name="SelectedContentBorder" Margin="2,2,1,2">
<ContentPresenter x:Name="ContentSite" ContentTemplate="{TemplateBinding SelectionBoxItemTemplate}" Content="{TemplateBinding SelectionBoxItem}" Margin="{TemplateBinding Padding}" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="Center"/>
</Border>
<Border x:Name="Border" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Grid.ColumnSpan="2"/>
<ToggleButton x:Name="DropDownButton" BorderBrush="LightGray" BorderThickness="1" Grid.ColumnSpan="2" IsChecked="{Binding IsDropDownOpen, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}">
<ToggleButton.Style>
<Style TargetType="{x:Type ToggleButton}">
<Setter Property="MinWidth" Value="0"/>
<Setter Property="MinHeight" Value="0"/>
<Setter Property="Width" Value="Auto"/>
<Setter Property="Background" Value="Transparent"/>
<Setter Property="Focusable" Value="False"/>
<Setter Property="ClickMode" Value="Press"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type ToggleButton}">
<Grid Background="Transparent">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition SharedSizeGroup="ComboBoxButton" Width="Auto"/>
</Grid.ColumnDefinitions>
<Border x:Name="Chrome" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" Grid.Column="1" SnapsToDevicePixels="True" Width="13">
<Path x:Name="ArrowDownPath" Data="M 0 0 L 5 5 L 10 0" Fill="Black" VerticalAlignment="Center"/>
</Border>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsEnabled" Value="False">
<Setter Property="BorderBrush" TargetName="Chrome" Value="{x:Null}"/>
</Trigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsMouseOver" Value="True"/>
<Condition Property="IsChecked" Value="False"/>
</MultiTrigger.Conditions>
<Setter Property="Background" TargetName="Chrome" Value="#FFC2E0FF"/>
</MultiTrigger>
<Trigger Property="IsChecked" Value="True">
<Setter Property="BorderBrush" TargetName="Chrome" Value="#FF3399FF"/>
</Trigger>
<Trigger Property="IsPressed" Value="True">
<Setter Property="Background" TargetName="Chrome" Value="#FF99CCFF"/>
</Trigger>
<Trigger Property="IsEnabled" Value="False">
<Setter Property="Fill" TargetName="ArrowDownPath" Value="#FFB5B2B5"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</ToggleButton.Style>
</ToggleButton>
<TextBox x:Name="PART_EditableTextBox" IsReadOnly="{Binding IsReadOnly, RelativeSource={RelativeSource TemplatedParent}}" Margin="1,1,0,1" MinHeight="18" Padding="{TemplateBinding Padding}" Visibility="Collapsed" VerticalAlignment="Center">
<TextBox.Style>
<Style TargetType="{x:Type TextBox}">
<Setter Property="OverridesDefaultStyle" Value="True"/>
<Setter Property="AllowDrop" Value="True"/>
<Setter Property="MinWidth" Value="0"/>
<Setter Property="MinHeight" Value="0"/>
<Setter Property="FocusVisualStyle" Value="{x:Null}"/>
<Setter Property="ScrollViewer.PanningMode" Value="VerticalFirst"/>
<Setter Property="Stylus.IsFlicksEnabled" Value="False"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type TextBox}">
<ScrollViewer x:Name="PART_ContentHost" Background="Transparent" Focusable="False" HorizontalScrollBarVisibility="Hidden" VerticalScrollBarVisibility="Hidden"/>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</TextBox.Style>
</TextBox>
</Grid>
<Popup x:Name="PART_Popup" AllowsTransparency="True" Focusable="False" IsOpen="{Binding IsDropDownOpen, RelativeSource={RelativeSource TemplatedParent}}" PopupAnimation="{DynamicResource {x:Static SystemParameters.ComboBoxPopupAnimationKey}}" Placement="Bottom">
<Themes:SystemDropShadowChrome x:Name="Shdw" Color="Transparent" MaxHeight="{TemplateBinding MaxDropDownHeight}" MinWidth="{TemplateBinding ActualWidth}">
<Border x:Name="DropDownBorder" BorderBrush="Gray" BorderThickness="1" Background="{TemplateBinding Background}">
<ScrollViewer x:Name="DropDownScrollViewer">
<Grid RenderOptions.ClearTypeHint="Enabled">
<Canvas HorizontalAlignment="Left" Height="0" VerticalAlignment="Top" Width="0">
<Rectangle x:Name="OpaqueRect" Fill="{Binding Background, ElementName=DropDownBorder}" Height="{Binding ActualHeight, ElementName=DropDownBorder}" Width="{Binding ActualWidth, ElementName=DropDownBorder}"/>
</Canvas>
<ItemsPresenter x:Name="ItemsPresenter" KeyboardNavigation.DirectionalNavigation="Contained"/>
</Grid>
</ScrollViewer>
</Border>
</Themes:SystemDropShadowChrome>
</Popup>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsEnabled" Value="False">
<Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/>
<Setter Property="Background" TargetName="Background" Value="#FFF7F7F7"/>
<Setter Property="Grid.ColumnSpan" TargetName="Background" Value="2"/>
<Setter Property="BorderBrush" TargetName="Border" Value="#FFB5B2B5"/>
</Trigger>
<Trigger Property="IsEnabled" Value="True">
<Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/>
<Setter Property="Background" TargetName="Background" Value="White"/>
<Setter Property="Grid.ColumnSpan" TargetName="Background" Value="2"/>
<Setter Property="BorderBrush" TargetName="Border" Value="LightGray"/>
</Trigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsKeyboardFocusWithin" Value="True"/>
<Condition Property="IsDropDownOpen" Value="False"/>
<Condition Property="IsEditable" Value="False"/>
</MultiTrigger.Conditions>
<Setter Property="Background" TargetName="SelectedContentBorder" Value="{DynamicResource {x:Static SystemColors.HighlightBrushKey}}"/>
</MultiTrigger>
<Trigger Property="IsEditable" Value="True">
<Setter Property="Background" TargetName="DropDownButton" Value="{x:Null}"/>
<Setter Property="Visibility" TargetName="ContentSite" Value="Collapsed"/>
<Setter Property="Visibility" TargetName="PART_EditableTextBox" Value="Visible"/>
</Trigger>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="BorderBrush" TargetName="DropDownButton" Value="#FF3399FF"/>
<Setter Property="Background" TargetName="DropDownButton" Value="#FFC2E0FF"/>
<Setter Property="BorderBrush" TargetName="Border" Value="#FF3399FF"/>
</Trigger>
<Trigger Property="IsKeyboardFocusWithin" Value="True">
<Setter Property="BorderBrush" TargetName="DropDownButton" Value="#FF3399FF"/>
<Setter Property="Background" TargetName="DropDownButton" Value="#FFC2E0FF"/>
<Setter Property="BorderBrush" TargetName="Border" Value="#FF3399FF"/>
</Trigger>
<Trigger Property="HasDropShadow" SourceName="PART_Popup" Value="True">
<Setter Property="Margin" TargetName="Shdw" Value="0,0,5,5"/>
<Setter Property="SnapsToDevicePixels" TargetName="Shdw" Value="True"/>
<Setter Property="Color" TargetName="Shdw" Value="#71000000"/>
</Trigger>
<Trigger Property="HasItems" Value="False">
<Setter Property="MinHeight" TargetName="DropDownBorder" Value="95"/>
</Trigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsGrouping" Value="True"/>
<Condition Property="VirtualizingPanel.IsVirtualizingWhenGrouping" Value="False"/>
</MultiTrigger.Conditions>
<Setter Property="ScrollViewer.CanContentScroll" Value="False"/>
</MultiTrigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsKeyboardFocusWithin" Value="True"/>
<Condition Property="IsDropDownOpen" Value="False"/>
<Condition Property="IsEditable" Value="False"/>
</MultiTrigger.Conditions>
<Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.HighlightTextBrushKey}}"/>
</MultiTrigger>
<Trigger Property="IsEditable" Value="True">
<Setter Property="Padding" Value="2"/>
<Setter Property="IsTabStop" Value="False"/>
</Trigger>
<Trigger Property="CanContentScroll" SourceName="DropDownScrollViewer" Value="False">
<Setter Property="Canvas.Top" TargetName="OpaqueRect" Value="{Binding VerticalOffset, ElementName=DropDownScrollViewer}"/>
<Setter Property="Canvas.Left" TargetName="OpaqueRect" Value="{Binding HorizontalOffset, ElementName=DropDownScrollViewer}"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
Sorry for lack of information.

<ToggleButton x:Name="DropDownButton" BorderBrush="LightGray" BorderThickness="1"
This is probably the issue causing line of code.
Change it to below code or whatever you need. It should work.
<ToggleButton x:Name="DropDownButton" BorderBrush="Transparent" BorderThickness="0"

WPF - C# - ComboBox/ComboBoxItem: How to stretch text to fill combobox area

I am programmatically adding ComboBoxes and ComboBox Items. I have a custom ComboBox Style implemented. Everything is fine except the text for each combo box item will not stretch to fill the combobox area. I can get this automatic stretching to work fine with labels and buttons using this bit of XAML in the Custom Style of the button and label controls but it does not have any effect in the ComboBoxItem control.
<Setter Property="ContentTemplate">
<Setter.Value>
<DataTemplate>
<Viewbox Stretch="Fill">
<ContentPresenter Content="{TemplateBinding Content}"/>
</Viewbox>
</DataTemplate>
</Setter.Value>
</Setter>
Since I am not adding the ComboBoxes in XAML, a solution that involves adding a custom TextBlock will not work (unless it is done dynamically/programmatically). The solution has to either be done in the custom style, or done programmatically in the code behind.
<!--ComboBox Template-->
<ControlTemplate x:Key="ComboBoxTemplate" TargetType="{x:Type ComboBox}">
<Grid x:Name="templateRoot" SnapsToDevicePixels="true">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition MinWidth="{DynamicResource {x:Static SystemParameters.VerticalScrollBarWidthKey}}" Width="0"/>
</Grid.ColumnDefinitions>
<Popup x:Name="PART_Popup" AllowsTransparency="true" Grid.ColumnSpan="2" IsOpen="{Binding IsDropDownOpen, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}" Margin="1"
PopupAnimation="{DynamicResource {x:Static SystemParameters.ComboBoxPopupAnimationKey}}" Placement="Bottom">
<Themes:SystemDropShadowChrome x:Name="shadow" Color="Transparent" MaxHeight="{TemplateBinding MaxDropDownHeight}" MinWidth="{Binding ActualWidth, ElementName=templateRoot}">
<Border x:Name="dropDownBorder" BorderBrush="{StaticResource backgroundColorBrush}" BorderThickness="0" Background="{StaticResource backgroundColorBrush}">
<ScrollViewer x:Name="DropDownScrollViewer">
<Grid x:Name="grid" RenderOptions.ClearTypeHint="Enabled">
<Canvas x:Name="canvas" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Width="0">
<Rectangle x:Name="opaqueRect" Fill="{StaticResource backgroundColorBrush}"
Width="{Binding ActualWidth, ElementName=dropDownBorder}"/>
</Canvas>
<ItemsPresenter x:Name="ItemsPresenter" KeyboardNavigation.DirectionalNavigation="Contained" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
</Grid>
</ScrollViewer>
</Border>
</Themes:SystemDropShadowChrome>
</Popup>
<ToggleButton x:Name="toggleButton" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" Grid.ColumnSpan="2"
IsChecked="{Binding IsDropDownOpen, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}" Style="{StaticResource ComboBoxToggleButton}"/>
<ContentPresenter x:Name="contentPresenter" ContentTemplate="{TemplateBinding SelectionBoxItemTemplate}" ContentTemplateSelector="{TemplateBinding ItemTemplateSelector}"
Content="{TemplateBinding SelectionBoxItem}" ContentStringFormat="{TemplateBinding SelectionBoxItemStringFormat}" HorizontalAlignment="Left"
IsHitTestVisible="false" Margin="0, 0, 0, 0" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="Center"/>
</Grid>
<ControlTemplate.Triggers>
<!--<Trigger Property="HasItems" Value="false">
<Setter Property="Height" TargetName="dropDownBorder" Value="{StaticResource height}"/>
</Trigger>-->
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsGrouping" Value="true"/>
<Condition Property="VirtualizingPanel.IsVirtualizingWhenGrouping" Value="false"/>
</MultiTrigger.Conditions>
<Setter Property="ScrollViewer.CanContentScroll" Value="false"/>
</MultiTrigger>
<Trigger Property="ScrollViewer.CanContentScroll" SourceName="DropDownScrollViewer" Value="false">
<Setter Property="Canvas.Top" TargetName="opaqueRect" Value="{Binding VerticalOffset, ElementName=DropDownScrollViewer}"/>
<Setter Property="Canvas.Left" TargetName="opaqueRect" Value="{Binding HorizontalOffset, ElementName=DropDownScrollViewer}"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
<!--ComboBox-->
<Style TargetType="{x:Type ComboBox}">
<Setter Property="Background" Value="{StaticResource backgroundColorBrush}"/>
<Setter Property="BorderBrush" Value="{StaticResource backgroundColorBrush}"/>
<Setter Property="Foreground" Value="{StaticResource textColorBrush}"/>
<Setter Property="Width" Value="Auto"/>
<Setter Property="FontSize" Value="30"/>
<Setter Property="BorderThickness" Value="1"/>
<Setter Property="VerticalAlignment" Value="Stretch"/>
<Setter Property="HorizontalAlignment" Value="Stretch"/>
<Setter Property="VerticalContentAlignment" Value="Stretch"/>
<Setter Property="HorizontalContentAlignment" Value="Stretch"/>
<Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto"/>
<Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto"/>
<Setter Property="Padding" Value="0,0,0,0"/>
<Setter Property="ScrollViewer.CanContentScroll" Value="False"/>
<Setter Property="ScrollViewer.PanningMode" Value="None"/>
<Setter Property="Stylus.IsFlicksEnabled" Value="False"/>
<Setter Property="Template" Value="{StaticResource ComboBoxTemplate}"/>
<Style.Triggers>
<Trigger Property="IsEditable" Value="true">
<Setter Property="IsTabStop" Value="false"/>
<Setter Property="Padding" Value="2"/>
</Trigger>
</Style.Triggers>
</Style>
<!--ComboBox Item-->
<Style TargetType="{x:Type ComboBoxItem}">
<Setter Property="SnapsToDevicePixels" Value="True"/>
<Setter Property="Padding" Value="0,0"/>
<Setter Property="HorizontalContentAlignment" Value="Stretch"/>
<Setter Property="VerticalContentAlignment" Value="Stretch"/>
<Setter Property="VerticalAlignment" Value="Stretch"/>
<Setter Property="HorizontalAlignment" Value="Stretch"/>
<Setter Property="Background" Value="Transparent"/>
<Setter Property="BorderBrush" Value="Transparent"/>
<!--<Setter Property="FontSize" Value="Auto"/>-->
<!--<Setter Property="Height" Value="{StaticResource height}"/>-->
<Setter Property="BorderThickness" Value="1"/>
<Setter Property="ContentTemplate">
<Setter.Value>
<DataTemplate>
<Viewbox Stretch="Uniform">
<ContentPresenter Content="{TemplateBinding Content}"/>
</Viewbox>
</DataTemplate>
</Setter.Value>
</Setter>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type ComboBoxItem}">
<Border x:Name="Bd" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" Padding="0"
SnapsToDevicePixels="true">
<ContentPresenter HorizontalAlignment="Stretch" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="Stretch"/>
</Border>
<ControlTemplate.Triggers>
<Trigger Property="IsEnabled" Value="False">
<Setter Property="TextElement.Foreground" TargetName="Bd" Value="{StaticResource textColorBrush}"/>
</Trigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsSelected" Value="False"/>
<Condition Property="IsMouseOver" Value="True"/>
<Condition Property="IsKeyboardFocused" Value="False"/>
</MultiTrigger.Conditions>
<Setter Property="Background" TargetName="Bd" Value="{StaticResource highlightedColorBrush}"/>
<Setter Property="BorderBrush" TargetName="Bd" Value="{StaticResource highlightedColorBrush}"/>
</MultiTrigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsSelected" Value="True"/>
<Condition Property="IsMouseOver" Value="False"/>
<Condition Property="IsKeyboardFocused" Value="True"/>
</MultiTrigger.Conditions>
<Setter Property="Background" TargetName="Bd" Value="{StaticResource highlightedColorBrush}"/>
<Setter Property="BorderBrush" TargetName="Bd" Value="{StaticResource highlightedColorBrush}"/>
</MultiTrigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsSelected" Value="True"/>
<Condition Property="IsMouseOver" Value="True"/>
</MultiTrigger.Conditions>
<Setter Property="Background" TargetName="Bd" Value="{StaticResource highlightedColorBrush}"/>
<Setter Property="BorderBrush" TargetName="Bd" Value="{StaticResource highlightedColorBrush}"/>
</MultiTrigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsSelected" Value="True"/>
<Condition Property="IsMouseOver" Value="False"/>
<Condition Property="IsKeyboardFocused" Value="False"/>
</MultiTrigger.Conditions>
<Setter Property="Background" TargetName="Bd" Value="{StaticResource highlightedColorBrush}"/>
<Setter Property="BorderBrush" TargetName="Bd" Value="{StaticResource highlightedColorBrush}"/>
</MultiTrigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsSelected" Value="False"/>
<Condition Property="IsMouseOver" Value="False"/>
<Condition Property="IsKeyboardFocused" Value="True"/>
</MultiTrigger.Conditions>
<Setter Property="BorderBrush" TargetName="Bd" Value="{StaticResource highlightedColorBrush}"/>
</MultiTrigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsSelected" Value="False"/>
<Condition Property="IsMouseOver" Value="True"/>
<Condition Property="IsKeyboardFocused" Value="True"/>
</MultiTrigger.Conditions>
<Setter Property="Background" TargetName="Bd" Value="{StaticResource highlightedColorBrush}"/>
<Setter Property="BorderBrush" TargetName="Bd" Value="{StaticResource highlightedColorBrush}"/>
</MultiTrigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<!--Used by CheckBoxStyle1-->
<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}}" StrokeThickness="1" StrokeDashArray="1 2"/>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>

ComboBox's HorizontalContentAlignment defaults to Left and VerticalContentAlignment defaults to Top. Set them both to Stretch.

Add this implicit style in your content template:
<Viewbox Stretch="Fill">
<Viewbox.Resources>
<Style TargetType="TextBlock">
<Setter Property="HorizontalAlignment" Value="Stretch"/>
<Setter Property="TextAlignment" Value="Justify"></Setter>
</Style>
....

Ribbon Office 2013 template

I am using the following code to try my application has the same format as Office 2013, you must only add the reference to the project that comes with WPF 4.5 and is System.Windows.Controls.Ribbon. I have a problem, I need that when you select a tab, the line that is missing is complete, attached a picture:
<Window x:Class="WpfApplication1.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
WindowStartupLocation="CenterScreen">
<Window.Resources>
<Style TargetType="Ribbon">
<Setter Property="Background" Value="White"/>
<Setter Property="Foreground" Value="Black"/>
<!--<Setter Property="BorderBrush" Value="{x:Null}"/>-->
<!-- TODO Template
But how does this work? :/
-->
</Style>
<Style TargetType="RibbonGroup">
<Setter Property="Background" Value="Transparent"/>
<!--<Setter Property="MouseOverBackground" Value="Transparent"/>
<Setter Property="MouseOverBorderBrush" Value="Transparent"/>-->
</Style>
<Style TargetType="RibbonTabHeader">
<Setter Property="Background" Value="White"/>
<Setter Property="BorderBrush" Value="Transparent"/>
<Setter Property="FontSize" Value="13"/>
<Setter Property="Padding" Value="15,2,15,2"/>
<Setter Property="BorderThickness" Value="1,1,1,5"/>
<Setter Property="Margin" Value="1,0,1,0"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="RibbonTabHeader">
<ControlTemplate.Resources>
<SolidColorBrush x:Key="CheckedBackground" Color="#FFF5F6F7"/>
<SolidColorBrush x:Key="CheckedBorderBrush" Color="#FFDBDCDD"/>
<!--<SolidColorBrush x:Key="FocusedBackground" Color="#FFFDFDFF"/>
<SolidColorBrush x:Key="FocusedBorderBrush" Color="#FFEDEEEE"/>
<SolidColorBrush x:Key="MouseOverBackground" Color="#FFFDFDFF"/>
<SolidColorBrush x:Key="MouseOverBorderBrush" Color="#FFEDEEEE"/>-->
</ControlTemplate.Resources>
<Border Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}">
<ContentPresenter Margin="{TemplateBinding Padding}" HorizontalAlignment="Center" VerticalAlignment="Center" RecognizesAccessKey="True"/>
</Border>
<ControlTemplate.Triggers>
<Trigger Property="IsRibbonTabSelected" Value="True">
<Setter Property="Background" Value="{DynamicResource CheckedBackground}"/>
<!--<Setter Property="BorderBrush" Value="{DynamicResource CheckedBorderBrush}"/>-->
<Setter Property="BorderBrush" Value="#FFB9C9DA"/>
<Setter Property="Foreground" Value="Blue"/>
</Trigger>
<Trigger Property="IsMouseOver" Value="True">
<!--<Setter Property="Background" Value="{DynamicResource CheckedBackground}"/>-->
<!--<Setter Property="BorderBrush" Value="{DynamicResource CheckedBorderBrush}"/>-->
<!--<Setter Property="BorderBrush" Value="#FFB9C9DA"/>-->
<Setter Property="Foreground" Value="Blue"/>
</Trigger>
<!--<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsRibbonTabSelected" Value="False"/>
<Condition Property="IsMouseOver" Value="True"/>
</MultiTrigger.Conditions>
<Setter Property="Background" Value="{DynamicResource MouseOverBackground}"/>
<Setter Property="BorderBrush" Value="{DynamicResource MouseOverBorderBrush}"/>
</MultiTrigger>-->
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</Window.Resources>
<Grid>
<Ribbon>
<RibbonTab Header="INICIO">
<RibbonGroup Header="Portapapeles">
<RibbonButton Label="Hola" LargeImageSource="Imágenes/Artículo.png" Height="Auto" VerticalAlignment="Top"/>
</RibbonGroup>
<RibbonGroup Header="Fuente">
<RibbonButton Content="Fuente"/>
</RibbonGroup>
</RibbonTab>
<RibbonTab Header="INSERTAR"/>
<RibbonTab Header="DISEÑO"/>
<Ribbon.ApplicationMenu>
<RibbonApplicationMenu SmallImageSource="Imágenes/Usuario.png">
<RibbonApplicationMenuItem Width="Auto" Header="Iniciar sesión..." ImageSource="Imágenes/Usuario.png"/>
<RibbonApplicationMenuItem Width="Auto" Header="Cambiar contraseña..." ImageSource="Imágenes/Usuario.png"/>
<RibbonApplicationMenuItem Width="Auto" Header="Cerrar sesión..." ImageSource="Imágenes/Usuario.png"/>
</RibbonApplicationMenu>
</Ribbon.ApplicationMenu>
</Ribbon>
</Grid>
</Window>

You can vote for it on the uservoice website of visual studio: http://visualstudio.uservoice.com/forums/121579-visual-studio/suggestions/6736521-ribbon-styles-update-to-look-like-office-2013

WPF ListBox turn off hover effect

I've found and tried many solutions on the internet which should allow me to disable the hover effect of my WPF ListBox but none of them seemed to work for me. This screenshot shows the hover effect I'd like to hide or get rid of:
This is (a simplified version) of the XAML code I currently have:
<ListBox ItemsSource="{Binding Logs}" Grid.Column="1" Width="800" Height="100" >
<ListBox.ItemContainerStyle>
<Style TargetType="ListBoxItem">
<Style.Triggers>
<Trigger Property="Control.IsMouseOver" Value="True">
<Setter Property="Control.Background" Value="Transparent" />
</Trigger>
</Style.Triggers>
</Style>
</ListBox.ItemContainerStyle>
</ListBox>
However, it doesn't seem to work for me for a reason or another. Could my parent ListBox (the one in the background) or another control override it's child's style by any chance? (I already tried to override the parents style as well)

Modify the default style of a ListBoxItem
<Style TargetType="{x:Type ListBoxItem}">
<Setter Property="Background" Value="Transparent"/>
<Setter Property="HorizontalContentAlignment" Value="{Binding HorizontalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}"/>
<Setter Property="VerticalContentAlignment" Value="{Binding VerticalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}"/>
<Setter Property="Padding" Value="2,0,0,0"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type ListBoxItem}">
<Border x:Name="Bd" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" Padding="{TemplateBinding Padding}" SnapsToDevicePixels="true">
<ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
</Border>
<ControlTemplate.Triggers>
<Trigger Property="IsSelected" Value="true">
<Setter Property="Background" TargetName="Bd" Value="{DynamicResource {x:Static SystemColors.HighlightBrushKey}}"/>
<Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.HighlightTextBrushKey}}"/>
</Trigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsSelected" Value="true"/>
<Condition Property="Selector.IsSelectionActive" Value="false"/>
</MultiTrigger.Conditions>
<Setter Property="Background" TargetName="Bd" Value="{DynamicResource {x:Static SystemColors.InactiveSelectionHighlightBrushKey}}"/>
<Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.InactiveSelectionHighlightTextBrushKey}}"/>
</MultiTrigger>
<Trigger Property="IsEnabled" Value="false">
<Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
Just add a trigger
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Background" Value="Transparent"/>
</Trigger>

Getting rid of the blue devil?
If you have no need to click on your items the following will make it disappear, the highlighting on mouse hover:
<ListBox IsHitTestVisible="False">
<ListBox.ItemContainerStyle>
<Style TargetType="ListBoxItem">
<Setter Property="IsTabStop" Value="False" />
</Style>
</ListBox.ItemContainerStyle>
<ListBoxItem Content="Glad that" />
<ListBoxItem Content="they are over" />
<ListBoxItem Content="the days of the blue devil" />
</ListBox>