Center TextBlock inside Grid inside Border - WPF - wpf

I am slightly confused why my TextBlock PART_HintHost is not centered vertically...
<Style x:Key="{x:Type TextBox}"
TargetType="{x:Type TextBox}">
<!--#region Resources -->
<Style.Resources>
<ResourceDictionary Source="pack://application:,,,/Er.WpfDesign;component/Themes/DefaultTheme.xaml" />
</Style.Resources>
<!--#endregion-->
<!--#region Default Values -->
<Setter Property="Foreground" Value="{StaticResource ForeBrush}" />
<Setter Property="FontSize" Value="12" />
<Setter Property="FontFamily" Value="pack://application:,,,/Er.WpfDesign;component/Resources/Fonts/#Roboto" />
<Setter Property="FontStyle" Value="Normal" />
<Setter Property="FontWeight" Value="Regular" />
<Setter Property="BorderBrush" Value="{StaticResource BorderBrush}" />
<Setter Property="Padding" Value="1 1" />
<Setter Property="Background" Value="White" />
<!--#endregion-->
<!--#region Template -->
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type TextBox}">
<!--#region Layout-->
<Border CornerRadius="0"
Background="{TemplateBinding Background}"
BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="1"
Padding="{TemplateBinding Padding}">
<Grid VerticalAlignment="Center"
HorizontalAlignment="Left">
<ScrollViewer x:Name="PART_ContentHost"
VerticalAlignment="Center"
HorizontalAlignment="Left"
VerticalContentAlignment="Center"
HorizontalContentAlignment="Left"
Cursor="IBeam"/>
<TextBlock x:Name="PART_HintHost"
Text="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=(ext:HintExt.Hint)}"
VerticalAlignment="Center"
HorizontalAlignment="Left"
Visibility="Hidden"
Cursor="IBeam"/>
</Grid>
</Border>
<!--#endregion-->
<!--#region Triggers-->
<ControlTemplate.Triggers>
<Trigger Property="IsFocused" Value="True">
<Setter Property="BorderBrush" Value="{DynamicResource AccentBrush_1}" />
</Trigger>
<!--Hint Trigger-->
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="Text" Value="{x:Null}" />
<Condition Property="IsEnabled" Value="True" />
<Condition Property="IsFocused" Value="False" />
</MultiTrigger.Conditions>
<Setter Property="Visibility" Value="Visible" TargetName="PART_HintHost" />
</MultiTrigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="Text" Value="" />
<Condition Property="IsEnabled" Value="True" />
<Condition Property="IsFocused" Value="False" />
</MultiTrigger.Conditions>
<Setter Property="Visibility" Value="Visible" TargetName="PART_HintHost" />
</MultiTrigger>
</ControlTemplate.Triggers>
<!--#endregion-->
</ControlTemplate>
</Setter.Value>
</Setter>
<!--#endregion-->
</Style>
As far as I am concerned, I can stack elements without any worries inside a grid, which is what I am trying to do here. I'd expect my TextBlock to be centered vertically, just like my PART_ContentHost is:
I'd love to get some input as to why this does not work, open for any suggestion. Maybe a grid is the wrong approach here?

Related

Change Selection Color of ListBoxItem in WPF

Sorry that my question is redundant for instance with these ones:
WPF Changing ListboxItem Highlight Color when Selected
Why can't I set the background color of a selected ListBoxItem in WPF?
but for whatever reason neither changing the ItemContainerStyle, nor overriding the SystemColors works for me. Can someone tell me what I have to change in this XAML code to change the background color of selected ListBoxItems (or more precisely the ItemsContainer around them) to red? All the other colors that I set are assigned correctly.
<ListBox>
<ListBox.Resources>
<SolidColorBrush x:Key="{x:Static SystemColors.HighlightColorKey}" Color="Red" />
<SolidColorBrush x:Key="{x:Static SystemColors.HighlightBrushKey}" Color="Red" />
<SolidColorBrush x:Key="{x:Static SystemColors.ControlBrushKey}" Color="Red" />
<SolidColorBrush x:Key="{x:Static SystemColors.InactiveSelectionHighlightBrushKey }" Color="Red" />
</ListBox.Resources>
<ListBox.ItemContainerStyle>
<Style TargetType="{x:Type ListBoxItem}">
<Setter Property="Foreground" Value="HotPink"/>
<Setter Property="Background" Value="Yellow"/>
<Setter Property="Margin" Value="2"/>
<Style.Triggers>
<Trigger Property="IsSelected" Value="True">
<Setter Property="Foreground" Value="Green"/>
<Setter Property="Background" Value="Red"/>
</Trigger>
<Trigger Property="IsFocused" Value="True">
<Setter Property="Foreground" Value="Green"/>
<Setter Property="Background" Value="Red"/>
</Trigger>
</Style.Triggers>
</Style>
</ListBox.ItemContainerStyle>
<ListBox.ItemTemplate>
<DataTemplate>
<TextBlock Text="{Binding}"/>
</DataTemplate>
</ListBox.ItemTemplate>
<ListBoxItem>A</ListBoxItem>
<ListBoxItem>B</ListBoxItem>
<ListBoxItem>C</ListBoxItem>
<ListBoxItem>D</ListBoxItem>
</ListBox>

Both approaches do not work because:
The default control templates may not necessarily use the system colors.
The default control template triggers take precedence over your style setters.
You have to extract the default style and control template e.g. by using Visual Studio or Blend in order to have a working base to start from. Adapt the colors in the styles an control template triggers.
<SolidColorBrush x:Key="Item.MouseOver.Background"
Color="#1F26A0DA" />
<SolidColorBrush x:Key="Item.MouseOver.Border"
Color="#a826A0Da" />
<SolidColorBrush x:Key="Item.SelectedActive.Background"
Color="#3D26A0DA" />
<SolidColorBrush x:Key="Item.SelectedActive.Border"
Color="#FF26A0DA" />
<SolidColorBrush x:Key="Item.SelectedInactive.Background"
Color="#3DDADADA" />
<SolidColorBrush x:Key="Item.SelectedInactive.Border"
Color="#FFDADADA" />
<Style x:Key="FocusVisual">
<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>
<Style x:Key="ListBoxItemStyle"
TargetType="{x:Type ListBoxItem}">
<Setter Property="SnapsToDevicePixels"
Value="True" />
<Setter Property="Padding"
Value="4,1" />
<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="Background"
Value="Transparent" />
<Setter Property="BorderBrush"
Value="Transparent" />
<Setter Property="BorderThickness"
Value="1" />
<Setter Property="FocusVisualStyle"
Value="{StaticResource FocusVisual}" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type ListBoxItem}">
<Border x:Name="Bd"
Background="{TemplateBinding Background}"
BorderThickness="{TemplateBinding BorderThickness}"
BorderBrush="{TemplateBinding BorderBrush}"
Padding="{TemplateBinding Padding}"
SnapsToDevicePixels="true">
<ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"
VerticalAlignment="{TemplateBinding VerticalContentAlignment}" />
</Border>
<ControlTemplate.Triggers>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsMouseOver"
Value="True" />
</MultiTrigger.Conditions>
<Setter Property="Background"
TargetName="Bd"
Value="{StaticResource Item.MouseOver.Background}" />
<Setter Property="BorderBrush"
TargetName="Bd"
Value="{StaticResource Item.MouseOver.Border}" />
</MultiTrigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="Selector.IsSelectionActive"
Value="False" />
<Condition Property="IsSelected"
Value="True" />
</MultiTrigger.Conditions>
<Setter Property="Background"
TargetName="Bd"
Value="{StaticResource Item.SelectedInactive.Background}" />
<Setter Property="BorderBrush"
TargetName="Bd"
Value="{StaticResource Item.SelectedInactive.Border}" />
</MultiTrigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="Selector.IsSelectionActive"
Value="True" />
<Condition Property="IsSelected"
Value="True" />
</MultiTrigger.Conditions>
<Setter Property="Background"
TargetName="Bd"
Value="{StaticResource Item.SelectedActive.Background}" />
<Setter Property="BorderBrush"
TargetName="Bd"
Value="{StaticResource Item.SelectedActive.Border}" />
</MultiTrigger>
<Trigger Property="IsEnabled"
Value="False">
<Setter Property="TextElement.Foreground"
TargetName="Bd"
Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}" />
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
Then use the style in your ListBox by explicitly referencing it or make it an implicit style style by omitting the x:Key, so it will be applied to all ListBoxItems in scope.
<ListBox ItemContainerStyle="{StaticResource ListBoxItemStyle}">

