WPF Control Template not being applied to first item rendered

Question

I'm building a WPF application and I have a control template defined in App.XAML for a combobox.

When I start the application, the first combo box that is rendered does not use the style defined in the control template while all other do. Also, the first combo box that I open has an unstyled first item while the rest of the items in that combo box and others are styled.

What am I missing?

Here's the app.xaml:

<Application x:Class="WpfPropertyGrid_Demo.App"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
StartupUri="MainWindow.xaml">
<Application.Resources>
    <ResourceDictionary>
        <ResourceDictionary.MergedDictionaries>

                            <ResourceDictionary>
                                <!--Brushes defined here-->
                            </ResourceDictionary>


                            <ResourceDictionary>
                                <ControlTemplate x:Key="ComboBoxToggleButton" TargetType="ToggleButton">
                                    <Grid>
                                        <Grid.ColumnDefinitions>
                                            <ColumnDefinition />
                                            <ColumnDefinition Width="20" />
                                        </Grid.ColumnDefinitions>
                                        <Border
                                            Grid.ColumnSpan="2"
                                            Background="{StaticResource WindowBackgroundBrush}" />
                                            <Border 
                                                x:Name="Border" 
                                                Grid.Column="1"
                                                Background="{StaticResource WindowBackgroundBrush}" />
                                                <Path 
                                                    x:Name="Arrow"
                                                    Grid.Column="1"     
                                                    Fill="{StaticResource GlyphBrush}"
                                                    HorizontalAlignment="Center"
                                                    VerticalAlignment="Center"
                                                    Data="M 0 0 L 4 4 L 8 0 Z"/>
                                                </Grid>
                                                <ControlTemplate.Triggers>
                                                    <Trigger Property="ToggleButton.IsMouseOver" Value="true">
                                                        <Setter TargetName="Border" Property="Background" Value="{StaticResource ActiveBrush}" />
                                                    </Trigger>
                                                    <Trigger Property="ToggleButton.IsChecked" Value="true">
                                                        <Setter TargetName="Border" Property="Background" Value="{StaticResource ActiveBrush}" />
                                                        <Setter TargetName="Arrow" Property="Fill" Value="{StaticResource ActiveGlyphBrush}" />
                                                    </Trigger>
                                                    <Trigger Property="IsEnabled" Value="False">
                                                        <Setter TargetName="Border" Property="Background" Value="{StaticResource DisabledBackgroundBrush}" />
                                                        <Setter TargetName="Border" Property="BorderBrush" Value="{StaticResource DisabledBorderBrush}" />
                                                        <Setter Property="Foreground" Value="{StaticResource DisabledForegroundBrush}"/>
                                                        <Setter TargetName="Arrow" Property="Fill" Value="{StaticResource DisabledForegroundBrush}" />
                                                    </Trigger>
                                                </ControlTemplate.Triggers>
                                            </ControlTemplate>

                                            <ControlTemplate x:Key="ComboBoxTextBox" TargetType="TextBox">
                                                <Border x:Name="PART_ContentHost" Focusable="False" Background="{TemplateBinding Background}" />
                                            </ControlTemplate>

                                            <Style x:Key="{x:Type ComboBox}" TargetType="ComboBox">
                                                <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="MinHeight" Value="20"/>
                                                <Setter Property="Template">
                                                    <Setter.Value>
                                                        <ControlTemplate TargetType="ComboBox">
                                                            <Grid>
                                                                <ToggleButton 
                                                                    Name="ToggleButton" 
                                                                    Template="{StaticResource ComboBoxToggleButton}" 
                                                                    Grid.Column="2" 
                                                                    Focusable="false"
                                                                    IsChecked="{Binding Path=IsDropDownOpen,Mode=TwoWay,RelativeSource={RelativeSource TemplatedParent}}"
                                                                    ClickMode="Press">
                                                                </ToggleButton>
                                                                <ContentPresenter
                                                                    Name="ContentSite"
                                                                    IsHitTestVisible="False" 
                                                                    Content="{TemplateBinding SelectionBoxItem}"
                                                                    ContentTemplate="{TemplateBinding SelectionBoxItemTemplate}"
                                                                    ContentTemplateSelector="{TemplateBinding ItemTemplateSelector}"
                                                                    Margin="3,3,23,3"
                                                                    VerticalAlignment="Center"
                                                                    HorizontalAlignment="Left" />
                                                                    <TextBox x:Name="PART_EditableTextBox"
                                                                        Style="{x:Null}" 
                                                                        Template="{StaticResource ComboBoxTextBox}" 
                                                                        HorizontalAlignment="Left" 
                                                                        VerticalAlignment="Center" 
                                                                        Margin="3,3,23,3"
                                                                        Focusable="True" 
                                                                        Background="Transparent"
                                                                        Visibility="Hidden"
                                                                        IsReadOnly="{TemplateBinding IsReadOnly}"/>
                                                                        <Popup 
                                                                            Name="Popup"
                                                                            Placement="Bottom"
                                                                            IsOpen="{TemplateBinding IsDropDownOpen}"
                                                                            AllowsTransparency="True" 
                                                                            Focusable="False"
                                                                            PopupAnimation="Slide">
                                                                            <Grid 
                                                                                Name="DropDown"
                                                                                SnapsToDevicePixels="True"                
                                                                                MinWidth="{TemplateBinding ActualWidth}"
                                                                                MaxHeight="{TemplateBinding MaxDropDownHeight}">
                                                                                <Border 
                                                                                    x:Name="DropDownBorder"
                                                                                    Background="{StaticResource ActiveBrush}" />
                                                                                    <ScrollViewer Margin="4,4,4,4" 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="IsEnabled" Value="false">
                                                                                <Setter Property="Foreground" Value="{StaticResource DisabledForegroundBrush}"/>
                                                                            </Trigger>
                                                                            <Trigger Property="IsGrouping" Value="true">
                                                                                <Setter Property="ScrollViewer.CanContentScroll" Value="false"/>
                                                                            </Trigger>
                                                                            <Trigger Property="IsEditable"
                                                                                Value="true">
                                                                                <Setter Property="IsTabStop" Value="false"/>
                                                                                <Setter TargetName="PART_EditableTextBox" Property="Visibility" Value="Visible"/>
                                                                                <Setter TargetName="ContentSite" Property="Visibility" Value="Hidden"/>
                                                                            </Trigger>
                                                                        </ControlTemplate.Triggers>
                                                                    </ControlTemplate>
                                                                </Setter.Value>
                                                            </Setter>
                                                            <Style.Triggers>
                                                            </Style.Triggers>
                                                        </Style>

                                                        <!-- SimpleStyles: ComboBoxItem -->
                                                        <Style x:Key="{x:Type ComboBoxItem}" TargetType="ComboBoxItem">
                                                            <Setter Property="SnapsToDevicePixels" Value="true"/>
                                                            <Setter Property="OverridesDefaultStyle" Value="true"/>
                                                            <Setter Property="Template">
                                                                <Setter.Value>
                                                                    <ControlTemplate TargetType="ComboBoxItem">
                                                                        <Border Name="Border" SnapsToDevicePixels="true">
                                                                            <ContentPresenter />
                                                                        </Border>
                                                                        <ControlTemplate.Triggers>
                                                                            <Trigger Property="IsHighlighted" Value="true">
                                                                                <Setter TargetName="Border" Property="Background" Value="{StaticResource SelectedBackgroundBrush}"/>
                                                                            </Trigger>
                                                                            <Trigger Property="IsEnabled" Value="false">
                                                                                <Setter Property="Foreground" Value="{StaticResource DisabledForegroundBrush}"/>
                                                                            </Trigger>
                                                                            <Trigger Property="IsEnabled" Value="true">
                                                                                <Setter Property="Foreground" Value="{StaticResource ActiveGlyphBrush}"/>
                                                                            </Trigger>
                                                                        </ControlTemplate.Triggers>
                                                                    </ControlTemplate>
                                                                </Setter.Value>
                                                            </Setter>
                                                        </Style>
                                                    </ResourceDictionary>

                                                </ResourceDictionary.MergedDictionaries>
                                            </ResourceDictionary>
                                        </Application.Resources>
                                    </Application>

