[转] 自定义用户控件, TreeView -- 转自: http://www.cnblogs.com/lanbo/articles/1547518.html

前段时间项目中要用到了Treeview，但是用.net自带的Treeview 控件时会产生很多不需要的客户端脚本，而且用起来也比较麻烦，所以就决定自己写一个自定义控件。
下面是源代码：

1.类TreeNode

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;

namespace Boco.WebControls
{
    public class BocoTreeNode
    {
        私有变量#region 私有变量

        private string _nodeValue = string.Empty;
        private string _nodeName = string.Empty;
        private string _imageUrl = string.Empty;
        private List<BocoTreeNode> _childNodes = null;
        private string _navigateUrl = string.Empty;
        private string _target = "_blank";
        #endregion

        构造函数#region 构造函数
        public BocoTreeNode()
        {
        }

        public BocoTreeNode(string nodeValue,string nodeName)
        {
            _nodeValue = nodeValue;
            _nodeName = nodeName;
        }

        public BocoTreeNode(string nodeValue, string nodeName, string imageUrl)
        {
            _nodeValue = nodeValue;
            _nodeName = nodeName;
            _imageUrl = imageUrl;
        }
        public BocoTreeNode(string nodeValue, string nodeName, string imageUrl,string navigateUrl)
        {
            _nodeValue = nodeValue;
            _nodeName = nodeName;
            _imageUrl = imageUrl;
            _navigateUrl = navigateUrl;
        }
        #endregion

        公有属性#region 公有属性
        public string NodeValue
        {
            get 
            {
                return _nodeValue;
            }
            set
            {
                _nodeValue = value;
            }
        }

        public string NodeName
        {
            get
            {
                return _nodeName;
            }
            set
            {
                _nodeName = value;
            }
        }

        public string ImageUrl
        {
            get
            {
                return _imageUrl;
            }
            set
            {
                _imageUrl = value;
            }
        }

        public List<BocoTreeNode> ChildNodes
        {
            get 
            {
                if(_childNodes == null)
                    _childNodes = new List<BocoTreeNode>();
                return _childNodes; 
            }
        }

        //public BocoTreeNode ParentNode
        //{
        //    get
        //    { 
        //        this.
        //    }
        //}

        //public int Depth(BocoTreeView TreeView)
        //{
        //    TreeView.
        //}

        public string NavigateUrl
        {
            get 
            {
                return _navigateUrl;
            }
            set
            {
                _navigateUrl = value;
            }
        }

        public string Target
        {
            get
            {
                return _target;
            }
            set
            {
                _target = value;
            }
        }
        #endregion
    }
}

2.类TreeView

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.ComponentModel;
using System.Web.UI;
using System.IO;
using System.Web;

namespace Boco.WebControls
{
    [DefaultProperty("Text"), ToolboxData("<{0}:BocoTreeView runat=server ID=Tree></{0}:BocoTreeView><asp:HiddenField  runat=\"server\" ID=\"hidTreeViewCheckedValueStr\"/>")]
    public class BocoTreeView : System.Web.UI.WebControls.WebControl
    {
        公共属性#region 公共属性
        
        private BocoTreeNode _rootNode = null;
        /**//// <summary>
        /// 根节点(每个TreeView只有一个根节点)
        /// </summary>
        public BocoTreeNode RootNode
        {
            get { return _rootNode; }
            set { _rootNode = value; }
        }

        private string _rootImgUrl = string.Empty;
        /**//// <summary>
        /// 根节点的图片
        /// </summary>
        public string RootImgUrl
        {
            get
            {
                if (string.IsNullOrEmpty(_rootImgUrl))
                    _rootImgUrl = "Images/TreeRoot.gif";
                return _rootImgUrl;
            }
            set
            {
                _rootImgUrl = value;
            }
        }

        private string _limbOpenImgUrl = string.Empty;
        /**//// <summary>
        /// 枝节点打开时的图片
        /// </summary>
        public string LimbOpenImgUrl
        {
            get
            {
                if (string.IsNullOrEmpty(_limbOpenImgUrl))
                    _limbOpenImgUrl = "Images/TreeOpen.gif";
                return _limbOpenImgUrl;
            }
            set
            {
                _limbOpenImgUrl = value;
            }
        }

        private string _limbCloseImgUrl = string.Empty;
        /**//// <summary>
        /// 枝节点关闭时的图片
        /// </summary>
        public string LimbCloseImgUrl
        {
            get
            {
                if (string.IsNullOrEmpty(_limbCloseImgUrl))
                    _limbCloseImgUrl = "Images/TreeClosed.gif";
                return _limbCloseImgUrl;
            }
            set
            {
                _limbCloseImgUrl = value;
            }
        }

        private string _leafImgUrl = string.Empty;
        /**//// <summary>
        /// 叶子节点的图片
        /// </summary>
        public string LeafImgUrl
        {
            get
            {
                if (string.IsNullOrEmpty(_leafImgUrl))
                    _leafImgUrl = "Images/TreeLeaf.gif";
                return _leafImgUrl;
            }
            set
            {
                _leafImgUrl = value;
            }
        }