Wpf Custom control MouseOver and selected

Hello I have googled this and found many issues like what I am trying to accomplish, however I cannot get this to work. I have build a control that has a listbox in it and when I pass my mouse over the item or select an item I would like to change the background color of the list item to a color.
MyControl:
<ListBox x:Name="Appointments"
ItemsSource="{TemplateBinding ItemSource}"
DisplayMemberPath="{TemplateBinding DisplayMemberPath}"
SelectedValuePath="{TemplateBinding SelectedValuePath}">
<ListBox.Resources>
<Style TargetType="{x:Type ListBoxItem}">
</Style>
</ListBox.Resources>
<ListBox.ItemContainerStyle>
<Style TargetType="ListBoxItem">
<Style.Triggers>
<DataTrigger Binding="{Binding AppointmentState}"
Value="{x:Static enums:AppointmentState.Accepted}">
<Setter Property="Background"
Value="Green" />
<Setter Property="Foreground"
Value="White" />
</DataTrigger>
<DataTrigger Binding="{Binding AppointmentState}"
Value="{x:Static enums:AppointmentState.Decliend}">
<Setter Property="Background"
Value="Red" />
<Setter Property="Foreground"
Value="White" />
</DataTrigger>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Background" Value="Blue" />
</Trigger>
<Trigger Property="IsSelected" Value="True">
<Setter Property="Background" Value="{DynamicResource AccentColor}"/>
</Trigger>
</Style.Triggers>
</Style>
</ListBox.ItemContainerStyle>
</ListBox>
what I've tried to do is just put under Listbox.Resorces ListBox.ItemContainerStyle ListBox.DataTemplate. thank you for your help
edit: new control
<Style TargetType="{x:Type local:MonthCalenderDay}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type local:MonthCalenderDay}">
<Border Background="{TemplateBinding Background}"
BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="{TemplateBinding BorderThickness}">
<StackPanel>
<TextBlock x:Name="DayNumber"
FontSize="15"
Foreground="{DynamicResource AccentColorBrush}"
Text="{Binding DayNumber,RelativeSource={RelativeSource TemplatedParent}}"/>
<ListBox x:Name="Appointments"
ItemsSource="{TemplateBinding ItemSource}"
DisplayMemberPath="{TemplateBinding DisplayMemberPath}"
SelectedValuePath="{TemplateBinding SelectedValuePath}">
<ListBox.Resources>
<Style TargetType="ListBoxItem">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type ListBoxItem}">
<Border x:Name="border"
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>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsMouseOver"
Value="True" />
</MultiTrigger.Conditions>
<Setter Property="Background"
TargetName="border"
Value="Blue" />
</MultiTrigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="Selector.IsSelectionActive" Value="False" />
<Condition Property="IsSelected" Value="True" />
</MultiTrigger.Conditions>
<Setter Property="Background"
TargetName="border"
Value="{DynamicResource AccentColorBrush}" />
<Setter Property="BorderBrush"
TargetName="border"
Value="{StaticResource Item.SelectedInactive.Border}" />
</MultiTrigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="Selector.IsSelectionActive"
Value="True" />
<Condition Property="IsSelected"
Value="True" />
</MultiTrigger.Conditions>
<Setter Property="Background"
TargetName="border"
Value="{DynamicResource AccentColorBrush}" />
<Setter Property="BorderBrush"
TargetName="border"
Value="{DynamicResource AccentColorBrush}" />
</MultiTrigger>
<Trigger Property="IsEnabled"
Value="False">
<Setter Property="TextElement.Foreground"
TargetName="border"
Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}" />
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
<Style.Triggers>
<!--<DataTrigger Binding="{Binding AppointmentState}"
Value="{x:Static enums:AppointmentState.Accepted}">
<Setter Property="Background"
Value="Green" />
<Setter Property="Foreground"
Value="White" />
</DataTrigger>
<DataTrigger Binding="{Binding AppointmentState}"
Value="{x:Static enums:AppointmentState.Decliend}">
<Setter Property="Background"
Value="Red" />
<Setter Property="Foreground"
Value="White" />
</DataTrigger>-->
</Style.Triggers>
</Style>
</ListBox.Resources>
</ListBox>
</StackPanel>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>

You need to modify the control template:
<ListBox x:Name="Appointments"
ItemsSource="{TemplateBinding ItemSource}"
DisplayMemberPath="{TemplateBinding DisplayMemberPath}"
SelectedValuePath="{TemplateBinding SelectedValuePath}">
<ListBox.Resources>
<SolidColorBrush x:Key="Item.MouseOver.Background" Color="#1F26A0DA"/>
<SolidColorBrush x:Key="Item.MouseOver.Border" Color="#a826A0Da"/>
<SolidColorBrush x:Key="Item.SelectedInactive.Background" Color="#3DDADADA"/>
<SolidColorBrush x:Key="Item.SelectedInactive.Border" Color="#FFDADADA"/>
<SolidColorBrush x:Key="Item.SelectedActive.Background" Color="#3D26A0DA"/>
<SolidColorBrush x:Key="Item.SelectedActive.Border" Color="#FF26A0DA"/>
</ListBox.Resources>
<ListBox.ItemContainerStyle>
<Style TargetType="ListBoxItem">
<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>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsMouseOver" Value="True"/>
</MultiTrigger.Conditions>
<Setter Property="Background" TargetName="Bd" Value="Blue"/>
</MultiTrigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="Selector.IsSelectionActive" Value="False"/>
<Condition Property="IsSelected" Value="True"/>
</MultiTrigger.Conditions>
<Setter Property="Background" TargetName="Bd" Value="{DynamicResource AccentColor}"/>
<Setter Property="BorderBrush" TargetName="Bd" Value="{StaticResource Item.SelectedInactive.Border}"/>
</MultiTrigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="Selector.IsSelectionActive" Value="True"/>
<Condition Property="IsSelected" Value="True"/>
</MultiTrigger.Conditions>
<Setter Property="Background" TargetName="Bd" Value="{DynamicResource AccentColor}"/>
<Setter Property="BorderBrush" TargetName="Bd" Value="{StaticResource Item.SelectedActive.Border}"/>
</MultiTrigger>
<Trigger Property="IsEnabled" Value="False">
<Setter Property="TextElement.Foreground" TargetName="Bd" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
<Style.Triggers>
<!--<DataTrigger Binding="{Binding AppointmentState}"
Value="{x:Static enums:AppointmentState.Accepted}">
<Setter Property="Background"
Value="Green" />
<Setter Property="Foreground"
Value="White" />
</DataTrigger>
<DataTrigger Binding="{Binding AppointmentState}"
Value="{x:Static enums:AppointmentState.Decliend}">
<Setter Property="Background"
Value="Red" />
<Setter Property="Foreground"
Value="White" />
</DataTrigger>-->
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Background" Value="Blue" />
</Trigger>
<Trigger Property="IsSelected" Value="True">
<Setter Property="Background" Value="{DynamicResource AccentColor}"/>
</Trigger>
</Style.Triggers>
</Style>
</ListBox.ItemContainerStyle>
</ListBox>

