Javascript ExtJs 4-调整窗口上的表单项大小调整大小

Javascript ExtJs 4-调整窗口上的表单项大小调整大小,javascript,layout,extjs,hbox,Javascript,Layout,Extjs,Hbox,我正在使用ExtJS4.0.7,我刚刚遇到了一个问题。 当我调整包含窗体(面板)的窗口的大小时,我想调整窗体(面板)中元素的大小。 我知道,当您没有列并且使用anchor布局时,这很简单。 到目前为止,我的代码如下所示: initComponent: function () { var me = this; me.terminalImage = Ext.create('Ext.Img', { src: 'http://www.se

我正在使用ExtJS4.0.7,我刚刚遇到了一个问题。 当我调整包含窗体(面板)的窗口的大小时,我想调整窗体(面板)中元素的大小。 我知道,当您没有列并且使用
anchor
布局时,这很简单。 到目前为止,我的代码如下所示:

initComponent: function ()
    {
        var me = this;

        me.terminalImage = Ext.create('Ext.Img', {
            src: 'http://www.sencha.com/img/20110215-feat-html5.png',
            width: 50,
            margin: '0 10 0 0'
        });

        me.nameField = Ext.create('Ext.form.Text', {
            xtype: 'textfield',
            name: 'defname',
            fieldLabel: 'myFLabel',
            allowBlank: false,
            listeners: {

            }
        });
        me.terminalTypeCmb = Ext.create('Ext.form.field.ComboBox', {
            fieldLabel: me.getTrans('lblTerminalType.Text', 'Type'),
            parentRecord: me.parentRecord,
            store: 'myStore',
            queryMode: 'local',
            name: 'typename',
            width: 300,
            valueField: 'deftype',
            displayField: 'typename',
            listeners: {

            }
        });

        me.form = Ext.create('Ext.form.Panel', {
            xtype: 'form',
            autoScroll: true,
            defaultType: 'textfield',
            defaults: { layout: 'anchor', flex: 1},
            padding: '10',
            items: [{
                xtype: 'container',
                layout: 'hbox',
                items: [
                    me.terminalImage,
                    {
                        items: [me.nameField, me.terminalTypeCmb]
                    }
                ]
            }
            ]
        });

        Ext.apply(this,
        {
            defaults: {
        },
        defaultType: 'textfield',
        items: [me.form]
       });

        if (me.parentRecord)
        {
            me.form.loadRecord(me.parentRecord);
        }
        this.callParent(arguments);
    }
我想得到这样的东西:

 My Image      |   My TextField (resizable width on window resize)
 (fixed size)  |   My ComboBox (I know it is not resizable)
               | 
现在,在调整窗口大小时,我的文本字段的宽度保持不变。谢谢你的帮助。

你就快到了:)

只需删除默认的flex:
默认值:{layout:'anchor',flex:1},
//不确定是否需要布局

并在文本字段中仅添加
flex:1

将其他项与一起固定,将使TextField占用所有剩余空间