ext treePanel 更换图标 总结

1.动态更换图标:
代码
node.on('click',function(node){
    node.getUI().getIconEl().src = 'img/1.gif';
});

2.覆写 Ext.tree.TreeLoader 的 createNode
Ext.tree.MyTreeLoader = function(config) {   
  Ext.tree.MyTreeLoader.superclass.constructor.call(this, config);   
}; 
Ext.extend(Ext.tree.MyTreeLoader, Ext.tree.TreeLoader, {  
createNode : function(attr) { 
//        if (attr.leaf == true) {   
//          attr.icon = '../../../resources/images/icons/fam/188.gif'; 
            attr.iconCls = "xxx-tree-node-expanded";  
//        }   
        return Ext.tree.DWRTreeLoader.superclass.createNode.call(this, attr);   
    } 
}   


3.直接在ext-all.css 中的下面这段样式放在tree所在页面修改图标,或直接在
  ext-all.css 中改也行。若要是把这段css放在单独的文件总引用,必须放在
  ext-all.css 引用之后。

.x-tree-node-expanded .x-tree-node-icon{
	background-image:url(../images/default/tree/folder-open.gif);
}

.x-tree-node-leaf .x-tree-node-icon{
	background-image:url(../images/default/tree/leaf.gif);
}

.x-tree-node-collapsed .x-tree-node-icon{
	background-image:url(../images/default/tree/folder.gif);
}

你可能感兴趣的:(css,ext)