WPF combobox default hover color on togglebutton

I have a combobox and it's like a simple bar without the arrow. Almost possible to make all sort of color changes except that I can't figure out how to change the default blue color when hovering on the combobox itself. Your help is greatly appreciated.
What's annoying also is the portion in the styling that seems to be where my answer lies, but even commenting it all out did not cause any issue in building the comboBox, so I wonder if I have to override something to make this happen. It's the portion that is termed "ComboBoxTextBoxTemplate"
<Style TargetType="{x:Type ComboBox}">
<Setter Property="Foreground" Value="White" />
<Setter Property="BorderBrush" Value="White" />
<Setter Property="Background" Value="White" />
<Setter Property="SnapsToDevicePixels" Value="true"/>
<Setter Property="OverridesDefaultStyle" Value="true"/>
<Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto"/>
<Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto"/>
<Setter Property="ScrollViewer.CanContentScroll" Value="true"/>
<Setter Property="FontFamily" Value="Resources/#AGENCYR" />
<Setter Property="FontSize" Value="16" />
<Setter Property="FontWeight" Value="Normal"/>
<Setter Property="HorizontalAlignment" Value="Left"/>
<Setter Property="VerticalAlignment" Value="Top" />
<Setter Property="Cursor" Value="Arrow"/>
<Setter Property="Height" Value="34"/>
<Setter Property="Width" Value="387"/>
<Setter Property="MinWidth" Value="50"/>
<Setter Property="MinHeight" Value="32"/>
<Setter Property="Control.Template">
<Setter.Value>
<ControlTemplate TargetType="ComboBox">
<Grid>
<ToggleButton ClickMode="Press" Name="ToggleButton" Grid.Column="2" Focusable="False"
IsChecked="{Binding Path=IsDropDownOpen, RelativeSource={RelativeSource TemplatedParent}, Mode=TwoWay}"
Template="{StaticResource ComboBoxToggleButtonTemplate}"/>
<ContentPresenter
Margin="3,3,23,3"
HorizontalAlignment="Left"
Name="ContentSite"
VerticalAlignment="Center"
ContentTemplate="{TemplateBinding ComboBox.SelectionBoxItemTemplate}"
Content="{TemplateBinding ComboBox.SelectionBoxItem}"
IsHitTestVisible="False" />
<TextBox
Margin="3,3,23,3"
Visibility="Hidden"
HorizontalAlignment="Left"
Name="PART_EditableTextBox"
Background="Transparent"
VerticalAlignment="Center"
Style="{x:Null}"
IsReadOnly="False"
Focusable="True"
xml:space="preserve"
Template="{StaticResource ComboBoxTextBoxTemplate}"/>
<Popup
Placement="Bottom"
Name="Popup"
Focusable="False"
AllowsTransparency="True"
IsOpen="{TemplateBinding ComboBox.IsDropDownOpen}"
PopupAnimation="Fade">
<Grid
MinWidth="{TemplateBinding FrameworkElement.ActualWidth}"
MaxHeight="{TemplateBinding ComboBox.MaxDropDownHeight}"
Name="DropDown"
SnapsToDevicePixels="True">
<Border
BorderBrush="{StaticResource NormalBorderBrush}"
BorderThickness="1,1,1,1"
Name="DropDownBorder"
Background="{StaticResource WindowBackgroundBrush}"/>
<ScrollViewer
Margin="4,6,4,6"
SnapsToDevicePixels="True">
<ItemsPresenter
KeyboardNavigation.DirectionalNavigation="Contained" />
</ScrollViewer>
</Grid>
</Popup>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="UIElement.IsMouseOver" Value="True">
<Setter Property="Panel.Background" Value="Red"/>
</Trigger>
<Trigger Property="ItemsControl.HasItems" Value="False">
<Setter Property="FrameworkElement.MinHeight" TargetName="DropDownBorder" Value="95"/>
</Trigger>
<Trigger Property="UIElement.IsEnabled" Value="False">
<Setter Property="TextElement.Foreground" Value="{StaticResource DisabledForegroundBrush}"/>
</Trigger>
<Trigger Property="ItemsControl.IsGrouping" Value="True">
<Setter Property="ScrollViewer.CanContentScroll" Value="False"/>
</Trigger>
<Trigger Property="Window.AllowsTransparency" SourceName="Popup" Value="True">
<Setter Property="Border.CornerRadius" TargetName="DropDownBorder" Value="4"/>
<Setter Property="FrameworkElement.Margin" TargetName="DropDownBorder" Value="0,2,0,0"/>
</Trigger>
<Trigger Property="ComboBox.IsEditable" Value="True">
<Setter Property="KeyboardNavigation.IsTabStop" Value="False"/>
<Setter Property="UIElement.Visibility" TargetName="PART_EditableTextBox" Value="Visible"/>
<Setter Property="UIElement.Visibility" TargetName="ContentSite" Value="Hidden"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="ComboBox">
<Grid>
<ToggleButton
Name="ToggleButton"
BorderBrush="Gray"
BorderThickness="0"
Background="Gray"
Grid.Column="2"
Focusable="false"
IsChecked="{Binding Path=IsDropDownOpen,Mode=TwoWay,RelativeSource={RelativeSource TemplatedParent}}"
ClickMode="Release">
</ToggleButton>
<ContentPresenter
Name="ContentSite"
IsHitTestVisible="False"
Content="{TemplateBinding SelectionBoxItem}"
ContentTemplate="{TemplateBinding SelectionBoxItemTemplate}"
ContentTemplateSelector="{TemplateBinding ItemTemplateSelector}"
Margin="10,3,30,3"
VerticalAlignment="Center"
HorizontalAlignment="Center" />
<Popup
Name="Popup"
Placement="Bottom"
IsOpen="{TemplateBinding IsDropDownOpen}"
AllowsTransparency="True"
Focusable="False"
PopupAnimation="Fade">
<Grid
Name="DropDown"
SnapsToDevicePixels="True"
MinWidth="{TemplateBinding ActualWidth}"
MaxHeight="{TemplateBinding MaxDropDownHeight}">
<Border
x:Name="DropDownBorder"
Background="White"
BorderThickness="1"
BorderBrush="Black"/>
<ScrollViewer Margin="4,6,4,6" SnapsToDevicePixels="True">
<StackPanel IsItemsHost="True" KeyboardNavigation.DirectionalNavigation="Contained" />
</ScrollViewer>
</Grid>
</Popup>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="HasItems" Value="false">
<Setter TargetName="DropDownBorder" Property="MinHeight" Value="95"/>
</Trigger>
<Trigger Property="IsGrouping" Value="true">
<Setter Property="ScrollViewer.CanContentScroll" Value="false"/>
</Trigger>
<Trigger SourceName="Popup" Property="Popup.AllowsTransparency" Value="true">
<Setter TargetName="DropDownBorder" Property="CornerRadius" Value="0"/>
<Setter TargetName="DropDownBorder" Property="Margin" Value="0,2,0,0"/>
</Trigger>
<Trigger Property="IsEditable" Value="true">
<Setter Property="IsTabStop" Value="false"/>
<Setter TargetName="ContentSite" Property="Visibility" Value="Hidden"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style TargetType="{x:Type ComboBoxItem}">
<Setter Property="Foreground" Value="Black" />
<Setter Property="Control.Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type ComboBoxItem}">
<Border
Name="Border"
SnapsToDevicePixels="True"
Padding="2,2,2,2">
<ContentPresenter/>
</Border>
<ControlTemplate.Triggers>
<Trigger Property="ComboBoxItem.IsHighlighted" Value="True">
<Setter Property="Panel.Background" TargetName="Border" Value="{StaticResource CustomBrush1}"/>
</Trigger>
<Trigger Property="UIElement.IsEnabled" Value="False">
<Setter Property="TextElement.Foreground" Value="{StaticResource DisabledForegroundBrush}"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
<Style.Resources>
<SolidColorBrush x:Key="{x:Static SystemColors.InactiveSelectionHighlightBrushKey}"/>
<SolidColorBrush x:Key="{x:Static SystemColors.HighlightBrushKey}"/>
</Style.Resources>
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="True" >
<Setter Property="Foreground" Value="White" />
<Setter Property="Background" Value="#24afb2" />
</Trigger>
<Trigger Property="IsSelected" Value="True" >
<Setter Property="Background" Value="#24afb2" />
<Setter Property="Foreground" Value="White" />
</Trigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsFocused" Value="True"/>
<Condition Property="IsMouseOver" Value="False"/>
</MultiTrigger.Conditions>
<Setter Property="Foreground" Value="White" />
<Setter Property="Background" Value="#24afb2" />
</MultiTrigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsSelected" Value="True"/>
<Condition Property="IsMouseOver" Value="False"/>
</MultiTrigger.Conditions>
<Setter Property="Foreground" Value="Black" />
</MultiTrigger>
</Style.Triggers>
</Style>
<ControlTemplate TargetType="TextBox" x:Key="ComboBoxTextBoxTemplate">
<Border
Name="PART_ContentHost"
Background="Gray"
Focusable="False" />
</ControlTemplate>
<ControlTemplate TargetType="ToggleButton" x:Key="ComboBoxToggleButtonTemplate">
<!--<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition />
<ColumnDefinition Width="16" />
</Grid.ColumnDefinitions>
<Border
BorderBrush="Black"
CornerRadius="2,2,2,2"
BorderThickness="1,1,1,1"
Name="Border"
Background="WhiteSmoke"
Grid.ColumnSpan="2" />
<Border
Margin="1,1,1,1"
BorderBrush="{StaticResource NormalBorderBrush}"
CornerRadius="2,0,0,2"
BorderThickness="0,0,1,0"
Background="AliceBlue"
Grid.Column="0" />
<Path
Margin="0,0,3,0"
Data="M0,0L4,4 8,0z"
HorizontalAlignment="Center"
Fill="{StaticResource GlyphBrush}"
Name="Arrow"
VerticalAlignment="Center"
Width="8"
Grid.Column="1" />
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="UIElement.IsMouseOver" Value="True">
<Setter Property="Panel.Background" TargetName="Border" Value="WhiteSmoke"/>
</Trigger>
<Trigger Property="ToggleButton.IsChecked" Value="True">
<Setter Property="Panel.Background" TargetName="Border" Value="WhiteSmoke"/>
<Setter Property="Shape.Fill" TargetName="Arrow" Value="#FF8D979E"/>
</Trigger>
<Trigger Property="UIElement.IsEnabled" Value="False">
<Setter Property="Panel.Background" TargetName="Border" Value="{StaticResource DisabledBackgroundBrush}"/>
<Setter Property="Border.BorderBrush" TargetName="Border" Value="{StaticResource DisabledBorderBrush}"/>
<Setter Property="TextElement.Foreground" Value="{StaticResource DisabledForegroundBrush}"/>
<Setter Property="Shape.Fill" TargetName="Arrow" Value="#66FFFFFF"/>
</Trigger>
</ControlTemplate.Triggers>-->
</ControlTemplate>
<!-- The Actual ComboBox -->
<Grid>
<ComboBox x:Name="cmbNames" ItemsSource="{Binding SelectedName}" DisplayMemberPath ="FirstName" Width="454">
</ComboBox>
<TextBlock x:Name="txtComboBox" Style="{StaticResource ComboTextBox}"
Visibility="{Binding SelectedItem, ElementName=cmbNames, Converter={StaticResource NullToVisibilityConverter}}"
Text=" Select ..." />
</Grid>

