Question

这是EXT JS 4。一个简单的问题，如何在布局栏中对齐项目？

                    layout:'column',
                    border: false,
                    items:
                    [
                    {
                        columnWidth:.5,
                        xtype: 'label',
                        text: 'item 1'
                    },
                    {
                        columnWidth: .5,
                        xtype: 'label',
                        text: 'item 2'
                    }
                    ]

我需要的只是将“项目1”对齐到右侧，将“项目2”对齐到左侧。所以，他们将在中心见面。只使用'align：right'是行不通的。有什么建议吗？

Answer 1

试试这个：

Ext.onReady(function() {
    Ext.create('Ext.panel.Panel', {
        renderTo: document.body,
        width: 200,
        height: 200,
        layout: 'column',
        items: [{
            columnWidth: 0.5,
            xtype: 'label',
            text: 'item 1',
            style: 'text-align: right;'
        }, {
            columnWidth: 0.5,
            xtype: 'label',
            text: 'item 2'
        }]
    });
});

Answer 2

以下是Sencha文档的引用：http://docs.sencha.com/ext-js/4-0/#!/api/Ext.form.Label

注意：在大多数情况下，在字段中使用fieldLabel及相关配置属性（Ext.form.Labelable.labelAlign，Ext.form.Labelable.labelWidth等）会更合适组件本身，因为它允许标签在整个表单中统一调整大小。仅当使用标准字段布局无法实现布局时才应使用Ext.form.Label。

布局列中的水平对齐

2 个答案: