布局列中的水平对齐

时间:2012-04-24 04:31:44

标签: layout extjs4 alignment

这是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'是行不通的。 有什么建议吗?

2 个答案:

答案 0 :(得分: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'
        }]
    });
});

答案 1 :(得分:0)

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

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