I've done my best to figure out what you're trying to accomplish here, and I made some tweaks that should at least get you to a reasonable starting point. I had to improve with the colors since you left out some of the brush resources you were referencing ;).
<SolidColorBrush x:Key="CustomBrush1"
Color="Magenta" />
<SolidColorBrush x:Key="DisabledForegroundBrush"
Color="Gray" />
<SolidColorBrush x:Key="DisabledBackgroundBrush"
Color="Gray" />
<SolidColorBrush x:Key="DisabledBorderBrush"
Color="Gray" />
<SolidColorBrush x:Key="NormalBorderBrush"
Color="Black" />
<DrawingBrush x:Key="GlyphBrush">
<DrawingBrush.Drawing>
<GeometryDrawing Brush="Black"
Geometry="M 0,0 L 4,4 L 8,0 Z" />
</DrawingBrush.Drawing>
</DrawingBrush>
<ControlTemplate TargetType="TextBox"
x:Key="ComboBoxTextBoxTemplate">
<Border Name="PART_ContentHost"
Background="Gray"
Focusable="False" />
</ControlTemplate>
<ControlTemplate TargetType="ToggleButton"
x:Key="ComboBoxToggleButtonTemplate">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition />
<ColumnDefinition Width="16" />
</Grid.ColumnDefinitions>
<Border BorderBrush="Black"
CornerRadius="2,2,2,2"
BorderThickness="1,1,1,1"
Name="Border"
Background="WhiteSmoke"
Grid.ColumnSpan="2" />
<Path Margin="0,0,3,0"
Data="M0,0L4,4 8,0z"
HorizontalAlignment="Center"
Fill="{StaticResource GlyphBrush}"
Name="Arrow"
VerticalAlignment="Center"
Width="8"
Grid.Column="1" />
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="UIElement.IsMouseOver"
Value="True">
<Setter Property="Panel.Background"
TargetName="Border"
Value="DodgerBlue" />
</Trigger>
<Trigger Property="ToggleButton.IsChecked"
Value="True">
<Setter Property="Panel.Background"
TargetName="Border"
Value="WhiteSmoke" />
<Setter Property="Shape.Fill"
TargetName="Arrow"
Value="#FF8D979E" />
</Trigger>
<Trigger Property="UIElement.IsEnabled"
Value="False">
<Setter Property="Panel.Background"
TargetName="Border"
Value="{StaticResource DisabledBackgroundBrush}" />
<Setter Property="Border.BorderBrush"
TargetName="Border"
Value="{StaticResource DisabledBorderBrush}" />
<Setter Property="TextElement.Foreground"
Value="{StaticResource DisabledForegroundBrush}" />
<Setter Property="Shape.Fill"
TargetName="Arrow"
Value="#66FFFFFF" />
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
<Style TargetType="{x:Type ComboBox}">
<Setter Property="Foreground"
Value="Black" />
<Setter Property="BorderBrush"
Value="White" />
<Setter Property="Background"
Value="White" />
<Setter Property="SnapsToDevicePixels"
Value="true" />
<Setter Property="OverridesDefaultStyle"
Value="true" />
<Setter Property="ScrollViewer.HorizontalScrollBarVisibility"
Value="Auto" />
<Setter Property="ScrollViewer.VerticalScrollBarVisibility"
Value="Auto" />
<Setter Property="ScrollViewer.CanContentScroll"
Value="true" />
<Setter Property="FontFamily"
Value="Resources/#AGENCYR" />
<Setter Property="FontSize"
Value="16" />
<Setter Property="FontWeight"
Value="Normal" />
<Setter Property="HorizontalAlignment"
Value="Left" />
<Setter Property="VerticalAlignment"
Value="Top" />
<Setter Property="Cursor"
Value="Arrow" />
<Setter Property="Height"
Value="34" />
<Setter Property="Width"
Value="387" />
<Setter Property="MinWidth"
Value="50" />
<Setter Property="MinHeight"
Value="32" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="ComboBox">
<Grid>
<ToggleButton Name="ToggleButton"
BorderBrush="Gray"
BorderThickness="0"
Background="Gray"
Grid.Column="2"
Focusable="false"
IsChecked="{Binding Path=IsDropDownOpen,Mode=TwoWay,RelativeSource={RelativeSource TemplatedParent}}"
ClickMode="Release"
Template="{StaticResource ComboBoxToggleButtonTemplate}" />
<ContentPresenter Name="ContentSite"
IsHitTestVisible="False"
Content="{TemplateBinding SelectionBoxItem}"
ContentTemplate="{TemplateBinding SelectionBoxItemTemplate}"
ContentTemplateSelector="{TemplateBinding ItemTemplateSelector}"
Margin="10,3,30,3"
VerticalAlignment="Center"
HorizontalAlignment="Center" />
<Popup Name="Popup"
Placement="Bottom"
IsOpen="{TemplateBinding IsDropDownOpen}"
AllowsTransparency="True"
Focusable="False"
PopupAnimation="Fade">
<Grid Name="DropDown"
SnapsToDevicePixels="True"
MinWidth="{TemplateBinding ActualWidth}"
MaxHeight="{TemplateBinding MaxDropDownHeight}">
<Border x:Name="DropDownBorder"
Background="White"
BorderThickness="1"
BorderBrush="Black" />
<ScrollViewer Margin="4,6,4,6"
SnapsToDevicePixels="True">
<StackPanel IsItemsHost="True"
KeyboardNavigation.DirectionalNavigation="Contained" />
</ScrollViewer>
</Grid>
</Popup>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="HasItems"
Value="false">
<Setter TargetName="DropDownBorder"
Property="MinHeight"
Value="95" />
</Trigger>
<Trigger Property="IsGrouping"
Value="true">
<Setter Property="ScrollViewer.CanContentScroll"
Value="false" />
</Trigger>
<Trigger SourceName="Popup"
Property="Popup.AllowsTransparency"
Value="true">
<Setter TargetName="DropDownBorder"
Property="CornerRadius"
Value="0" />
<Setter TargetName="DropDownBorder"
Property="Margin"
Value="0,2,0,0" />
</Trigger>
<Trigger Property="IsEditable"
Value="true">
<Setter Property="IsTabStop"
Value="false" />
<Setter TargetName="ContentSite"
Property="Visibility"
Value="Hidden" />
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style TargetType="{x:Type ComboBoxItem}">
<Setter Property="Foreground"
Value="Black" />
<Setter Property="Control.Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type ComboBoxItem}">
<Border Name="Border"
SnapsToDevicePixels="True"
Padding="2,2,2,2">
<ContentPresenter />
</Border>
<ControlTemplate.Triggers>
<Trigger Property="ComboBoxItem.IsHighlighted"
Value="True">
<Setter Property="Panel.Background"
TargetName="Border"
Value="{StaticResource CustomBrush1}" />
</Trigger>
<Trigger Property="UIElement.IsEnabled"
Value="False">
<Setter Property="TextElement.Foreground"
Value="{StaticResource DisabledForegroundBrush}" />
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
<Style.Resources>
<SolidColorBrush x:Key="{x:Static SystemColors.InactiveSelectionHighlightBrushKey}" />
<SolidColorBrush x:Key="{x:Static SystemColors.HighlightBrushKey}" />
</Style.Resources>
<Style.Triggers>
<Trigger Property="IsMouseOver"
Value="True">
<Setter Property="Foreground"
Value="White" />
<Setter Property="Background"
Value="#24afb2" />
</Trigger>
<Trigger Property="IsSelected"
Value="True">
<Setter Property="Background"
Value="#24afb2" />
<Setter Property="Foreground"
Value="White" />
</Trigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsFocused"
Value="True" />
<Condition Property="IsMouseOver"
Value="False" />
</MultiTrigger.Conditions>
<Setter Property="Foreground"
Value="White" />
<Setter Property="Background"
Value="#24afb2" />
</MultiTrigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsSelected"
Value="True" />
<Condition Property="IsMouseOver"
Value="False" />
</MultiTrigger.Conditions>
<Setter Property="Foreground"
Value="Black" />
</MultiTrigger>
</Style.Triggers>
</Style>
The style doesn't define a template for editable ComboBox instances, which I think may have been what your other template was trying to do. Perhaps you can extract it to a separate template, which you can set via a Style setter when IsEditable is True.

