Question

我正在使用超棒的MahAppsMetro WPF控件套件。我有一个加载文件系统的树视图。我还想在TreeViewItem中显示图像，所以我已经覆盖了地铁树样式，如下所示

<UserControl x:Class="GDE.Tree.TreeView"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             xmlns:Caliburn="http://www.caliburnproject.org"
             xmlns:Metro="http://metro.mahapps.com/winfx/xaml/controls"
             mc:Ignorable="d" 
             d:DesignHeight="300" 
             d:DesignWidth="300">
    <UserControl.Resources>
        <HierarchicalDataTemplate x:Key="TreeTemplate" ItemsSource="{Binding Path=Children}"/>
    </UserControl.Resources>

    <!--TreeView-->
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>
        <TextBox Grid.Row="0" 
                 Margin="5"
                 IsReadOnly="True"
                 Text="{Binding SelectedPath, Mode=TwoWay}"/>
        <TreeView Grid.Row="1"
                  Margin="5"
                  ItemsSource="{Binding RootChildren}" 
                  ItemTemplate="{StaticResource TreeTemplate}">
            <TreeView.Resources>
                <Style TargetType="{x:Type TreeViewItem}" 
                       BasedOn="{StaticResource MetroTreeViewItem}">
                    <Setter Property="HeaderTemplate">
                        <Setter.Value>
                            <DataTemplate>
                                <StackPanel Orientation="Horizontal">
                                    <Image Name="img"
                                           Width="16"
                                           Height="16"
                                           Stretch="Fill"
                                           Source="{Binding Path=Icon, Mode=OneTime}"
                                           VerticalAlignment="Center"
                                           HorizontalAlignment="Center"/>
                                    <TextBlock Text="{Binding DisplayName, Mode=OneTime}" 
                                               Margin="5,0,0,0" 
                                               VerticalAlignment="Center" 
                                               HorizontalAlignment="Left"/>
                                </StackPanel>
                            </DataTemplate>
                        </Setter.Value>
                    </Setter>
                </Style>
            </TreeView.Resources>
        </TreeView>
    </Grid>
</UserControl>

但这似乎没有按预期工作，我无法弄清楚原因。从这个XAML，我没有绑定错误，视觉效果如下：

TreeView

我已经更广泛地使用了XAML标记，但我得到了完全相同的视觉效果。 如何更改上面的XAML以提供Image / TextBlocks以及MahApps的外观？

感谢您的时间。

Answer 1

要总结评论而不是更改Style，您需要将StackPanel从DataTemplate直接移至HierarchicalDataTemplate，因为目前使用的模板没有内容：

<HierarchicalDataTemplate x:Key="TreeTemplate" ItemsSource="{Binding Path=Children}">
    <StackPanel Orientation="Horizontal">
        <Image Name="img" ... />
        <TextBlock Text="{Binding DisplayName, Mode=OneTime}" ... />
    </StackPanel>
</HierarchicalDataTemplate>

覆盖WPF TreeView项的样式

1 个答案: