javascript - 最大化 ExtJS 中的选项卡面板？

Question

我知道 ExtJS 中只有窗口有最大化配置，但我正在考虑当用户单击按钮时将选项卡面板最大化到页面的整个主体。

我认为这是可能的，因为我看到了这个:http://www.sencha.com/forum/showthread.php?268067-How-can-we-add-maximize-and-minimize-in-EXTJS-4-portal

但我无法使其适应我的情况。

这是我的标签面板

            {
            region: 'center',
            tabPosition: 'top',
            title: 'Représentation',
            xtype: 'tabpanel',
            id: 'panel1',
            cls: 'tabpanel-container',
            tools:[{
                type:'maximize',
                tooltip: 'Agrandir la fenêtre',
                handler: function(e, target, panel) {
                    var c = panel.up('viewport');
                    var testPanel = Ext.getCmp('panel1');
                    var con=panel.ownerCt;
                    c.insert(0,con);
                    c.doLayout();
                }
            }],
            header: {
                titlePosition: 1,
                titleAlign: 'left',
                height: 36,
                cls: 'tabpanel-header'
            },
            activeTab: tabType,
            border: false,
            split: false,
            collapsible: false,
            margins: '5 0 5 0',
            items: [...]
            }, [...]

单击该工具时，选项卡面板只是从页面上消失，控制台中没有触发任何错误。

有什么提示吗？

Answer 1

在研究了 Window 组件和 Floating mixin 的 ExtJS 源之后，我想出了这个解决方案:jsfiddle

执行魔法的处理程序如下所示:

    handler: function (e, target, panelHdr) {
        var panel = panelHdr.up('panel');
        if (!panel.maximized) {

            panel.restoreSize = panel.getSize();
            panel.restorePos = panel.getPosition(true);
            panel.maximized = true;
            var parent = panel.ownerCt,
                container = parent ? parent.getTargetEl() : panel.container,
                newBox = container.getViewSize(false);
            panel.setBox(newBox);
        } else {
            var newBox = panel.restoreSize;
            newBox.x = panel.restorePos[0];
            newBox.y = panel.restorePos[1];
            panel.maximized = false;
            panel.setBox(newBox);
        }
    }