2012-06-26 3 views
1

Я новичок в Extjs и Sencha. Я начал разрабатывать свой пользовательский интерфейс, и я мог бы добавить значок с кнопками. теперь мне нужно добавить значок в меню checkitem http://dev.sencha.com/deploy/ext-4.1.0-gpl/docs/index.html#!/api/Ext.menu.CheckItemcheck item icon in sencha

но я не мог! хотя я использую свойство iconCls. Кто-нибудь сделал это раньше?

+0

Вы проверили инструменты разработчика, если iconCls действительно применяется к элементу вашего пункта меню? Возможно, в CSS существует проблема ... –

+0

Они уже используют пространство, зарезервированное для значка для флажка, вы хотите, чтобы изображение рядом с флажком? Для этого потребуется переместить разделительную линию и выровнять ее вверх –

+0

@Dmitry Pashkevich, но я не думаю, что в CSS есть проблема, потому что она отлично работает со всем остальным. – Shadin

ответ

1

Если вы просто хотите значок прямо рядом с текстом, вы можете просто вставить изображение после того, как пункт меню визуализируется

Ext.create('Ext.menu.Menu', { 
    width: 100, 
    height: 200, 
    floating: false, 
    renderTo: Ext.getBody(), 
    items: [{ 
     xtype: 'menucheckitem', 
     text: 'select all', 
     listeners: { 
      render: function(comp) { 
       Ext.DomHelper.insertAfter(comp.getEl().down(".x-menu-item-icon"), { 
        tag: 'img', 
        src: "http://flyosity.com/images/_blogentries/networkicon/stepfinal2.png", 
        width: 16, 
        height: 16 
       }); 
      }    
     } 
    }] 
}); 

В идеале, вы бы создать плагин или подкласс, так что вы можете использовать это функциональность. Вышеприведенный код не перестраивает разделитель, это единственный разделитель для всего меню, но он должен дать вам начало.

+0

Спасибо! отличная идея. – Shadin