2

我在 WPF 中使用 MahApps Metro Styling 并尝试向 TreeViewItem 添加样式，以便节点旁边有一个文件夹图标。( http://mahapps.com/MahApps.Metro/ )

这相当简单，我所要做的就是覆盖 TreeViewItem 标题模板并添加到图像中。

问题是由于某种原因，新模板未应用于树中的第一个条目，正如您所看到的那样：

树视图项样式

所有其他树节点工作正常，但第一个拒绝应用样式。

我已经确认这与 Controls.TreeView.xaml 中包含的 MahApps TreeView 样式有关（一个没有 MahApps 但具有与预期相同的自定义样式的新项目），但我无法确切看到发生了什么。

有没有人在使用 MahApps 时有任何造型 TreeViewItems 的经验？

<TreeView Grid.Column="0" Name="FolderView">

        <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="Images/Folder.png"
                                    Margin="3"   
                                    VerticalAlignment="Center"
                                   />
                                <TextBlock Text="{Binding}" Margin="0,0" VerticalAlignment="Center" />
                            </StackPanel>
                        </DataTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
        </TreeView.Resources>
    </TreeView>
4

2 回答 2

1

试试这个`

<TreeView Grid.Column="0" Name="FolderView">
        <TreeView.Resources>
            <Style TargetType="{x:Type TreeViewItem}">
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="TreeViewItem">
                            <Grid Background="Transparent">
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition MinWidth="25" Width="Auto" />
                                    <ColumnDefinition Width="Auto"/>
                                    <ColumnDefinition Width="*"/>
                                </Grid.ColumnDefinitions>
                                <Grid.RowDefinitions>
                                    <RowDefinition Height="Auto"/>
                                    <RowDefinition/>
                                </Grid.RowDefinitions>
                                <ToggleButton x:Name="Expander"  IsChecked="{Binding Path=IsExpanded,RelativeSource={RelativeSource TemplatedParent}}" ClickMode="Press">
                                    <ToggleButton.Style>
                                        <Style TargetType="ToggleButton">
                                            <Setter Property="Template">
                                                <Setter.Value>
                                                    <ControlTemplate TargetType="ToggleButton">
                                                        <Border Height="0" Width="0"/>
                                                    </ControlTemplate>
                                                </Setter.Value>
                                            </Setter>
                                        </Style>
                                    </ToggleButton.Style>
                                </ToggleButton>
                                <ContentPresenter x:Name="PART_Header" ContentSource="Header"/>
                                <Grid x:Name="ItemsHost" Grid.Row="1" Grid.Column="1" Grid.ColumnSpan="2"  Margin="0,-5,0,0">
                                    <ItemsPresenter />
                                </Grid>
                            </Grid>
                            <ControlTemplate.Triggers>
                                <Trigger Property="IsExpanded" Value="false">
                                    <Setter TargetName="ItemsHost" Property="Visibility"  Value="Collapsed"/>
                                </Trigger>
                                <Trigger Property="HasItems"  Value="false">
                                    <Setter TargetName="Expander" Property="Visibility" Value="Hidden"/>
                                </Trigger>
                            </ControlTemplate.Triggers>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
                <Setter Property="HeaderTemplate">
                    <Setter.Value>
                        <DataTemplate>
                            <StackPanel Orientation="Horizontal">
                                <Image Name="img" Width="16" Height="16" Stretch="Fill" Source="Images/Folder.png" Margin="3" VerticalAlignment="Center"/>
                                <TextBlock Text="{Binding}" Margin="0,0" VerticalAlignment="Center" />
                            </StackPanel>
                        </DataTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
        </TreeView.Resources>
    </TreeView>
于 2013-12-28T22:17:17.923 回答
0

我找到了解决方案：

您需要像这样禁用 MahApps Metro 风格：Style="{x:Null}"

<TreeView Style="{x:Null}" Grid.Column="0" Grid.Row="1" >
<TreeView.Resources>
    <Style TargetType="{x:Type TreeViewItem}">
        <Setter Property="HeaderTemplate">
            <Setter.Value>
                <DataTemplate>
                    <StackPanel Orientation="Horizontal">
                        <Image Width="20" Height="20" Stretch="Fill" Source="/Resources/folder.png" />
                        <TextBlock Text="{Binding}" />
                    </StackPanel>
                </DataTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</TreeView.Resources>
</TreeView>
于 2015-07-29T17:59:35.850 回答