登录
当前位置： 首页 > 知识库问答 >
问题：

WPF树视图复杂层次结构

陆烨磊
2023-03-14

我在我的应用程序中使用MVVM模式。我有以下（简化版）VM类：

public class MainModule_VM
{
    ...

    public ObservableCollection<Module2601_VM> ListModules{...}

    ...
}

public class Module2601_VM
{
    ...

    public string GatewayName {...}
    public string FirmwareVersion{...}
    public string IPAddress{...}
    public string NbIoms{...}
    public ObservableCollection<Module2610_VM> ListModules{...}
    public ObservableCollection<ComPort_VM> ListCOM{...}

    ...
}

public class Module2610_VM
{
    ...

    public string ModuleName{...}

    ...
}

public class ComPort_VM
{
    ...

    public string ComPortName{...}

    ...
}

因此，一个Module2601_VM包含几个属性，以及Module2610_VM和ComPort_VM对象的列表。

我有一个MainModule_VM类中Module2601_VM对象的列表。

我想将这个Module2601集合及其子项绑定到树状视图中，并使用以下层次结构：

网关：

  • 网关#0
  • COM#1

我的问题是，我的层次结构正常，但无法选择子项。它把任何关卡物品和它的所有子项作为一个大物品。我知道这是因为我的itemTemplate，但我没能解决这个问题。以下是xaml（在代码隐藏中设置的DataContext）：

<TreeView Name="treeView1" >
    <TreeViewItem Header="Gateways" ItemsSource="{Binding ListMM}">
        <TreeViewItem.ItemTemplate>
            <DataTemplate>
                <TreeViewItem Header="{Binding GatewayName, Mode=OneWay}" IsExpanded="True">
                    <TreeViewItem Header="{Binding Path=Gateway.IPAddress, Mode=OneWay}"/>
                    <TreeViewItem Header="{Binding Path=Gateway.FirmwareVersion, Mode=OneWay}"/>
                    <TreeViewItem Header="{Binding Path=Gateway.NumberIoms, Mode=OneWay}"/>
                    <TreeViewItem Header="MIOs" ItemsSource="{Binding ListModules, Mode=OneWay}">
                        <TreeViewItem.ItemTemplate>
                            <DataTemplate>
                                <TextBlock Text="{Binding ModuleName, Mode=OneWay}" />
                            </DataTemplate>
                        </TreeViewItem.ItemTemplate>
                    </TreeViewItem>
                    <TreeViewItem Header="COM" ItemsSource="{Binding ListCOM, Mode=OneWay}">
                        <TreeViewItem.ItemTemplate>
                            <DataTemplate>
                                <TextBlock Text="{Binding Path=PortCom.ComP, Mode=OneWay}"/>
                            </DataTemplate>
                        </TreeViewItem.ItemTemplate>
                    </TreeViewItem>
                </TreeViewItem>      
            </DataTemplate>
        </TreeViewItem.ItemTemplate>
    </TreeViewItem>                   
</TreeView>

有了这个，我无法选择子项，它看起来像这样：图片

现在有了以下示例，其中我只有一个Module2601_VM项目在我的树视图，这一切都很好，我可以选择个别项目：

<TreeView Name="treeView2">
    <TreeViewItem Header="Gateways">
        <TreeViewItem Header="{Binding GatewayName, Mode=OneWay}">
            <TreeViewItem Header="{Binding Path=IPAddress, Mode=OneWay}"/>
            <TreeViewItem Header="{Binding Path=FirmwareVersion, Mode=OneWay}"/>
            <TreeViewItem Header="{Binding Path=NumberIoms, Mode=OneWay}"/>
            <TreeViewItem Header="MIOs" ItemsSource="{Binding ListModules, Mode=OneWay}">
                <TreeViewItem.ItemTemplate>
                    <DataTemplate>
                        <TextBlock Text="{Binding ModuleName, Mode=OneWay}" />
                    </DataTemplate>
                </TreeViewItem.ItemTemplate>
            </TreeViewItem>
            <TreeViewItem Header="COM" ItemsSource="{Binding ListCOM, Mode=OneWay}">
                <TreeViewItem.ItemTemplate>
                    <DataTemplate>
                        <TextBlock Text="{Binding Path=ComPortName, Mode=OneWay}"/>
                    </DataTemplate>
                </TreeViewItem.ItemTemplate>
            </TreeViewItem>
        </TreeViewItem>
    </TreeViewItem>
