TreeView学习笔记

原创 2003年05月22日 08:28:00

1.什么是TreeView?<?xml:namespace prefix = o ns = "urn:schemas-microsoft-com:office:office" />

   TreeView 是一个 ASP.NET 服务器控件,可以生成用于显示分层数据的用户界面

2.适用的数据结构:

    适用分层的数据集、文件夹视图以及其他类似的数据结构。

3.如何实现TreeView?

   (1)通过声明的方式创建

(2)客户端或服务器上通过编程以多种方式来实现

4TreeView创建方法:

   (1)手动创建

   (2) 使用vs.net中的 TreeView Editor创建

5TreeView元素

   TreeView      定义一个TreeView

   TreeNodeType  定义一个节点类型,适用TreeView中的一个或一组节点

   TreeNode      TreeView中创建一个节点

 注:

   TreeViewTreeNodeTreeNodeType的容器

   这些元素共同定义了数视图的结构、布局、

观。TreeView不能包含这三种元素之外的任何

HTML元素

6编写简单的 TreeView

   (1).创建一个web application,命名为:webcontrols

   (2).创建一个空页面

   (3).添加命名空间引用,即添加 <%@ import namespace="Microsoft.Web.UI.WebControls" %>

   (4).添加@ Register 指令

      即添加:

          <%@ Register TagPrefix="mytree"

Namespace="Microsoft.Web.UI.WebControls"

Assembly="Microsoft.Web.UI.WebControls,Version=1.0.2.226,Culture=neutral, PublicKeyToken=31bf3856ad364e35" %>

   (5). 添加文档结构

       <HTML>

<HEAD></HEAD>

<BODY></BODY>

</HTML>

   (6).添加form

      所有 WebControl 元素必须在一个 FORM 元素中建立

<BODY>

<FORM runat="server"></FORM>

</BODY>

   (7). 添加一个 TreeView 元素。

<BODY>

      <FORM runat="server">

        <mytree:treeview runat="server"></mytree:treeview>

      </FORM>

</BODY>

     (8). TreeView 添加一个 TreeNode

<mytree:treeview runat="server">

          <mytree:treenode text="节点一">

          </mytree:treenode>

</mytree:treeview>

     (9). 添加第二个 TreeNode

<mytree:treeview runat="server">

           <mytree:treenode text="节点一">

                <mytree:treenode text="节点二">

                </mytree:treenode>

           </mytree:treenode>

</mytree:treeview>

7. 数据绑定

    TreeView 也支持数据绑定,因此可以生成动态的内容,下面的示例显示的 TreeView 与前一个示例类似,但没有使用静态内容,而是使用了可扩展标记语言 (XML) 文件来提供 UI 的数据源

<booktree:treeview runat="server"  AutoPostBack="true">

  <booktree:treenode Text="book" AutoPostBack=true "

     Expanded="true" TreeNodeSrc="http:// EventArgs/webcontrols/treeview/book.xml">

  </booktree:treenode>

</booktree:treeview>

 

book.xml 文件包含以下内容:

<TREENODES>

      <treenode Text="CSharp">

         <treenode Text="Deep inside Csharp"/>

         <treenode Text="Advanced Csharp"/>

         <treenode Text="Extend Csharp"/>

      </treenode>

      <treenode Text="VBdotNet" >

         <treenode Text="vb.net leader"/>

         <treenode Text="From vb to vb.net"/>

         <treenode Text="Dotnet with VB.net"/>

      </treenode>

</TREENODES>

8.用 XML SQL Server 进行数据绑定

WebControls 元素也可以使用其他 XML 数据提供程序,如下所示:

<ie:treenode Text="root" type="tree" Expanded="true"

 TreeNodeSrc="http://EventArgs/mySQLXML?sql=execute+sp_bookXML+@pid=1" />

该示例使用了一种更高级的技术。TreeNodeSrc 属性被设置为一个 URL,后者执行 Microsoft SQL Server(tm) 数据库上的一个存储过程来动态生成 XML 数据岛。

9.编程

前面给出的示例表明,多数情况下编写一个功能完备的 UI 元素不需要任何编程工作。本节简要介绍一些可用于 TreeView 的简单的脚本编写技术。

 

TreeView 事件

通过将 AutoPostBack 属性设置为 true 可以将用户交互产生的事件导向服务器。同时处理高级浏览器和低级浏览器事件时应该使用服务器端脚本,因为低级页面内容中没有使用 Internet Explorer 5.5 或更高版本中所使用的丰富的 DHTML 行为。

 

对于包含 TreeView Web 页面,用户的主要交互是展开和折叠树中的节点来浏览内容。下面的示例代码显示了如何使用 C# Web 窗体中处理 onexpandoncollapse onselectedindexchange 事件。

 

<script language="C#" runat="server">

void Expand(object sender, TreeViewClickEventArgs e)

{

  mylabel.InnerText += "已展开 (节点索引= " + e.Node.ToString() + ")";

}

 

void Collapse(object sender, TreeViewClickEventArgs e)

