WPF TreeView - Стиль группы узлов - PullRequest
1 голос
/ 22 июня 2011

У меня есть список типов IList, называемых группами, и у каждой группы есть подсписок типов IList, называемых элементами. И группа, и элемент имеют свойство с именем Name. Для отображения этой иерархии я использую TreeView.

Я хочу отображать каждую группу в иерархии как Расширитель, однако она не отображается так, как я хочу.

Пока мой xaml:

<DataTemplate x:Key="NavItemTemplate">
    <TextBlock Text="{Binding Name}"/>
</DataTemplate>

<HierarchicalDataTemplate x:Key="NavGroupTemplate" ItemsSource="{Binding Items}" ItemTemplate="{StaticResource NavItemTemplate}">
    <TextBlock Text="{Binding Name}"/>
</HierarchicalDataTemplate>

<Style x:Key="RootItemStyle" TargetType="{x:Type TreeViewItem}">
<Setter Property="IsExpanded" Value="True"/>
<Setter Property="Template">
    <Setter.Value>
        <ControlTemplate TargetType="TreeViewItem">
            <Grid>
                <Expander x:Name="Exp" TextElement.FontWeight="Bold" IsExpanded="{TemplateBinding TreeViewItem.IsExpanded}">
                    <Expander.Header>
                        <ContentPresenter x:Name="ExpCP" ContentSource="Header"/>
                    </Expander.Header>
                    <ItemsPresenter/>
                </Expander>

                <Border x:Name="CP" Padding="25,0,0,0" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Visibility="Collapsed">
                    <ContentPresenter ContentSource="Header" HorizontalAlignment="Left" VerticalAlignment="Center" />
                </Border>
            </Grid>

            <ControlTemplate.Triggers>
                <Trigger Property="HasItems" Value="false">
                    <Setter TargetName="Exp" Property="Visibility" Value="Collapsed"/>
                    <Setter TargetName="CP" Property="Visibility" Value="Visible" />
                </Trigger>
                <Trigger Property="IsSelected" Value="True">
                    <Setter Property="Background" Value="Red"/>
                </Trigger>
            </ControlTemplate.Triggers>
        </ControlTemplate>
    </Setter.Value>
</Setter>
</Style>

<TreeView ItemsSource="{Binding}" ItemTemplate="{StaticResource NavGroupTemplate}" ItemContainerStyle="{StaticResource RootItemStyle}">

стиль выше

работает для:

Группа1 (расширитель)

  • Элемент1

Группа2 (расширитель)

...

но не работает (цель):

Группа1 (расширитель)

  • Элемент1

    • SubItem1

Группа2 (расширитель)

...

Также вышеприведенный стиль также нуждается в дальнейшей коррекции. Когда я выбираю сторону границы расширителя, это вызывает событие selecteditem, которое следует предотвратить.

Ответы [ 3 ]

0 голосов
/ 03 октября 2011

Я сделал нечто подобное некоторое время назад, но это было с XmlDataProvider (не совсем ваш сценарий IList). Надеюсь, это поможет немного.

<XmlDataProvider x:Key="MenuDataProvider" XPath="*">
            <x:XData>
                <MainMenu xmlns="">
                    <Admin>
                        <Facility>
                            <Test/>
                        </Facility>
                        <Carpark />
                    </Admin>

                    <Sequence>
                        <Lcd />
                    </Sequence>
                </MainMenu>
            </x:XData>
        </XmlDataProvider>

        <HierarchicalDataTemplate x:Key="NodeTemplate">

            <TextBlock x:Name="tb" />

            <HierarchicalDataTemplate.ItemsSource>
                <Binding XPath="child::node()" />
            </HierarchicalDataTemplate.ItemsSource>

            <HierarchicalDataTemplate.Triggers>

                <DataTrigger Binding="{Binding Path=NodeType}" Value="Text">
                    <Setter TargetName="tb" Property="Text" Value="{Binding Path=Value}"></Setter>
                </DataTrigger>

                <DataTrigger Binding="{Binding Path=NodeType}" Value="Element">
                    <Setter TargetName="tb" Property="Text" Value="{Binding Path=Name}"></Setter>
                </DataTrigger>
            </HierarchicalDataTemplate.Triggers>
    </HierarchicalDataTemplate>