</TreeView>

我怎样才能让我的treeview像treeview一样，但具有treeview 2选择功能？HierarchycalDataTemplate在此处不起作用，因为子项的类型不同。谢谢

共有1个答案

能可人
2023-03-14

为了实现您描述的TreeView演示，我认为您应该使用“隐式”DataTemplate机制和Hierarchy DataTemplate。

关于第一点，我将创建几个类，为您的可观察集合提供一个“简单”类型：

public class Module2610_VMCollection : ObservableCollection<Module2610_VM>
{
}

public class ComPort_VMCollection : ObservableCollection<ComPort_VM>
{
}

那么Module2601_VM类会变成：

public class Module2601_VM
{
    /* ... */

    public string GatewayName {get; set;}
    public string FirmwareVersion { get; set; }
    public string IPAddress { get; set; }
    public string NbIoms { get; set; }
    public Module2610_VMCollection ListModules { get; set; }
    public ComPort_VMCollection ListCOM { get; set; }

    /* ... */
}

实际上，您的ViewModel并没有反映您希望在UI中显示的结构，因此我想您需要一个类来“描述”模块2601_VM的子级。诸如此类：

public class Module2601_VMChildrenDescriptor : IEnumerator, IEnumerable
{
    private readonly Module2601_VM module2601_VM;
    private int i = -1;

    public Module2601_VMChildrenDescriptor(Module2601_VM module2601_VM)
    {
        this.module2601_VM = module2601_VM;
    }

    public object Current
    {
        get
        {
            switch (i)
            {
                case 0:
                    return module2601_VM.GatewayName;
                case 1:
                    return module2601_VM.FirmwareVersion;
                case 2:
                    return module2601_VM.IPAddress;
                case 3:
                    return module2601_VM.NbIoms;
                case 4:
                    return module2601_VM.ListModules;
                case 5:
                    return module2601_VM.ListCOM;
            }

            return null;
        }
    }

    public bool MoveNext()
    {
        return ++i < 6;
    }

    public void Reset()
    {
        i = -1;
    }

    public IEnumerator GetEnumerator()
    {
        return this;
    }
}

因此，完整的视图模型将是：

public class Module2601_VM
{
    private Module2601_VMChildrenDescriptor module2601_VMChildrenDescriptor;
    public Module2601_VM()
    {
        module2601_VMChildrenDescriptor = new Module2601_VMChildrenDescriptor(this);
        ListModules = new Module2610_VMCollection();
        ListCOM = new ComPort_VMCollection();
    }

    public string GatewayName {get; set;}
    public string FirmwareVersion { get; set; }
    public string IPAddress { get; set; }
    public string NbIoms { get; set; }
    public Module2610_VMCollection ListModules { get; set; }
    public ComPort_VMCollection ListCOM { get; set; }

    public IEnumerable Children
    {
        get
        {
            return module2601_VMChildrenDescriptor;
        }
    }
}

现在，您只需要将XAML中的Data模板声明为TreeView控件的资源：

<TreeView ItemsSource="{Binding Path=ListModules}">
    <TreeView.Resources>
        <HierarchicalDataTemplate DataType="{x:Type local:Module2601_VM}" ItemsSource="{Binding Path=Children, Mode=OneWay}">
            <TextBlock Text="Module2601_VM" Margin="1" />
        </HierarchicalDataTemplate>
        <DataTemplate DataType="{x:Type sys:String}">
            <TextBlock Text="{Binding Mode=OneWay}" Margin="1" />
        </DataTemplate>
        <DataTemplate DataType="{x:Type local:Module2610_VM}">
            <TextBlock Text="{Binding Path=ModuleName, Mode=OneWay}" Margin="1" />
        </DataTemplate>
        <HierarchicalDataTemplate DataType="{x:Type local:Module2610_VMCollection}" ItemsSource="{Binding Mode=OneWay}">
            <TextBlock Text="ListModules" Margin="1" />
        </HierarchicalDataTemplate>

        <DataTemplate DataType="{x:Type local:ComPort_VM}">
            <TextBlock Text="{Binding Path=ComPortName, Mode=OneWay}" Margin="1" />
        </DataTemplate>
        <HierarchicalDataTemplate DataType="{x:Type local:ComPort_VMCollection}" ItemsSource="{Binding Mode=OneWay}">
            <TextBlock Text="ComPort_VM" Margin="1" />
        </HierarchicalDataTemplate>
    </TreeView.Resources>