{

  mylabel.InnerText += "已折叠 (节点索引= " + e.Node.ToString() + ")";

}

 

void SelectChange(Object sender, TreeViewSelectEventArgs e)

{

  mylabel.InnerText += "已选中 " + e.NewNode.ToString() + " (旧节点

  索引=" + e.OldNode.ToString()+")" ;

}

</script>

 

在此脚本中,需要具有一个 id _label 的元素。

 

<div id=_label runat="server">Event Log: </div>

 

注意:此标记必须放在 TreeView 使用的 FORM 元素内。

可以通过编程或使用 TreeView 的属性将 C# 脚本中的函数加入到事件中,如下所示:

 

<mytree:treeview

onexpand="Expand"

oncollapse="Collapse"

onselectedindexchanged="SelectChange"

autopostback="true"

runat="server">

</mytree:treeview>

 

进行 TreeView 编程时经常要使用 onexpand oncollapse 事件。在本示例中,每次节点展开或折叠时,脚本都将添加到 div 元素的 innerText 中。

 

服务器端包含

由于 WebControls 是用 ASP.NET 建立的,所以也支持服务器端“包含”。下面的示例显示了其实现方法。

 

<mytree:treeview runat="server">

    <!-- #Include file="nodes.txt" -->

</mytree:treeview>

 

前面的示例使用了 nodes.txt 文件来填充一个 TreeView,下面我们使用包含文件来填充 TreeView 的两个单独的 TreeNode 分支。

 

<mytree:treeview runat="server">

    <mytree:treenode Text="书籍" >

        <!-- #Include file="Books.txt" -->

    </mytree:treenode>

    <mytree:treenode Text="杂志" >

        <!-- #Include file="magazines.txt" -->

    </mytree:treenode>

</mytree:treeview>

 

XML 数据绑定的命名空间前缀规则不同,包含文件的内容中的元素必须使用与其父元素相同的标记前缀。因此,books.txt magazines.txt 文件的内容应使用 mytree 标记前缀。

 

                                                                                                                                             秦汉唐

 

treeView学习笔记

checkedBox树形设置为true,checked,设置为true,选中,清除节点 主要使用的属性有 Nodes,ImageList,showLines,expandAll Nodes包含...
  • blueskyfly119
  • blueskyfly119
  • 2014年03月10日 00:14
  • 430

bootstrap的treeview使用方法教程

bootstrap-treeview 简要教程 bootstrap-treeview是一款效果非常酷的基于bootstrap的jQuery多级列表树插件。该jQuery插件...
  • mixika99
  • mixika99
  • 2016年11月26日 22:50
  • 10186

WinForm下的TreeView拖拽操作

http://www.cnblogs.com/zfqbt/archive/2009/12/17/1626582.html //开始拖动操作事件       private ...
  • u013908405
  • u013908405
  • 2017年02月09日 14:27
  • 1055

TreeView 的用法开始(挺全的)

程序编写 2007-02-10 23:23:59 阅读19 评论0 字号:大中小 //************* TreeView 的用法开始******************//一:TreeVie...
  • MyDream_yuyanqing
  • MyDream_yuyanqing
  • 2010年05月05日 16:54
  • 2920

asp.net treeview 控件的使用

    TreeView 是 ASP.NET 的 Navigation 中的一个控件,实际上就是我们平时所说的树型菜单。 在视图设计中添加 TreeView。 HTML代码清单:后台代码清单:prot...
  • liumqj
  • liumqj
  • 2011年06月16日 11:54
  • 4896

C# WinForm 自绘TreeView

C# WinForm 自绘TreeView 1. 问题提出 TreeView 控件很常用,常见的功能及UI方面的需求总结起来有如下几点: (1). 自定义节点高度:这是继承TreeView不能实现的...
  • ljfblog
  • ljfblog
  • 2017年05月13日 20:55
  • 1407

TreeView控件属性

TreeView控件属性属性说明AutoGenerateDataBindings可以设置为true。默认情况下需要手工设置数据和树接点的绑定关系CheckedNodes返回那些多选框被选中的节点的集合...
  • wuchen_net
  • wuchen_net
  • 2010年05月11日 14:01
  • 1259

如何实现具有层次结构的 TreeView 模版使用

数据模板 (DataTemplate) 和数据绑定 (Data Binding) 为了把数据和界面进行关联,我们要做 3 件事: 1、在 MainWindow.xaml 中添加一个 Tre...
  • AAA123524457
  • AAA123524457
  • 2015年06月25日 14:38
  • 1386

Asp.Net Web Form c#TreeView遍历文件目录

aspx文件代码 ...
  • u012803075
  • u012803075
  • 2017年01月16日 09:30
  • 433

TreeView添加节点刷新

移植同事的代码,其中有一个功能给TreeView添加节点,主节点添加后不显示,子节点就没有问题,原来是少了行代码。 TreeView.Items.Add(nil, 'NewItem'); Tre...
  • superfireware
  • superfireware
  • 2012年09月11日 16:18
  • 3129
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:TreeView学习笔记
举报原因:
原因补充:

(最多只允许输入30个字)