2013-06-25 35 views
0

我有一个树形网格面板上的动作列定义,我想隐藏文件夹上的动作图标,但在叶节点显示不同的图标,我成功地做到了,但是,当我应用 'x-hide-display'风格时,我也注意到列本身被隐藏起来,我只想在每列中显示图标。 感谢删除动作列图标,但保持列可见

this.columns = [{ 
      xtype: 'treecolumn', //this is so we know which column will show the tree 
      text: 'Folder', 
      flex: 1, 
      sortable: true, 
      dataIndex: 'folder' 
     },{ 
      text: '', 
      width: 20, 
      menuDisabled: true, 
      xtype: 'actioncolumn', 
      tooltip: 'View Chats', 
      align: 'center', 
      items:[{ 
       icon: 'resources/images/comment.png', 
       getClass: function(value, metaData, record){ 
        if(record.raw.leaf) 
         metaData.css = 'x-grid-icon' 
        else 
         metaData.css = 'x-hide-display'; 
       } 
      }] 
     },{ 
      text: '', 
      width: 20, 
      menuDisabled: true, 
      xtype: 'actioncolumn', 
      tooltip: 'View Alerts', 
      align: 'center', 
      items:[{ 
       icon: 'resources/images/alert.png', 
       getClass: function(value, metaData, record){ 
        if(record.raw.leaf) 
         metaData.css = 'x-grid-icon' 
        else 
         metaData.css = 'x-hide-display'; 
       } 
      }] 
     },{ 
      text: '', 
      width: 20, 
      menuDisabled: true, 
      xtype: 'actioncolumn', 
      tooltip: 'Favorite', 
      align: 'center', 
      items:[{ 
       icon: 'resources/images/favorites.png', 
       getClass: function(value, metaData, record){ 
        if(!record.raw.leaf) 
         metaData.css = 'x-grid-icon' 
        else 
         metaData.css = 'x-hide-display'; 
       } 
      }] 
     },{ 
      text: '', 
      width: 20, 
      menuDisabled: true, 
      xtype: 'actioncolumn', 
      tooltip: 'Share', 
      align: 'center', 
      items:[{ 
       icon: 'resources/images/share.png', 
       getClass: function(value, metaData, record){ 
        if(!record.raw.leaf) 
         metaData.css = 'x-grid-icon' 
        else 
         metaData.css = 'x-hide-display'; 
       } 
      }] 
     }] 

I want the icons on each column not under the folder icons

回答

1

它非常简单,而不是添加X-隐藏显示添加自己的CSS类:

.hide-icon img{ visibility: hidden !important } 

这就是全部。 我们添加了img,因为您只想隐藏图像图标而不是隐藏单元格本身,如果您在将鼠标移过该行时未添加img,您会注意到隐藏单元格不会更改灰色背景颜色。

1

帮我:

if(!record.raw.leaf){ 
    return 'x-grid-icon'; 
}else{ 
    return 'x-hidden'; 
} 
相关问题