TreePanel相关属性

//TreePanel配置参数
1.animate:true//展开,收缩动画,false时,则没有动画效果
2.autoHeight:true//自动高度,默认为false
3.enableDrag:true//树的节点可以拖动Drag(效果上是),注意不是Draggable
4.enableDD:true//不仅可以拖动,还可以通过Drag改变节点的层次结构(drap和drop)
5.enableDrop:true//仅仅drop
6.lines:true//节点间的虚线条
7.loader:Ext.tree.TreeLoader//加载节点数据
8.root:Ext.tree.TreeNode//根节点
9.rootVisible:false//false不显示根节点,默认为true
10.trackMouseOver:false//false则mouseover无效果
11.useArrows:true//小箭头

//TreeNode常用配置参数
1.checked:false//true则在text前有个选中的复选框,false则text前有个未选中的复选框,默认没有任何框框
2.expanded:fasle//展开,默认不展开
3.href:"http:/www.cnblogs.com"//节点的链接地址
4.hrefTarget:"mainFrame"//打开节点链接地址默认为blank,可以设置为iframe名称id,则在iframe中打开
5.leaf:true//叶子节点,看情况设置
6.qtip:"提示"//提示信息,不过要 Ext.QuickTips.init();下
7.text:"节点文本"//节点文本
8.singleClickExpand:true//用单击文本展开,默认为双击

 

 

要想改变TreePanel上的节点的图标样式，Ext的api里提供了通过设置节点的icon和iconCls两种方式，如下所示： Js代码 new Ext.tree.TreeNode{           icon: 'youricon.gif',           iconCls: 'your-iconCls'   }    new Ext.tree.TreeNode{ icon: 'youricon.gif', iconCls: 'your-iconCls' }   官方推荐首选的设置方式是通过iconCls进行设置。需要注意到是在设置节点的iconCls的样式的时候一定要用CSS层叠的写法才会起作用，具体CSS代码如下： Css代码 /*不考虑节点的状态，同一用一种图标显示*/   .x-tree-node  .your-iconCls{background-image: url(youricon.gif)}         /*为节点的开闭状态和叶节点状态分别设置样式*/   .x-tree-node-expanded  .your-iconCls{background-image: url(youricon.gif)}   .x-tree-node-collapsed  .your-iconCls{background-image: url(youricon2.gif)}   .x-tree-node-leaf  .your-iconCls{background-image: url(youricon3.gif)} background:url(../Teacher/Images/User.gif) no-repeat 1px 2px;