Question

我有一个组合框和一个复选框。我将它们添加到一个简单的xtype：容器上，我想将它们放在它们的中间，它们之间有20像素的距离。我尝试使用包括hbox在内的容器的许多布局，但它似乎不起作用。你能帮忙吗？

var routingDisplaySets = Ext.create('widget.combobox', {
    fieldLabel: 'XXXX'
    });

var getVersionsRoutings = Ext.create('widget.checkbox', {
    boxLabel: ' XXXX', name: 'versionsCheckbox', id:'verCheckbox'});

var displayContainer = Ext.create('widget.container',{layout: {type: 'hbox', align: 'center'}, height:40, 
    items:[{xtype: routingDisplaySets},{xtype: getVersionsRoutings, x:20}]});

以下是我得到的内容：http://imgur.com/Mx2a83t。看看他们是如何一起拥挤的？它们从容器的左侧开始......有什么想法吗？

Answer 1

试试这个..将您的Hbox更改为对齐：'中间'和打包：'中心'。同时删除复选框上的'x'属性并使用 margin：0 0 0 20 而不是

    var routingDisplaySets = Ext.create('widget.combobox', {
        fieldLabel: 'XXXX'
    });

    var getVersionsRoutings = Ext.create('widget.checkbox', {
        boxLabel: ' XXXX',
        name: 'versionsCheckbox',
        id: 'verCheckbox',
        margin: '0 0 0 20'
    });

    var displayContainer = Ext.create('widget.container', {
        layout: {
            type: 'hbox',
            align: 'middle',
            pack: 'center'
        },
        height: 40,
        items: [{
            xtype: routingDisplaySets
        }, {
            xtype: getVersionsRoutings
        }]
    });

在容器ExtJS上定位元素

1 个答案: