0

我有一个包含多个组件的字段容器。每个组件也有flex属性。我想知道我们怎样才能打破这一行？正如您在屏幕截图中看到的那样，“FREE ARTICLE”字段应该从新行的开头开始，但我不知道如何指定它。

在此处输入图像描述

    items: new Ext.Panel({
    items: [
        {
            xtype: 'fieldset',
            title: 'Artikel Sorgulama',
            defaultType: 'textfield',
            layout: 'anchor',
            defaults: {
                anchor: '100%'
            },
            height: '86px',
            items: [
                {
                    xtype: 'fieldcontainer',
                    layout: 'hbox',
                    defaultType: 'textfield',
                    fieldDefaults: {
                        labelAlign: 'top'
                    },
                    items: [
                        {
                            xtype: 'textfield',
                            id: 'articleNo',
                            flex: 1,
                            tabIndex: 1,
                            fieldLabel: 'ARTİKEL NO',
                            fieldStyle: 'text-align: right; font-size: 12pt',
                            margins: '0 10 0 0',
                            enableKeyEvents: true,
                            listeners: {
                                specialkey: function (field, e) {
                                    if (field.getValue() != 'null') {

                                        if (e.getKey() === e.ENTER || e.TAB) {
                                            //articles.proxy.extraParams = {'article': field.getValue()};
                                            articles.load({
                                                params: {'article': field.getValue()},
                                                callback: function () {
                                                    Ext.getCmp('articleDesc').setValue(articles.data.items[0].data['ART_DESC']);
                                                }
                                            });
                                        }
                                    }
                                },
                                focus: function (e) {
                                    e.setValue('');
                                    Ext.getCmp('articleDesc').setValue("");
                                    articles.loadData([], false);
                                }
                            }
                        },
                        {
                            xtype: 'textfield',
                            id: 'articleDesc',
                            flex: 3,
                            fieldLabel: 'ARTİKEL TANIMI',
                            fieldStyle: 'font-size: 12pt',
                            readOnly: true
                        },
                        {
                            xtype: 'textfield',
                            fieldLabel: 'FREE ARTICLE',
                            flex: 0
                        }
                    ]
                }
            ]
        },
4

2 回答 2

2

您将需要使用嵌套框布局。字段容器有一个vbox布局。中的第一项fieldcontainer应该是container带有hbox布局的（如您当前的代码）。的第二项fieldcontainer应该是第三个字段（由于vbox布局，它将出现在下方）。

于 2013-07-29T08:56:02.070 回答
1

只是不要将您的免费文章字段添加到字段容器，而是添加到父字段集：

items: [
    {
        xtype: 'fieldset',
        // ...
        items: [
            {
                xtype: 'fieldcontainer',
                layout: 'hbox',
                // ...
            }, {
                xtype: 'textfield',
                fieldLabel: 'FREE ARTICLE'
            }
        ]
    }
]
于 2013-07-29T08:55:46.230 回答