wuhuacong(伍华聪)的专栏

wuhuacong(伍华聪)的专栏

在我们展示一些参考信息的时候,有所会用树形列表来展示结构信息,如对于有父子关系的多层级部门机构,以及一些常用如字典大类节点,也都可以利用树形列表的方式进行展示,本篇随笔介绍基于WPF的方式,使用TreeView来洗实现结构信息的展示,以及对它的菜单进行的设置、过滤查询等功能的实现逻辑。

1、TreeView树形列表的展示

我们前面随笔介绍到的用户信息的展示,左侧就是一个树形的类表,通过展示多层级的部门机构信息,可以快速的查找对应部门的用户信息,如下界面所示。

循序渐进介绍基于CommunityToolkit.Mvvm 和HandyControl的WPF应用端开发(5) -- 树列表TreeView的使用-LMLPHP

我们来看看界面中树形列表部分的Xaml代码如下所示。

<TreeView
    x:Name="deptTree"
    Margin="0,10,10,0"
    FontSize="16"
    ItemsSource="{Binding ViewModel.FilteredTreeItems}"
    SelectedItemChanged="deptTree_SelectedItemChanged">
    <TreeView.ItemContainerStyle>
        <Style TargetType="{x:Type TreeViewItem}">
            <Setter Property="IsExpanded" Value="True" />
        </Style>
    </TreeView.ItemContainerStyle>
    <TreeView.ItemTemplate>
        <HierarchicalDataTemplate DataType="{x:Type core:OuNodeInfo}" ItemsSource="{Binding Path=Children}">
            <StackPanel Orientation="Horizontal">
                <Button
                    hc:IconElement.Geometry="{StaticResource PageModeGeometry}"
                    Background="Transparent"
                    BorderBrush="Transparent"
                    BorderThickness="0"
                    Style="{StaticResource {x:Static ToolBar.ButtonStyleKey}}" />            
                <Label
                    Padding="-10"
                    Background="Transparent"
                    BorderBrush="Transparent"
                    BorderThickness="0"
                    Content="{Binding Path=Name}" />
            </StackPanel>
        </HierarchicalDataTemplate>
    </TreeView.ItemTemplate>
</TreeView>
09-18 19:39