Похоже:

enter image description here

0 голосов
/ 03 октября 2011

Ваш код работает нормально для меня. Я только что удалил ненужный код, добавил поля для дочерних элементов и изменил на жирный только групповые элементы.

 <HierarchicalDataTemplate x:Key="NavGroupTemplate" ItemsSource="{Binding Items}">
            <TextBlock Text="{Binding Name}" />
        </HierarchicalDataTemplate>
        <Style x:Key="RootItemStyle" TargetType="{x:Type TreeViewItem}">
            <Setter Property="IsExpanded" Value="True"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="TreeViewItem">
                        <Grid>
                            <Expander x:Name="Exp" IsExpanded="{TemplateBinding TreeViewItem.IsExpanded}">
                                <Expander.Header>
                                    <ContentPresenter x:Name="ExpCP" ContentSource="Header" TextElement.FontWeight="Bold" />
                                </Expander.Header>
                                <ItemsPresenter />
                            </Expander>
                            <Border x:Name="CP" Padding="35,0,0,0" Background="{TemplateBinding Background}" Visibility="Collapsed">
                                <ContentPresenter ContentSource="Header" HorizontalAlignment="Left" VerticalAlignment="Center" />
                            </Border>
                        </Grid>
                        <ControlTemplate.Triggers>
                            <Trigger Property="HasItems" Value="false">
                                <Setter TargetName="Exp" Property="Visibility" Value="Collapsed"/>
                                <Setter TargetName="CP" Property="Visibility" Value="Visible" />
                            </Trigger>
                            <Trigger Property="IsSelected" Value="True">
                                <Setter Property="Background" Value="Red"/>
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
<TreeView ItemsSource="{Binding}" ItemTemplate="{StaticResource NavGroupTemplate}" ItemContainerStyle="{StaticResource RootItemStyle}">
        </TreeView>

Не могли бы вы описать вашу проблему в деталях, чтобы у меня было больше идей?

0 голосов
/ 30 сентября 2011

Это работает, если вы не укажете ItemTemplate в HierarchicalDataTemplate (левое поле добавлено для фактического просмотра иерархии дерева):

<Grid>
    <Grid.Resources>
        <HierarchicalDataTemplate x:Key="NavGroupTemplate" ItemsSource="{Binding Items}">
            <TextBlock Text="{Binding Name}"/>
        </HierarchicalDataTemplate>

        <Style x:Key="RootItemStyle" TargetType="{x:Type TreeViewItem}">
            <Setter Property="IsExpanded" Value="True"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="TreeViewItem">
                        <Grid Margin="16 0 0 0">
                            <Expander x:Name="Exp" TextElement.FontWeight="Bold" IsExpanded="{TemplateBinding TreeViewItem.IsExpanded}">
                                <Expander.Header>
                                    <ContentPresenter x:Name="ExpCP" ContentSource="Header"/>
                                </Expander.Header>
                                <ItemsPresenter/>
                            </Expander>

                            <Border x:Name="CP" Padding="25,0,0,0" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Visibility="Collapsed">
                                <ContentPresenter ContentSource="Header" HorizontalAlignment="Left" VerticalAlignment="Center" />
                            </Border>
                        </Grid>

                        <ControlTemplate.Triggers>
                            <Trigger Property="HasItems" Value="false">
                                <Setter TargetName="Exp" Property="Visibility" Value="Collapsed"/>
                                <Setter TargetName="CP" Property="Visibility" Value="Visible" />
                            </Trigger>
                            <Trigger Property="IsSelected" Value="True">
                                <Setter Property="Background" Value="Red"/>
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </Grid.Resources>

    <TreeView ItemsSource="{Binding}" ItemTemplate="{StaticResource NavGroupTemplate}" ItemContainerStyle="{StaticResource RootItemStyle}">
    </TreeView>
</Grid>
...