</TreeView>

现在TreeView的每个节点都是可选择的。我希望有帮助。

 类似资料：
  • WPF树视图选择整个层次结构

    我有一个绑定到MVVM可观察集合的TreeView。我的项目模板由图像和文本块组成，如以下代码所示： 当然，发生这种情况是因为堆栈面板现在位于选择区域上方。 有什么解决办法吗？

  • 顺序sql树层次结构

    问题内容： 像这样对表格进行排序的最佳方法是什么： 要通过分级排序，它 的ID 或 名字 ： “比萨饼” //节点1 “piperoni” //节点1.1 “奶酪” //节点1.2 “额外的奶酪” //节点1.2.1 “vegetariana” //节点1.3 “汉堡” //节点2 ‘咖啡’//节点3 编辑： 名称 末尾的数字是为了更好地可视化strucutre，而不是用于排序。 编辑2： 正如多

  • 如何为继承层次结构创建视图

    我想不出为继承层次结构创建视图方法。如果我像下面的代码一样创建类层次结构，那么我就不能从bview.set（...）中正确使用B类的方法和属性而不进行强制转换，因为BView是从AView继承的。和Set method signature接受A类型的变量,但在BView中我希望设置B类型的变量。我该如何解决我的问题？ 谢谢你。：3

  • Xcode 7.3中的调试视图层次结构失败

    问题内容： 此函数失败，并显示运行时错误： 有人遇到过吗？ UPD： 在模拟器iOS 8.1 / 8.4上失败。9.3工作正常。 UPD2： 创建如下： 问题答案： 通过在项目中放置以下修复程序，我使视图调试器再次工作： 当您的项目加载时，该方法将执行，如果当前尚未实现，则会导致并使用该实现，因此，视图调试使iOS8拥有了所寻找的行为。 要将其添加到您自己的项目中，请在您的项目中创建一个新的空Ob

  • 创建基于层次结构/ CTE使用的视图

    问题内容： 是否可以基于层次结构/ cte创建视图？ 我看过一个有关如何基于链接递归查询生成结果集的示例。 我已经附上了ddl和声明。 谢谢你， 埃尔默 问题答案： 后已被指定（超出右括号），您需要选择从CTE的所有值： 这是构成视图的实际选择查询。 这是一个完整的工作示例，其中选择了视图的最终输出，以及一些其他语句，以允许这些语句在SQL Server Management Studio中一次执

  • 复制Tkinter树视图

    我正尝试在另一个窗口中显示ttk树视图。唯一的选择似乎是遍历原始的树视图并相应地填充新的树视图。 然而，我似乎不能得到所有的（许多）子文件夹在正确的地方，所有的东西都是混淆的2D级别（即，我得到根文件夹和他们的子代正确，然后子文件夹似乎插入在随机的位置）。

相关问答

WPF：使带有树视图的UserControl的行为像香草树视图一样只有创建视图层次结构的原始线程才能接触其视图异常[重复]WPF在树视图中操作选定的项目Android错误：只有创建视图层次结构的原始线程才能接触其视图[重复]Android片段-只有创建视图层次结构的原始线程才能接触其视图[重复]

相关文章

尝试呈现ViewController，其视图不在Windows层次结构中将网址字符串解析为树层次结构将JSON对象层次结构反序列化为Dictionary层次结构SQL中简单视图和复杂视图之间的区别如何使用多级SQL创建类别树层次结构？

相关阅读

时间复杂度和空间复杂度树型结构目录GWT 复杂组件数据结构的树存储结构Tableau树形图

相关工具

多层次图像分割视图连续两次滑动WPFwpf-math视差滚动视图

相关文档

复杂性思维JackySummer 技术学习记录、随笔、总结、杂记Python OpenCV 图像和视频分析树莓派与 LinuxPython 数据结构
快捷导航： 新手教程 算法原理 架构设计 Java进阶 数据库进阶 大厂专栏 面试经验 编程笔记 编程问答 所有专题 文档资料 工具软件 电子书籍 小牛导航
在线工具： 房贷计算器 个税计算器 Linux命令查询 Json格式化 正则表达式 颜色转换 AES加解密 SHA1加密 MD5加密 毒鸡汤 字数统计 随机密码生成 进制转换 Base64编解码 励志句子
Copyright © 2019-2024 小牛知识库@xnip.cn. All Rights Reserved.