Question

我有一个Window，当我点击一个按钮时，我会弹出它（作为pop up）。这是我的代码，它工作正常。

var w= Ext.widget('mywindow');
w.show();

现在，我有一个tab bar panel，当用户点击按钮时我需要打开它（但不是弹出窗口）。它应该占据整个屏幕（替换上一个视图）。我该怎么做？

我的标签面板的定义

Ext.define('App.view.TabPanelClass', {
    extend: 'Ext.tab.Panel',
    alias: 'widget.persontabpanel',
    .....

更新

launch: function() {   

        Ext.create('Ext.container.Viewport', {
            layout: 'card',
            items: [
            {
                xtype: 'panel', 
                items: { xtype: 'firstPanel' }

            },....

Answer 1

您可以使用卡片布局将一个视图替换为另一个视图。或者，您可以使用maximized：true config创建一个窗口。

Answer 2

通常的方法是将tabpanel放在视口内并为其提供layout: 'card'配置以覆盖任何其他视图，如果这是唯一的layout: 'fit'配置将更好在视口中查看。 Windows不是ExtJS视口的子项，因此窗口和tabpanel只是视口中的一个项目。

视口将使其内容大小与浏览器窗口大小相匹配，即使调整大小也是如此。请参阅视口here上的文档。

用户单击按钮时打开选项卡面板

2 个答案: