カスタムWPF TreeViewItemスタイルは、DataBoundのときに誤って動作しています

Question

私は自分のニーズに合わせてTreeViewItemStyleを適応させましたが、そのような私のツリービューイテムをハードコードしたとき、それはうまく機能します：

<TreeView Grid.Column="0" 
              HorizontalAlignment="Stretch" 
              Name="treeView1" 
              VerticalAlignment="Stretch" >
        <TreeView.Items>
            <TreeViewItem Header="McDonalds" IsExpanded="True">
                <TreeViewItem.Items>
                    <TreeViewItem Header="Burger" IsExpanded="True" IsSelected="True">
                        <TreeViewItem.Items>
                            <TreeViewItem Header="Meat" />
                        </TreeViewItem.Items>
                    </TreeViewItem>
                </TreeViewItem.Items>
            </TreeViewItem>
            <TreeViewItem Header="KFC" >
                <TreeViewItem.Items>
                    <TreeViewItem Header="Chicken"/>
                </TreeViewItem.Items>
            </TreeViewItem>
            <TreeViewItem Header="Hungry Jacks">
                <TreeViewItem.Items>
                    <TreeViewItem Header="Onion Rings" />
                </TreeViewItem.Items>
            </TreeViewItem>
        </TreeView.Items>
    </TreeView>

（私は画像を投稿できないので、それらにリンクする必要があります）

違いの画像

最初の画像は完璧ですが、2つ目はツリービューをデータビューしようとすると作成されます。以下のコードは、階層データが進む限り正常に機能しますが、私が望むものとは異なる方法で表示されます。

<TreeView DataContext="{Binding TopLevelCategories}">
<TreeView.Resources>
    <HierarchicalDataTemplate DataType="{x:Type model:Category}" ItemsSource="{Binding Path=Category1}">
        <TreeViewItem Header="{Binding Path=Name}" Tag="{Binding}" />
    </HierarchicalDataTemplate>
</TreeView.Resources>

それが作成する不快な効果を見ることができます。

何が問題になっていますか？

私のスタイルは以下にあります（読みやすくするために削除されたブラシとアニメーションの一部）：

    <Style x:Key="{x:Type TreeViewItem}" TargetType="{x:Type TreeViewItem}">
    <Setter Property="Foreground" Value="#FFD0EBFF" />
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type TreeViewItem}">
                <Border x:Name="border1" Padding="1,1,0,0">
                    <Grid Width="Auto" Height="Auto">
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition MinWidth="19" Width="Auto" />
                            <ColumnDefinition Width="*"/>
                        </Grid.ColumnDefinitions>
                        <Grid.RowDefinitions>
                            <RowDefinition Height="0.5*"/>
                            <RowDefinition Height="0.5*"/>
                            <RowDefinition Height="0.5*" />
                        </Grid.RowDefinitions>
                        <ToggleButton x:Name="Expander"
                                      Style="{StaticResource ExpandCollapseToggleStyle}"
                                      IsChecked="{Binding Path=IsExpanded, RelativeSource={RelativeSource TemplatedParent}}"
                                      ClickMode="Press"
                                      Grid.RowSpan="2"/>
                        <Border Grid.Column="1" Grid.RowSpan="2" Background="#FF062B63" CornerRadius="0,0,0,0" x:Name="border1_0" Padding="1" ></Border>
                        <Border Width="Auto" Height="Auto" Grid.Column="1" Grid.RowSpan="2" Margin="1" CornerRadius="0,0,0,0" x:Name="border1_1" Background="{DynamicResource headerNormalGradient}">
                        </Border>
                        <Border SnapsToDevicePixels="True" Grid.Column="1" Grid.Row="0" Margin="1" CornerRadius="0,0,0,0" x:Name="border1_2" Background="{DynamicResource headerNormalGlare}">
                        </Border>
                        <Rectangle x:Name="leftGlare" HorizontalAlignment="Left" Margin="1" Width="1" Stroke="{x:Null}" StrokeThickness="0" Grid.Column="1" Grid.RowSpan="2">
                            <Rectangle.Fill>
                                <LinearGradientBrush EndPoint="0.5,0" StartPoint="0.5,1">
                                    <GradientStop Color="#00C0DAFB" Offset="0"/>
                                    <GradientStop Color="#57CDE2FF" Offset="1"/>
                                </LinearGradientBrush>
                            </Rectangle.Fill>
                        </Rectangle>
                        <Border Grid.Column="1" Grid.RowSpan="2" VerticalAlignment="Stretch" HorizontalAlignment="Stretch">
                            <ContentPresenter Margin="4,3,4,5" ContentSource="Header"/>
                        </Border>
                        <Rectangle x:Name="WhiteRectangle"
                                   HorizontalAlignment="Stretch" 
                                   VerticalAlignment="Stretch" 
                                   Grid.RowSpan="2"
                                   Grid.Column="1" 
                                   Fill="{StaticResource Arrow58}"
                                   Margin="0,0,-1,0" 
                                   Visibility="Hidden"/>
                        <Rectangle x:Name="BlackRectangle" 
                                   HorizontalAlignment="Stretch" 
                                   VerticalAlignment="Stretch" 
                                   Grid.RowSpan="2"
                                   Grid.Column="1" 
                                   Fill="{StaticResource Arrow57}"
                                   Margin="0,0,0,0"
                                   Visibility="Hidden"/>
                        <ItemsPresenter x:Name="ChildItems" Grid.Column="1" Grid.Row="2"/>
                    </Grid>
                </Border>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsExpanded"
                                 Value="false">
                        <Setter TargetName="ChildItems"
                                    Property="Visibility"
                                    Value="Collapsed"/>
                    </Trigger>
                    <Trigger Property="HasItems"
                                 Value="false">
                        <Setter TargetName="Expander"
                                    Property="Visibility"
                                    Value="Hidden"/>
                    </Trigger>
                    <Trigger Property="IsSelected"
                                 Value="true">
                        <Setter TargetName="WhiteRectangle"
                                    Property="Visibility"
                                    Value="Visible" />
                        <Setter TargetName="BlackRectangle"
                                    Property="Visibility"
                                    Value="Visible" />
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

Answer 1

画像の外観から、これはアイテムコンテナの問題になる可能性があります。コレクションをいくつかのアイテムコントロールにバインドすると、コンテナアイテムをデータセットの内部に配置してはなりません。ItemsControlは、適切なコンテナ自体（この場合はツリービューイエム）にデータセットを包みます。
したがって、DataTemplateには別のコンテナがあるため、2つになります。