1

我添加了一个Panel（我称之为My Panel 1）和另一个panel（panel我称之为My Panel 2），然后在第二个面板（到My Panel 2）中添加了一个网格。当我单击浏览器的Restore Down或re-sizing按钮时，它不会缩小组件以适应屏幕尺寸。我该如何解决这个问题？

Ext.define('MyApp.view.MyPanel', {
    extend: 'Ext.panel.Panel',

    height: 469,
    width: 729,
    title: 'My Panel 1',

    initComponent: function () {
        var me = this;

        Ext.applyIf(me, {
            items: [{
                xtype: 'panel',
                height: 238,
                title: 'My Panel 2',
                items: [{
                    xtype: 'gridpanel',
                    height: 179,
                    title: 'My Grid Panel 1',
                    columns: [{
                        xtype: 'gridcolumn',
                        dataIndex: 'string',
                        text: 'String'
                    }, {
                        xtype: 'numbercolumn',
                        dataIndex: 'number',
                        text: 'Number'
                    }, {
                        xtype: 'datecolumn',
                        dataIndex: 'date',
                        text: 'Date'
                    }, {
                        xtype: 'booleancolumn',
                        dataIndex: 'bool',
                        text: 'Boolean'
                    }],
                    viewConfig: {

                    }
                }]
            }]
        });

        me.callParent(arguments);
    }

});
4

1 回答 1

3

我建议使用视口 - 它会自动调整到浏览器的“视口”:) 如果您希望自动管理它们，也不要设置固定的宽度和高度。这是一个示例：http: //jsfiddle.net/dbrin/gWaCv/embedded/result/

于 2012-07-20T17:40:19.520 回答