        private int _defaultExpandDepth = 1;
        /**//// <summary>
        /// 默认展开深度(default:1)
        /// </summary>
        public int DefaultExpandDepth
        {
            get
            {
                return _defaultExpandDepth;
            }
            set
            {
                _defaultExpandDepth = value;
            }
        }

        new public string Style
        {
            get;
            set;
        }

        private ShowCheckBoxType _checkBoxType = ShowCheckBoxType.None;
        /**//// <summary>
        /// 显示checkbox的类型(default:none)
        /// </summary>
        public ShowCheckBoxType CheckBoxType
        {
            get
            {
                return _checkBoxType;
            }
            set
            {
                _checkBoxType = value;
            }
        }
        #endregion

        私有变量、属性#region 私有变量、属性
        /**//// <summary>
        /// 竖线图片
        /// </summary>
        //private const string TreeLineI = "<img src=\"/main/Images/TreeLineImages/i.gif\"";
        //private const string TreeLineT = "<img src=\"/main/Images/TreeLineImages/t.gif\"";
        //private const string TreeLineL = "<img src=\"/main/Images/TreeLineImages/l.gif\"";
        //private const string TreeBlank = "<img src=\"/main/Images/TreeLineImages/TreeBlank.gif\"";
        private const string TreeLineI = "<img src=\"Images/i.gif\"/>";
        private const string TreeLineT = "<img src=\"Images/t.gif\"/>";
        private const string TreeLineL = "<img src=\"Images/l.gif\"/>";
        private const string TreeBlank = "<img src=\"Images/TreeBlank.gif\"/>";
        private StringBuilder _content = null;
        /**//// <summary>
        /// 存放TreeView的枝干节点和叶子节点生成的Html
        /// </summary>
        private StringBuilder Content
        {
            get
            {
                if (_content == null)
                    _content = new StringBuilder();
                return _content;
            }
            set
            {
                _content = value;
            }
        }
        /**//// <summary>
        /// TreeView内容开始，初始化根节点的Html
        /// </summary>
        private string ContentBegin
        {
            get
            {
                StringBuilder contentBegin = new StringBuilder();
                string RootImgOnClientClick = "TreeViewDivClick('div_0_" + this.RootNode.NodeValue + "');";
                contentBegin.Append("<table border=\"0\" style=\"" + this.Style + "\"><tr><td valign=top><table border=\"0\" cellpadding=\"0\" cellspacing=\"0\" style=\"cursor:hand;\" ><tr><td><img src=\"" + this.RootImgUrl
                    + "\" onclick=\"" + RootImgOnClientClick + "\"></td>");
                if(this.CheckBoxType == ShowCheckBoxType.All || this.CheckBoxType == ShowCheckBoxType.Root)
                    contentBegin.Append("<td><input type=\"checkbox\"  id=\"chk_0_" + this.RootNode.NodeValue + "\"  onclick=\"TreeViewCheckBoxClick(this.id)\"/></td>");
                contentBegin.Append("<td onclick=\"" + RootImgOnClientClick + "\">" + this.RootNode.NodeName + "</td></tr></table>");

                return contentBegin.ToString();
            }
        }

        /**//// <summary>
        /// TreeView内容结束，结束根节点的Html
        /// </summary>
        private string ContentEnd
        {
            get
            {
                StringBuilder contentEnd = new StringBuilder();
                contentEnd.Append("</div>");
                contentEnd.Append("</td></tr></table>");

                return contentEnd.ToString();
            }
        }
        /**//// <summary>
        /// TreeView的客户端脚本
        /// </summary>
        private string JavaScriptContent
        {
            get
            {
                StringBuilder script = new StringBuilder();
                //单击节点时的展开与关闭，并切换杆节点的图片
                script.Append("<script type=\"text/javascript\">");
                script.Append("function TreeViewDivClick(divId)");
                script.Append("{");  
                script.Append("var div = document.getElementById(divId);");  
                script.Append("var divImg = document.getElementById(divId+\"_img\");");  
                script.Append("if(div.style.display == \"none\")");  
                script.Append("{");  
                script.Append("div.style.display = \"block\";");  
                script.Append("if(divImg != null)");  
                script.Append("divImg.src = \""+this.LimbOpenImgUrl+"\";");  
                script.Append("}");  
                script.Append("else");  
                script.Append("{");  
                script.Append("div.style.display = \"none\";");  
                script.Append("if(divImg != null)");  
                script.Append("divImg.src = \""+this.LimbCloseImgUrl+"\";");  
                script.Append("}");  
                script.Append("}"); 
                script.Append(" </script>"); 

                return script.ToString();
            }
            /**////函数原型
            //<script type="text/javascript">
            //    function TreeViewDivClick(divId)
            //    {
            //        var div = document.getElementById(divId);
            //        var divImg = document.getElementById(divId+"_img");
            //        if(div.style.display == "none")
            //        {
            //            div.style.display = "block";
            //            if(divImg != null)
            //                divImg.src = "Images/TreeOpen.gif";
            //        }
            //        else
            //        {
            //            div.style.display = "none";
            //            if(divImg != null)
            //                divImg.src = "Images/TreeClosed.gif";
            //        }
            //    }
            //</script>
        }
        #endregion

