在Winform界面中使用DevExpress的TreeList實現節點過濾查詢的兩種方式

在我較早的一篇隨筆《在DevExpress程序中使用TeeList控件以及節點查詢的處理》中，介紹了在樹形列表TreeList控件上面，利用SearchControl實現節點的模糊查詢過濾操做，效果仍是很是不錯的，TreeList功能比較強大，界面也相對比微軟內置的Winform的TreeView控件美觀很多。後來在一次偶然過程當中，發現TreeList控件自己就能夠打開頭部過濾輸入，實現節點的快速過濾，不過過濾是徹底匹配方式，和咱們常規的模糊匹配思路不同，本篇隨筆介紹對TreeList控件常規過濾方式的改進，支持內置輸入過濾框中實現節點的模糊查詢過濾操做。

一、利用SearchControl實現節點的模糊查詢過濾回顧

我在隨筆《在DevExpress程序中使用TeeList控件以及節點查詢的處理》中介紹了整個開發的步驟和思路，最終的實現效果以下所示。

上面那個界面是以前案例的效果，新版本目前已經把不匹配的過濾掉了，最終效果以下所示。

 

 若是咱們忽略樹列表的初始化操做和綁定數據源的部分，那麼實現這個功能，主要的步驟就是在TreeList控件上面增長一個SearchControl的控件，並通代碼初始化事件處理便可，以下代碼所示。

/// <summary>
/// 實現樹節點的過濾查詢
/// </summary>
private void InitSearchControl()
{
    this.searchControl1.Client = this.tree;
    this.tree.FilterNode += (object sender, DevExpress.XtraTreeList.FilterNodeEventArgs e) =>
    {
        if (tree.DataSource == null)
            return;

        string nodeText = e.Node.GetDisplayText("Name");//參數填寫FieldName  
        if (string.IsNullOrWhiteSpace(nodeText))
            return;

        bool isExist = nodeText.IndexOf(searchControl1.Text, StringComparison.OrdinalIgnoreCase) >= 0;
        if (isExist)
        {
            var node = e.Node.ParentNode;
            while (node != null)
            {
                if (!node.Visible)
                {
                    node.Visible = true;
                    node = node.ParentNode;
                }
                else
                    break;
            }
        }
        e.Node.Visible = isExist;
        e.Handled = true;
    };
}

雖然實現的效果很是不錯，不過麻煩的地方就是須要本身添加一個控件，並處理好佈局和控件的初始化代碼，稍顯麻煩一些。

下面的處理方式就是打開內置的過濾輸入框，並經過代碼的方式實現模糊查詢的方式過濾操做。

 

二、利用TreeList控件內置過濾方式實現模糊查詢過濾

上面介紹了一種擴展方式實現節點的模糊查詢，咱們也能夠利用TreeList控件自己具備的節點過濾框控件來實現TreeList控件節點的過濾。

在TreeList控件設計模式下，打開並設置 OptionsView.ShowAutoFilterRow、OptionsBehavior.EnableFiltering爲True就能夠看到樹形控件頂部增長一個內置的控件顯示了，以下界面所示。

也能夠經過代碼方式進行打開。

   this.treeList1.OptionsView.ShowAutoFilterRow = true;//顯示過濾行            
   this.treeList1.OptionsBehavior.EnableFiltering = true;//開啓過濾功能

能夠看到頂部多了一個輸入框，默認的事件就支持對節點的過濾操做，不過是節點名稱徹底匹配，相似Equal的處理方式，這個和咱們常規須要的操做方式不一樣，那麼就須要進行必定的改進了。

TreeList控件提供ColumnFilterChanged事件進行自定義的過濾操做，咱們在其中實現咱們想要的部分匹配，也就是模糊查詢方式的處理便可。

            this.treeList1.ColumnFilterChanged += (s, e) => //自定義過濾事件
            {                
                var tree = (TreeList)s;
                if (tree != null && tree.ActiveEditor != null)
                {
                    string newKey = tree.ActiveEditor.EditValue.ToString();
                    tree.FilterNodes();

                    var operation = new FilterNodeOperation(newKey ?? "");
                    tree.NodesIterator.DoOperation(operation);
                }
            };

其中FilterNodeOperation 是咱們自定義的一個過濾節點操做對象，具體的定義代碼以下所示。

    /// <summary>
    /// 過濾節點操做類
    /// </summary>
    class FilterNodeOperation : TreeListOperation
    {
        string pattern;
        public FilterNodeOperation(string _pattern) { pattern = _pattern; }

        public override void Execute(TreeListNode node)
        {
            if (NodeContainsPattern(node, pattern))
            {
                node.Visible = true;
                if (node.ParentNode != null)
                {
                    node.ParentNode.Visible = true;
                }
            }
            else
            {
                node.Visible = false;
            }
        }

        /// <summary>
        /// 模糊包含模式
        /// </summary>
        bool NodeContainsPattern(TreeListNode node, string pattern)
        {
            foreach (TreeListColumn col in node.TreeList.Columns)
            {
                if (node.GetValue(col).ToString().ToUpper().Contains(pattern.ToUpper()))
                {
                    return true;
                }
            }
            return false;
        }
    }

根據上面的操做，作了一個過濾節點的Demo界面。

常規沒有過濾的界面效果以下所示。

 TreeList節點過濾後，界面效果以下所示。

對比以前的SearchControl實現的效果，這裏面沒有文本的高亮顯示，不過顯示也仍是比較直觀。

整個TreeList的控件處理代碼以下所示，貼出供你們參考學習。

        /// <summary>
        /// 初始化樹
        /// </summary>
        private void InitTree()
        {
            this.treeList1.OptionsBehavior.Editable = false;
            this.treeList1.OptionsView.EnableAppearanceOddRow = true;
            this.treeList1.OptionsView.EnableAppearanceEvenRow = true;
            this.treeList1.OptionsView.RowImagesShowMode = RowImagesShowMode.InCell;//緊湊型圖標
            this.treeList1.ExpandAll();

            // 列過濾處理            
            this.treeList1.OptionsView.ShowAutoFilterRow = true;//顯示過濾行            
            this.treeList1.OptionsBehavior.EnableFiltering = true;//開啓過濾功能
            this.treeList1.ColumnFilterChanged += (s, e) => //自定義過濾事件
            {                
                var tree = (TreeList)s;
                if (tree != null && tree.ActiveEditor != null)
                {
                    string newKey = tree.ActiveEditor.EditValue.ToString();
                    tree.FilterNodes();

                    var operation = new FilterNodeOperation(newKey ?? "");
                    tree.NodesIterator.DoOperation(operation);
                }
            };

            //初始化樹節點選擇事件
            this.treeList1.FocusedNodeChanged += (s, e) =>
            {
                this.FocusedNodeChanged(s, e);
            };
        }

        private void FocusedNodeChanged(object s, FocusedNodeChangedEventArgs e)
        {
            var tree = (TreeList)s;
            if (tree != null && tree.FocusedNode != null)
            {
                //選中節點文本
                var text = tree.FocusedNode.GetDisplayText(0);
                switch (text)
                {
                    case "採血":
                        ChildWinManagement.LoadMdiForm(this, typeof(FrmOrganization));
                        break;
                    default:
                        break;
                }
            }
        }

這些就是Winform中一些界面處理的技巧，DevExpress界面控件的功能仍是很是不錯的，咱們基類一些界面的處理技巧，能夠極大提升用戶的體驗效果，同時提升咱們軟件的內在價值。