xpf.datagrid.treelist的基本使用

这几天在完成了JSON序列化合反序列化之后，开始着手进行数据通过WPF显示的工作。dev是一个很好用的第三方插件，功能非常强大，唯一的缺点就是官方的demo要看明白得花费不少的时间。由于我需求的功能暂时不是很复杂，所以在这里我做写了一个简单的demo供自己参考。

<Page
      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:dxg="http://schemas.devexpress.com/winfx/2008/xaml/grid" x:Class="iotmon_wpf.PlantManage.MediManage" 
      mc:Ignorable="d" 
      xmlns:dx="http://schemas.devexpress.com/winfx/2008/xaml/core"  
      dx:ThemeManager.ThemeName="MetropolisDark" d:DesignWidth="1100"
    Title="MediManage" Height="465.672">

    <Grid>

        <dxg:TreeListControl x:Name="myTreeList" AutoPopulateColumns="True" HorizontalAlignment="Left" Width="900" ToolTip="treeList1" Margin="0,0,0,6">
            <dxg:TreeListControl.Columns>
                <dxg:TreeListColumn FieldName="HerbalTypeId" AllowSorting="True"/>
                <dxg:TreeListColumn FieldName="HerbalPlantInfoId" AllowSorting="True"/>
                <dxg:TreeListColumn FieldName="HerbalName" AllowSorting="True"/>
                <dxg:TreeListColumn FieldName="RawHerbalRfidNo" AllowSorting="True"/>
            </dxg:TreeListControl.Columns>
            <dxg:TreeListControl.View   >
                <dxg:TreeListView  x:Name="view" KeyFieldName="Id" ParentFieldName="ParentId" AutoWidth="True" AllowPerPixelScrolling="True" AllowColumnFiltering="False" AutoExpandAllNodes="True" ShowSearchPanelMode="Never" ShowTotalSummary="True"/>
            </dxg:TreeListControl.View>
        </dxg:TreeListControl>
        <Button Content="Button" HorizontalAlignment="Left" Margin="918,439,0,0" VerticalAlignment="Top" Width="75" Click="Button_Click"/>

    </Grid>
</Page>

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;

//序列化需要的引用
using System.Runtime.Serialization;
using System.Runtime.Serialization.Json;
using System.ServiceModel;
using System.ServiceModel.Web;
using System.IO;
using System.Xml;
using System.Net;
using System.Net.Http;
using System.Net.Http.Formatting;
using System.Web.Script.Serialization;
using System.Json;
using DevExpress.Xpf.Grid;
using DevExpress.Utils;


namespace iotmon_wpf.PlantManage
{
    /// <summary>
    /// MediManage.xaml 的交互逻辑
    /// </summary>
    public partial class MediManage : Page
    {
        //契约
        [DataContract]
        public class jsontext
        {
            [DataMember(Order = 0, IsRequired = true)]
            public int total { get; set; }

            [DataMember(Order = 1, IsRequired = true)]
            public mediInfo[] rows { get; set; }
        }

        [DataContract]
        public class mediInfo
        {
            [DataMember(Order=0,IsRequired=true)]
            public int id{ get; set; }

            [DataMember(Order = 1)]
            public int herbalTypeId { get; set; }

            [DataMember(Order = 2)]
            public int herbalPlantInfoId { get; set; }

            [DataMember(Order = 3)]
            public string herbalName { get; set; }

            [DataMember(Order = 4)]
            public string rawHerbalRfidNo { get; set; }

        }


        public MediManage()
        {
            InitializeComponent();
            
        }

        public class MediCollection
        {
            public MediCollection(int herbalTypeId, int herbalPlantInfoId, string herbalName, string rawHerbalRfidNo)
            {
                this.HerbalTypeId = herbalTypeId.ToString();
                this.HerbalPlantInfoId = herbalPlantInfoId.ToString(); ;
                this.HerbalName = herbalName;
                this.RawHerbalRfidNo = rawHerbalRfidNo;
            }
            public string HerbalTypeId { get; set; }
            public string HerbalPlantInfoId { get; set; }
            public string HerbalName { get; set; }
            public string RawHerbalRfidNo { get; set; }
        }


        private void Button_Click(object sender, RoutedEventArgs e)
        {
            string json = string.Empty;

            WebClient webclient = new WebClient();
            if (!webclient.IsBusy)
            {
                webclient.Encoding = System.Text.Encoding.UTF8;//防止乱码
                json = webclient.DownloadString(jsonUri.RawHerbalInfo);
            }

            //反序列化
            var ppp = JSONSerial.parse<jsontext>(json);

            myTreeList.BeginDataUpdate();

            foreach (var item in ppp.rows)
            {
                TreeListNode node = new TreeListNode { Content = new MediCollection(item.id, item.herbalTypeId, item.herbalName, item.rawHerbalRfidNo) };
                view.Nodes.Add(node);
                node.Tag = false;
            }
            
            myTreeList.EndDataUpdate();
        }


    }
}

CS代码里，前面的是关于JSON通讯的，可以不看。关键在于button_click事件中，通过MediCollection这个类绑定了后台的数据，从而能够在前台显示。要注意的是与XAML代码中fieldname属性的大小写要一致，我一开始就犯了这个错。这是最基本的一种动态绑定，看demo应该还可以在xaml代码中直接绑定数据源，这个我会在接下来有空的时候好好研究。