Mike, I took your template and embedded it with mine using the textbox, however I got the arrow back in the comboBox which I really wanted to avoid. But the good thing was that I removed the textbox from inside the combobox template and was able to remove that another template.... (it's all shown as commented)
<Style x:Key="ComboTextBox" TargetType="{x:Type TextBlock}">
<Setter Property="IsHitTestVisible" Value="False" />
<Setter Property="FontFamily" Value="Resources/#AGENCYR" />
<Setter Property="FontSize" Value="16" />
<Setter Property="FontWeight" Value="Normal"/>
<Setter Property="HorizontalAlignment" Value="Left"/>
<Setter Property="VerticalAlignment" Value="Center" />
<!--<Setter Property="Foreground" Value="#FFA2C3C4" />-->
<!--<Setter Property="Foreground" Value="#FF3CEFF4" />-->
<Setter Property="Foreground" Value="White" />
<!--<Setter Property="Background" Value="Yellow" />-->
</Style>
<ControlTemplate TargetType="TextBox"
x:Key="ComboBoxTextBoxTemplate">
<Border Name="PART_ContentHost"
Background="Gray"
Focusable="False" />
</ControlTemplate>
<ControlTemplate TargetType="ToggleButton"
x:Key="ComboBoxToggleButtonTemplate">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition />
<ColumnDefinition Width="16" />
</Grid.ColumnDefinitions>
<Border BorderBrush="Gray"
CornerRadius="2,2,2,2"
BorderThickness="0,0,0,0"
Name="Border"
Background="Gray"
Grid.ColumnSpan="2" />
<Path Margin="0,0,3,0"
Data="M0,0L4,4 8,0z"
HorizontalAlignment="Center"
Fill="{StaticResource GlyphBrush}"
Name="Arrow"
VerticalAlignment="Center"
Width="8"
Grid.Column="1" />
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="UIElement.IsMouseOver"
Value="True">
<Setter Property="Panel.Background"
TargetName="Border"
Value="Gray" />
</Trigger>
<Trigger Property="ToggleButton.IsChecked"
Value="True">
<Setter Property="Panel.Background"
TargetName="Border"
Value="Gray" />
<Setter Property="Shape.Fill"
TargetName="Arrow"
Value="#FF8D979E" />
</Trigger>
<Trigger Property="UIElement.IsEnabled"
Value="False">
<Setter Property="Panel.Background"
TargetName="Border"
Value="{StaticResource DisabledBackgroundBrush}" />
<Setter Property="Border.BorderBrush"
TargetName="Border"
Value="{StaticResource DisabledBorderBrush}" />
<Setter Property="TextElement.Foreground"
Value="{StaticResource DisabledForegroundBrush}" />
<Setter Property="Shape.Fill"
TargetName="Arrow"
Value="#66FFFFFF" />
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
<Style TargetType="{x:Type ComboBox}">
<Setter Property="Foreground"
Value="#FF3CEFF4" />
<Setter Property="BorderBrush"
Value="White" />
<Setter Property="Background"
Value="White" />
<Setter Property="SnapsToDevicePixels"
Value="true" />
<Setter Property="OverridesDefaultStyle"
Value="true" />
<Setter Property="ScrollViewer.HorizontalScrollBarVisibility"
Value="Auto" />
<Setter Property="ScrollViewer.VerticalScrollBarVisibility"
Value="Auto" />
<Setter Property="ScrollViewer.CanContentScroll"
Value="true" />
<Setter Property="FontFamily"
Value="Resources/#AGENCYR" />
<Setter Property="FontSize"
Value="16" />
<Setter Property="FontWeight"
Value="Normal" />
<Setter Property="HorizontalAlignment"
Value="Left" />
<Setter Property="VerticalAlignment"
Value="Top" />
<Setter Property="Cursor"
Value="Arrow" />
<Setter Property="Height"
Value="34" />
<Setter Property="Width"
Value="387" />
<Setter Property="MinWidth"
Value="50" />
<Setter Property="MinHeight"
Value="32" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="ComboBox">
<Grid>
<ToggleButton Name="ToggleButton"
BorderBrush="Gray"
BorderThickness="0"
Background="Gray"
Grid.Column="2"
Focusable="false"
IsChecked="{Binding Path=IsDropDownOpen,Mode=TwoWay,RelativeSource={RelativeSource TemplatedParent}}"
ClickMode="Release"
Template="{StaticResource ComboBoxToggleButtonTemplate}" />
<ContentPresenter Name="ContentSite"
IsHitTestVisible="False"
Content="{TemplateBinding SelectionBoxItem}"
ContentTemplate="{TemplateBinding SelectionBoxItemTemplate}"
ContentTemplateSelector="{TemplateBinding ItemTemplateSelector}"
Margin="10,3,30,3"
VerticalAlignment="Center"
HorizontalAlignment="Left" />
<!-- REMOVED THIS ONE TOO <TextBox
Margin="3,3,23,3"
Visibility="Hidden"
HorizontalAlignment="Left"
Name="PART_EditableTextBox"
Background="Transparent"
VerticalAlignment="Left"
Style="{x:Null}"
IsReadOnly="False"
Focusable="True"
xml:space="preserve"
Template="{StaticResource ComboBoxTextBoxTemplate}"/>-->
<Popup Name="Popup"
Placement="Bottom"
IsOpen="{TemplateBinding IsDropDownOpen}"
AllowsTransparency="True"
Focusable="False"
PopupAnimation="Fade">
<Grid Name="DropDown"
SnapsToDevicePixels="True"
MinWidth="{TemplateBinding ActualWidth}"
MaxHeight="{TemplateBinding MaxDropDownHeight}">
<Border Name="DropDownBorder"
Background="White"
BorderThickness="1"
BorderBrush="Black" />
<ScrollViewer Margin="4,6,4,6"
SnapsToDevicePixels="True">
<StackPanel IsItemsHost="True"
KeyboardNavigation.DirectionalNavigation="Contained" />
</ScrollViewer>
</Grid>
</Popup>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="HasItems"
Value="false">
<Setter TargetName="DropDownBorder"
Property="MinHeight" Value="95" />
</Trigger>
<Trigger Property="IsGrouping"
Value="true">
<Setter Property="ScrollViewer.CanContentScroll"
Value="false" />
</Trigger>
<Trigger SourceName="Popup"
Property="Popup.AllowsTransparency"
Value="true">
<Setter TargetName="DropDownBorder"
Property="CornerRadius"
Value="0" />
<Setter TargetName="DropDownBorder"
Property="Margin"
Value="0,2,0,0" />
</Trigger>
<Trigger Property="IsEditable"
Value="true">
<Setter Property="IsTabStop"
Value="false" />
<Setter TargetName="ContentSite"
Property="Visibility"
Value="Hidden" />
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
<!-- FINALLY REMOVED THIS ONE <Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="ComboBox">
<Grid>
<ToggleButton
Name="ToggleButton"
BorderBrush="Gray"
BorderThickness="0"
Background="Gray"
Grid.Column="2"
Focusable="false"
IsChecked="{Binding Path=IsDropDownOpen,Mode=TwoWay,RelativeSource={RelativeSource TemplatedParent}}"
ClickMode="Release">
</ToggleButton>
<ContentPresenter
Name="ContentSite"
IsHitTestVisible="False"
Content="{TemplateBinding SelectionBoxItem}"
ContentTemplate="{TemplateBinding SelectionBoxItemTemplate}"
ContentTemplateSelector="{TemplateBinding ItemTemplateSelector}"
Margin="10,3,30,3"
VerticalAlignment="Center"
HorizontalAlignment="Left" />
<Popup
Name="Popup"
Placement="Bottom"
IsOpen="{TemplateBinding IsDropDownOpen}"
AllowsTransparency="True"
Focusable="False"
PopupAnimation="Fade">
<Grid
Name="DropDown"
SnapsToDevicePixels="True"
MinWidth="{TemplateBinding ActualWidth}"
MaxHeight="{TemplateBinding MaxDropDownHeight}">
<Border
x:Name="DropDownBorder"
Background="White"
BorderThickness="1"
BorderBrush="Black"/>
<ScrollViewer Margin="4,6,4,6" SnapsToDevicePixels="True">
<StackPanel IsItemsHost="True" KeyboardNavigation.DirectionalNavigation="Contained" />
</ScrollViewer>
</Grid>
</Popup>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="HasItems" Value="false">
<Setter TargetName="DropDownBorder" Property="MinHeight" Value="95"/>
</Trigger>
<Trigger Property="IsGrouping" Value="true">
<Setter Property="ScrollViewer.CanContentScroll" Value="false"/>
</Trigger>
<Trigger SourceName="Popup" Property="Popup.AllowsTransparency" Value="true">
<Setter TargetName="DropDownBorder" Property="CornerRadius" Value="0"/>
<Setter TargetName="DropDownBorder" Property="Margin" Value="0,2,0,0"/>
</Trigger>
<Trigger Property="IsEditable" Value="true">
<Setter Property="IsTabStop" Value="false"/>
<Setter TargetName="ContentSite" Property="Visibility" Value="Hidden"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>-->
</Style>
<Style TargetType="{x:Type ComboBoxItem}">
<Setter Property="Foreground"
Value="Black" />
<Setter Property="Control.Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type ComboBoxItem}">
<Border Name="Border"
SnapsToDevicePixels="True"
Padding="2,2,2,2">
<ContentPresenter />
</Border>
<ControlTemplate.Triggers>
<Trigger Property="ComboBoxItem.IsHighlighted"
Value="True">
<Setter Property="Panel.Background"
TargetName="Border"
Value="{StaticResource CustomBrush1}" />
</Trigger>
<Trigger Property="UIElement.IsEnabled"
Value="False">
<Setter Property="TextElement.Foreground"
Value="{StaticResource DisabledForegroundBrush}" />
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
<Style.Resources>
<SolidColorBrush x:Key="{x:Static SystemColors.InactiveSelectionHighlightBrushKey}" />
<SolidColorBrush x:Key="{x:Static SystemColors.HighlightBrushKey}" />
</Style.Resources>
<Style.Triggers>
<Trigger Property="IsMouseOver"
Value="True">
<Setter Property="Foreground"
Value="White" />
<Setter Property="Background"
Value="#24afb2" />
</Trigger>
<Trigger Property="IsSelected"
Value="True">
<Setter Property="Background"
Value="#24afb2" />
<Setter Property="Foreground"
Value="White" />
</Trigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsFocused"
Value="True" />
<Condition Property="IsMouseOver"
Value="False" />
</MultiTrigger.Conditions>
<Setter Property="Foreground"
Value="White" />
<Setter Property="Background"
Value="#24afb2" />
</MultiTrigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsSelected"
Value="True" />
<Condition Property="IsMouseOver"
Value="False" />
</MultiTrigger.Conditions>
<Setter Property="Foreground"
Value="Black" />
</MultiTrigger>
</Style.Triggers>
</Style>
This now works by setting the ToogleButton in ControlTemplate for both the trigger as:
<Trigger Property="UIElement.IsMouseOver" Value="True">
<Setter Property="Panel.Background" TargetName="Border" Value="Gray" />
</Trigger>
<Trigger Property="ToggleButton.IsChecked" Value="True">
<Setter Property="Panel.Background" TargetName="Border" Value="Gray" />
</Trigger>
And the combobox being used:
<!-- The Actual ComboBox -->
<Grid>
<ComboBox x:Name="cmbNames" ItemsSource="{Binding SelectedName}" DisplayMemberPath ="FirstName" Width="454">
</ComboBox>
<TextBlock x:Name="txtComboBox" Style="{StaticResource ComboTextBox}"
Visibility="{Binding SelectedItem, ElementName=cmbNames, Converter={StaticResource NullToVisibilityConverter}}"
Text=" Select ..." />
</Grid>
Hopefully someone can look at this temp solution and offer me the solution on how to get rid of the arrow on the combobox.

How can I bind to tag from style in wpf?

I'm implementing a search textbox; could you please help me with binding to TextBox.Tag?
Style
<Style x:Key="SearchTextBox" TargetType="{x:Type TextBox}">
<Style.Resources>
<VisualBrush x:Key="CueBannerBrush" AlignmentX="Left" AlignmentY="Center" Stretch="None">
<VisualBrush.Visual>
<Label Content="{Binding RelativeSource={RelativeSource Mode=Self}, Path=Tag}" Foreground="{StaticResource SearchTextBox.Foreground}" FontSize="{StaticResource SearchTextBox.FontSize}"/>
</VisualBrush.Visual>
</VisualBrush>
</Style.Resources>
<Setter Property="FontSize" Value="{StaticResource SearchTextBox.FontSize}" />
<Setter Property="Foreground" Value="{StaticResource SearchTextBox.TextForeground}" />
<Setter Property="MinWidth" Value="200" />
<Style.Triggers>
<Trigger Property="Text" Value="{x:Static sys:String.Empty}">
<Setter Property="Background" Value="{StaticResource CueBannerBrush}" />
</Trigger>
<Trigger Property="Text" Value="{x:Null}">
<Setter Property="Background" Value="{StaticResource CueBannerBrush}" />
</Trigger>
<Trigger Property="IsKeyboardFocused" Value="True">
<Setter Property="Background" Value="White" />
</Trigger>
</Style.Triggers>
</Style>
Usage
<TextBox Style="{StaticResource SearchTextBox}" Tag="Search templates" />
How can I get the binding to work?

This article here is extremely similar to yours: WPF Bind to parent property from within nested element using style
Though, it doesn't really give a code sample, so here's some xaml you can use as an alternative to your current approach.
<Style x:Key="SearchTextBox" BasedOn="{StaticResource {x:Type TextBox}}" TargetType="{x:Type TextBox}">
<Style.Setters>
<Setter Property="Tag" Value=""/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type TextBox}">
<Grid>
<ScrollViewer x:Name="PART_ContentHost" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" />
<TextBlock x:Name="textBlock" Opacity="0.345" Text="{TemplateBinding Tag}" TextWrapping="Wrap" Visibility="Hidden" />
</Grid>
<ControlTemplate.Triggers>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsFocused" Value="False" />
<Condition Property="Text" Value="" />
</MultiTrigger.Conditions>
<Setter Property="Visibility" TargetName="textBlock" Value="Visible" />
</MultiTrigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style.Setters>
</Style>
And you'll still write your textbox code the same way you already had it:
<TextBox Style="{StaticResource SearchTextBox}" Tag="Search templates" />

