3

我需要将formpanels对齐到中心，所以我使用了vbox布局，在我使用它之后自动滚动没有像以前那样工作，代码如下：

 Usr.VWPanel = Ext.extend(Ext.Panel, {
        id: null,
        rid: null,
        closable: true,
        autoScroll: true,
        buttonAlign: 'center',
        layout: {
                type:'vbox',
                padding:'5',
                pack:'center',
                align:'center'
        },
        initComponent: function () {
            Ext.apply(this, {
                items: [
                {
                    xtype: 'spacer',
                    height: 16
                },
                {
                    xtype: 'usr.usrform',
                    itemId: 'usr.vwpain.usrformt',
                    width: 600,
                    height: 500
                },
                {
                    xtype:'spacer',
                    height: 16
                },
                {
                    xtype: 'usr.loginform',
                    itemId: 'usr.vwpain.loginform',
                    width: 600
                },
                {
                    xtype: 'spacer',
                    height: 16
                },
                {
                    xtype: 'usr.subsform',
                    itemId: 'usr.vwpain.subsform',
                    width: 600
                }],
...

请建议。

4

3 回答 3

2

vbox 布局永远不会显示滚动条。

替代文字

{
    xtype: 'window',
    title: 'My Window',
    width: 500,
    height: 500,
    layout: 'vbox',
    layoutConfig: {
        pack: 'center',
        align: 'center'
    },
    items: [
        {
            xtype: 'panel',
            title: 'My Panel',
            anchor: '80% 100%',
            height: 300,
            width: 300,
            autoScroll: true,
            items: [
                {
                    xtype: 'panel',
                    html: 'this isform1',
                    height: 100
                },
                {
                    xtype: 'panel',
                    html: 'this isform1',
                    height: 100
                },
                {
                    xtype: 'panel',
                    html: 'this isform1',
                    height: 100
                }
            ]
        }
    ]
}
于 2010-12-29T11:29:19.440 回答
1

在你的css你可以设置你的我的面板边距，{0 auto}这将使我的面板在窗口内居中。这意味着您不需要为您的窗口进行特殊的布局配置。

于 2011-10-13T21:03:12.157 回答
0

我在 resize 事件上添加了一个侦听器来获得垂直滚动，因为对于 Vbox，我们必须提供高度才能获得滚动，但是当窗口大小改变时，滚动条高度保持不变。

Ext.define('DataConfigurations', {
extend: 'Ext.form.Panel',
bodyStyle: 'padding:5px 5px;',
listeners: {
resize: {
    fn: function(el) {
        this.setHeight(this.up('window').getHeight()-150);  // 150  is extra for my panel coz of headers so have minus it.
        console.log("new height = " +   this.up('window').getHeight()-150);
    }
}
},
title: "Update Data Configurations",

希望这有帮助。

于 2016-05-03T15:21:42.287 回答