extjs - 如何为配置有 header: false 的面板设置标题

Question

我有一些面板（大多数时间网格面板），大多数时间配置没有标题，意思是header: false. 现在我需要对标题进行调整，但我找不到任何与此相关的内容。那么我该怎么做呢？

Answer 1

据我所知，在您选择不创建标题后这是不可能的。

您可以考虑使用一个简单的组件并将其dockedItems与适当的weight. 只要您不需要直接访问工具，这可能非常适合

或者

您使用标题定义面板并在组件显示之前将其隐藏。我从未尝试过，但它应该可以工作。您可以收到标题getHeader()

这是一个工作示例：

Ext.create('Ext.panel.Panel', {
    title: 'Hello',
    width: 100,
    items: [
        {
            xtype: 'button',
            text: 'toggle',
            handler: function(btn) {
                var header = btn.up('panel').getHeader();
                if (header.isVisible())
                    header.hide();
                else
                    header.show();
            }
        }
    ],
    renderTo: Ext.getBody()
});

经过一番阅读，我找到了一种创建标题的方法。它可以用updateHeader(true)

Ext.create('Ext.panel.Panel', {
    title: 'Hello',
    header: false,
    width: 200,
    items: [
        {
            xtype: 'button',
            text: 'toggle',
            handler: function(btn) {
                var panel = btn.up('panel');
                if (Ext.isObject(panel.header) && panel.header.isVisible()){
                    panel.header.hide();
                }else if (panel.header === false){
                    panel.header = true;
                    panel.updateHeader(true);
                }else {
                    panel.header.show();
                }
            }
        }
    ],
    renderTo: Ext.getBody()
});