Stretch ListBoxItem Style Problems

I have a problem stretching the content of a ListBoxItem. I use a DataTemplate with a Grid to place the content of the last column aligned at the right. But I must have something in the basic style of the controls that prevents this kind of display - the "*" ("consume all the rest of space") displays like "auto" ("take only what you really need").
Style of all ListBoxes:
<Style TargetType="{x:Type ListBox}">
<Setter Property="SnapsToDevicePixels" Value="true" />
<Setter Property="Background" Value="{DynamicResource WindowBackgroundBrush}" />
<Setter Property="BorderBrush" Value="{DynamicResource SolidBorderBrush}" />
<Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto" />
<Setter Property="HorizontalContentAlignment" Value="Stretch" />
<Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto" />
<Setter Property="ScrollViewer.CanContentScroll" Value="True" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type ListBox}">
<Grid HorizontalAlignment="Stretch">
<Border x:Name="Border" HorizontalAlignment="Stretch"
BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="{TemplateBinding BorderThickness}" />
<ScrollViewer Margin="1" Style="{DynamicResource NuclearScrollViewer}"
Focusable="false" Background="{DynamicResource LightBrush}"
x:Name="scrollViewer">
<StackPanel Margin="2" IsItemsHost="true" HorizontalAlignment="Stretch" />
</ScrollViewer>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsEnabled" Value="false">
<Setter Property="Background"
Value="{DynamicResource DisabledBackgroundBrush}"
TargetName="Border" />
<Setter Property="BorderBrush"
Value="{DynamicResource DisabledBorderBrush}"
TargetName="Border" />
<Setter Property="Background"
TargetName="scrollViewer"
Value="{DynamicResource DisabledBackgroundBrush}"/>
</Trigger>
<Trigger Property="IsGrouping" Value="true">
<Setter Property="ScrollViewer.CanContentScroll" Value="false" />
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style d:IsControlPart="True" TargetType="{x:Type ListBoxItem}">
<Setter Property="SnapsToDevicePixels" Value="true" />
<Setter Property="OverridesDefaultStyle" Value="true" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type ListBoxItem}">
<Grid SnapsToDevicePixels="true" HorizontalAlignment="Stretch" >
<Border HorizontalAlignment="Stretch" x:Name="Border" Opacity="0.25"
Margin="0,1,0,1" Background="{DynamicResource NormalBrush}"
BorderBrush="{DynamicResource NormalBorderBrush}"
BorderThickness="1,1,1,1" CornerRadius="0,0,0,0" Padding="0,0,0,0" />
<Rectangle Opacity="0.25" Fill="{DynamicResource LightBrush}" Stroke="{x:Null}"
Height="10.849" Margin="1.153,1.151,1,0" VerticalAlignment="Top" />
<ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
Margin="5,2,0,2" x:Name="contentPresenter" />
</Grid>
<ControlTemplate.Triggers>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="Selector.IsSelected" Value="True"/>
<Condition Property="IsEnabled" Value="False"/>
</MultiTrigger.Conditions>
<Setter Property="Background" TargetName="Border"
Value="{DynamicResource DisabledBackgroundBrush}"/>
<Setter Property="BorderBrush" TargetName="Border"
Value="{DynamicResource DisabledBorderBrush}"/>
</MultiTrigger>
<Trigger Property="IsSelected" Value="true">
<Setter Property="Opacity" TargetName="Border" Value="1" />
<Setter Property="Background" TargetName="Border"
Value="{DynamicResource SelectedBackgroundBrush}" />
</Trigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsMouseOver" Value="True" />
<Condition Property="Selector.IsSelected" Value="False" />
</MultiTrigger.Conditions>
<Setter Property="Background" TargetName="Border"
Value="{DynamicResource MouseOverBrush}" />
<Setter Property="Opacity" TargetName="Border" Value="1" />
</MultiTrigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="Selector.IsSelected" Value="True" />
<Condition Property="IsMouseOver" Value="True" />
</MultiTrigger.Conditions>
<Setter Property="Opacity" TargetName="Border" Value="0.65" />
<Setter Property="Background" TargetName="Border"
Value="{DynamicResource SelectedBackgroundBrush}" />
</MultiTrigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsSelected" Value="true" />
<Condition Property="Selector.IsSelectionActive" Value="false" />
</MultiTrigger.Conditions>
<Setter Property="Background" TargetName="Border"
Value="{DynamicResource SelectedBackgroundBrush}" />
<Setter Property="Opacity" TargetName="Border" Value="0.6" />
</MultiTrigger>
<Trigger Property="IsEnabled" Value="false">
<Setter Property="Foreground"
Value="{DynamicResource DisabledForegroundBrush}" />
<Setter Property="Background" TargetName="Border"
Value="{DynamicResource DisabledBackgroundBrush}"/>
<Setter Property="BorderBrush" TargetName="Border"
Value="{DynamicResource DisabledBorderBrush}"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
My ListBox:
<ListBox Height="220"
DataContext="{Binding}"
ItemsSource="{Binding Persons}"
SelectedItem="{Binding SelectedPerson}"
VirtualizingStackPanel.VirtualizationMode="Recycling"
VirtualizingStackPanel.IsVirtualizing="True"
ScrollViewer.IsDeferredScrollingEnabled="True"
HorizontalAlignment="Stretch"
HorizontalContentAlignment="Stretch"
ScrollViewer.HorizontalScrollBarVisibility="Disabled"
ScrollViewer.VerticalScrollBarVisibility="Auto"
ScrollViewer.CanContentScroll="True">
<ListBox.ItemTemplate>
<DataTemplate>
<Grid HorizontalAlignment="Stretch"
MaxWidth="{Binding RelativeSource={RelativeSource
Mode=FindAncestor,
AncestorType={x:Type ListBox}},
Path=ActualWidth}">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="Auto"/>
</Grid.ColumnDefinitions>
<TextBlock Grid.Row="0" Grid.Column="0" Grid.RowSpan="2"
Width="25" Height="25"
Margin="0,0,5,0"
HorizontalAlignment="Right"
VerticalAlignment="Center"
Text="{Binding Path=BusinessDataObject.Category}">
<TextBlock.Style>
<Style TargetType="{x:Type TextBlock}">
<Setter Property="TextAlignment" Value="Center"/>
<Setter Property="FontSize" Value="16"/>
<Setter Property="Foreground" Value="White"/>
<Setter Property="Background" Value="Transparent"/>
<Style.Triggers>
<Trigger Property="Text" Value="A">
<Setter Property="Background" Value="Red"/>
</Trigger>
<Trigger Property="Text" Value="B">
<Setter Property="Background" Value="Orange"/>
</Trigger>
<Trigger Property="Text" Value="C">
<Setter Property="Background" Value="Blue"/>
</Trigger>
</Style.Triggers>
</Style>
</TextBlock.Style>
</TextBlock>
<TextBlock Grid.Row="0"
Grid.Column="1"
Margin="0,0,10,0"
HorizontalAlignment="Left"
TextWrapping="Wrap"
FontWeight="Bold"
Text="{Binding Path=BusinessDataObject.FullNameReversed}"/>
<TextBlock Grid.Row="1" Grid.Column="1" Margin="0,0,10,0"
HorizontalAlignment="Left"
Text="{Binding Path=BusinessDataObject.Position}"/>
<TextBlock Grid.Row="0" Grid.Column="2" Margin="0,0,0,0"
HorizontalAlignment="Right"
TextAlignment="Left"
Text="{Binding Path=BusinessDataObject.Phone}"/>
<TextBlock Grid.Row="1" Grid.Column="2" Margin="0,0,0,0"
HorizontalAlignment="Right"
TextAlignment="Left"
Text="{Binding Path=BusinessDataObject.Mobile}"/>
</Grid>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
Category should be left, Phone & Mobile should be on the right and Name & Position should fill the whole space that is left. It seems to be that there is no "whole" space within the Items although they optically fill the space of the listboxes width.
Could anyone help me? I'm getting mad about this. :-(
Edit: Picture

Try setting the HorizontalContentAlignment for the ListBoxItem to Stretch. Something like the one in this link except using "ListBox" and "ListBoxItem":

Resources