如何完全隐藏dockedItems工具栏

我可以在TabPanel的dockedItem中隐藏项目，但我想临时隐藏整个dock，因为工具栏本身仍占用空间，其余内容不会填满屏幕。如何完全隐藏dockedItems工具栏

到目前为止，我不喜欢这样：

myApp.views.productList.dockedItems.items[0].removeAll(true); 
myApp.views.productList.doComponentLayout();

或者：

myApp.views.productList.getComponent('search').removeAll(true); 
myApp.views.productList.doComponentLayout();

但无论是删除dockedItems工具本身。

我甚至试图给dockandItems单独和集体id:删除整个组件，但没有运气。我也尝试将有问题的工具栏移出停放的项目，并将其放入包含面板的items:属性中，但这会打破我应用程序中其他目前我不想更改的内容。

任何线索如何做到这一点？

来源

2011-07-19 Old McStopher

如果我正确理解你，你想暂时从tabPanel中删除tabBar。我能够通过给我的tabBar然后使用removeDocked和addDocked方法来实现这一点。我对sencha-touch很陌生，所以最有可能有这样做的更好的方法

下面的代码从tabPanel中删除tabBar，然后再次将其添加回来。

Ext.setup({ 

onReady: function() { 

    var tabpanel = new Ext.TabPanel({ 

     ui  : 'dark', 
     sortable : true, 
     tabBar:{ 
      id: 'tabPanelTabBar' 
     }, 
     items: [ 
      {title: 'Tab 1',html : '1',cls : 'card1'}, 
      {title: 'Tab 2',html : '2',cls : 'card2'}, 
      {title: 'Tab 3',html : '3',cls : 'card3'} 
     ] 
    }); 

    var paneltest = new Ext.Panel({ 
     fullscreen: true, 
     dockedItems:[ 
      { 

       xtype: 'button', 
       text: 'Disable TabBar', 
       scope: this, 
       hasDisabled: false, 
       handler: function(btn) { 

        console.log(btn); 
        if (btn.hasDisabled) { 

         tabpanel.addDocked(Ext.getCmp('tabPanelTabBar'), 0); 

         btn.hasDisabled = false; 
         btn.setText('Disable TabBar'); 
        } else { 

         tabpanel.removeDocked(Ext.getCmp('tabPanelTabBar'), false) 

         btn.hasDisabled = true; 
         btn.setText('Enable TabBar'); 
        } 
       }} 
     ], 
     items:[tabpanel] 
    }); 
    paneltest.show() 
}

}）

来源

2011-07-19 18:54:28 MrGreen

这做到了！ Mine实际上是用于删除没有tabBar集的子tabPanel的dockedItems，但是这有效。正如您所示，我需要使用的方法是“removeDocked”。谢谢！ –

请注意，搜索Sencha Touch API文档不会为此方法返回任何内容！ ...但是在进入Ext.Panel文档时，它实际上列出了。 –

如何完全隐藏dockedItems工具栏

回答

相关问题