        protected override void Render(HtmlTextWriter writer)
        {
            AddAttributesToRender(writer);
            //开始
            writer.Write(this.ContentBegin);
            //内容
            this.GenerateHtmlContent(this.RootNode,"1");
            writer.Write(this.Content.ToString()); 
            //结束
            writer.Write(this.ContentEnd);
           
            //客户端脚本
            writer.Write(this.JavaScriptContent);
        }
        
        /**//// <summary>
        /// 产生Html
        /// </summary>
        /// <param name="ParentNode">父节点</param>
        /// <param name="locus">节点的轨迹，字符串的个数代表深度，字符代表相应级的节点是否为最后一个节点（0：是，1否）</param>
        private void GenerateHtmlContent(BocoTreeNode ParentNode,string locus)
        {
            int ChildNodeCount = ParentNode.ChildNodes.Count;
            if (ChildNodeCount == 0)
                return;
            char[] locusArr = locus.ToCharArray();
            this.Content.Append("<div id=\"div_" + (locusArr.Length-1).ToString() + "_" + ParentNode.NodeValue + "\"");

            int Depth = locusArr.Length;
            //设置默认深度展开的节点
            if (Depth > this.DefaultExpandDepth)
                this.Content.Append("style=\"display:none;\">");
            else
                this.Content.Append("style=\"display;\">");

            for (int i = 0; i < ChildNodeCount; i++)
            {
                string nodeName = ParentNode.ChildNodes[i].NodeName;
                string nodeValue = ParentNode.ChildNodes[i].NodeValue;
                string nodeNavigateUrl = ParentNode.ChildNodes[i].NavigateUrl;
                string nodeTarget = ParentNode.ChildNodes[i].Target;
                string html = "<table border=\"0\" cellpadding=\"0\" cellspacing=\"0\"><tr>";

                for (int m = 1; m < Depth; m++)//补位
                { 
                    if(locusArr[m] == '0')//0表示不是最后一个节点
                        html += "<td>" + TreeLineI + "</td>";
                    else
                        html += "<td>" + TreeBlank + "</td>";
                }
                if (i != ChildNodeCount - 1)
                    html += "<td>" + TreeLineT + "</td>";
                else//每级菜单的最后一个
                    html += "<td>" + TreeLineL + "</td>";

                if (ParentNode.ChildNodes[i].ChildNodes.Count > 0)//枝
                {
                    string ImgId = "div_" + Depth.ToString() + "_" + nodeValue + "_img";
                    string ImgOnClientClick = "TreeViewDivClick('div_" + Depth.ToString() + "_" + nodeValue + "');";
                    if (Depth >= this.DefaultExpandDepth)
                        html += "<td><img src=\"" + this.LimbCloseImgUrl + "\" ";
                    else
                        html += "<td><img src=\"" + this.LimbOpenImgUrl + "\" ";
                    html += "id=\"" + ImgId + "\" onclick=\"" + ImgOnClientClick + "\" style=\"cursor:hand;\"/></td>";
                    if (this.CheckBoxType == ShowCheckBoxType.All)
                        html += "<td><input type=\"checkbox\"  id=\"chk_" + Depth.ToString() + "_" + nodeValue + "\" onclick=\"TreeViewCheckBoxClick(this.id)\"/></td>";
                    html += "<td onclick=\"" + ImgOnClientClick + "\" style=\"cursor:hand;\">" + nodeName + "</td></tr></table>";
                }
                else//叶子
                {
                    html += "<td><img src=\"" + this.LeafImgUrl + "\"/></td>";
                    if (this.CheckBoxType == ShowCheckBoxType.All || this.CheckBoxType == ShowCheckBoxType.Leaf)
                        html += "<td><input type=\"checkbox\"  id=\"chk_" + Depth.ToString() + "_" + nodeValue + "\" onclick=\"TreeViewCheckBoxClick(this.id)\"/></td>";
                    html += "<td><a href=\""+ nodeNavigateUrl + "\" target=\"" + nodeTarget + "\">" + nodeName + "</a></td></tr></table>";
                }
                this.Content.Append(html);
                if (i != ChildNodeCount - 1)
                    this.GenerateHtmlContent(ParentNode.ChildNodes[i],locus+"0");
                else
                    this.GenerateHtmlContent(ParentNode.ChildNodes[i],locus+"1");
            }
            this.Content.Append("</div>");
        }
    }

    public enum ShowCheckBoxType
    {
        All,
        Leaf,
        None,
        Root
    }
}

源码（解决方案）
效果图：