网格单元具有图像和文本

Question

有没有办法在Ext js 4网格面板的单元格上放置图像和文本？

感谢您的帮助。

CK

Answer 1

是的，你可以。但取决于您的要求选择哪种方式。

1. 使用CSS。定义列时，请设置'tdCls'属性：

   {
       header: 'Image and text column',
       tdCls: 'img-col',
       dataIndex: 'Text'
   }
   

   CSS文件中的

   ：

   td.img-col  {
       background-image: url(images/pic.png); /*16px*/
       background-repeat: no-repeat;
   }
   
   td.img-col .x-grid-cell-inner {
       margin-left: 16px;
   }
   

2. 使用模板列：

   {
       xtype: 'templatecolumn',
       header: 'Image and text column',
       tpl: [
           '<img src="{ImgPath}"></img>',
           '<div>{Text}</div>'
       ]
   }
   

   您的模型应该具有ImgPath属性