Here's the actual window xaml:

<Window x:Class="WpfPropertyGrid_Demo.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:sys="clr-namespace:System;assembly=mscorlib"
xmlns:wpg="clr-namespace:System.Windows.Controls"
Title="WpfPropertyGrid Demo" mc:Ignorable="d" ResizeMode="CanResizeWithGrip" 
Width="360" Height="360" MinWidth="360" MinHeight="400">

<Window.Resources>
    <ObjectDataProvider x:Key="SortTypes" MethodName="GetValues" ObjectType="{x:Type sys:Enum}">
        <ObjectDataProvider.MethodParameters>
            <x:Type TypeName="wpg:PropertySort"/>
        </ObjectDataProvider.MethodParameters>
    </ObjectDataProvider>
</Window.Resources>

<Grid HorizontalAlignment="Stretch" VerticalAlignment="Stretch">

    <StackPanel Orientation="Vertical"  Margin="0,20,12,0" HorizontalAlignment="Right" VerticalAlignment="Top">
        <ComboBox Name="ComboSort" Margin="0,3,0,0" Width="95" FontSize="10"
            SelectedIndex="0" ItemsSource="{Binding Source={StaticResource SortTypes}}" />
        <ComboBox Name="ComboSort2" Margin="0,3,0,0" Width="95" FontSize="10"
            SelectedIndex="0" ItemsSource="{Binding Source={StaticResource SortTypes}}" />
    </StackPanel>
</Grid>

Answer 1

Please put your ComboBox style in a separate ResourceDictionary, let say ComboBox.xaml and merge this ComboBox.xaml to the App.xaml.

<Application.Resources>
    <ResourceDictionary>
        <ResourceDictionary.MergedDictionaries>
            <ResourceDictionary Source="ComboBox.xaml"/>
        </ResourceDictionary.MergedDictionaries>
     </ResourceDictionary>
</Application.Resources>

I would suggest to create a separate ResourceDictionary for every control you create your own Template. This way it would be easy to manage your resources.