Невозможно выровнять кнопки ExtJS по вертикали справа. - PullRequest
Новая
       12

Невозможно выровнять кнопки ExtJS по вертикали справа.

0 голосов
/ 21 сентября 2018

Я использую extjs и ткань canvas для генерации панели ниже, к сожалению, я не могу выровнять все эти кнопки: enter image description here

по вертикали, используя толькоExtJS: enter image description here

Ответы [ 2 ]

0 голосов
/ 21 сентября 2018

Вам необходимо использовать layout свойства, такие как vbox и hbox, вот пример:

FIDDLE (нажмите Run, если изображениезагружается неправильно) 

Ext.create({
xtype: 'container',
layout: {
    type: 'hbox',
    align: 'stretch'
},

items: [{
    xtype: 'imagecomponent',
    width: 500,
    alt: 'img1',
    src: 'https://i.imgur.com/Y3GKYOF.png'
}, {
    xtype: 'container',
    layout: {
        type: 'vbox',
        align: 'stretch'
    },
    defaults: {
        margin: 5
    },
    items: [{
        xtype: 'button',
        text: 'Circle'
    }, {
        xtype: 'button',
        text: 'Box'
    }, {
        xtype: 'button',
        text: 'Arrow'
    }, {
        xtype: 'button',
        text: 'TextBox'
    }, {
        xtype: 'button',
        text: 'TextArea'
    }, {
        xtype: 'button',
        text: 'Delete'
    }, {
        xtype: 'button',
        text: 'Save'
    }]
}],
renderTo: Ext.getBody()
});
0 голосов
/ 21 сентября 2018

Предложения:

  1. Вы можете установить равную ширину всех кнопок и задать одинаковый отступ слева от изображения.

  2. Вы можете использовать левую вертикальную строку меню и поместить в нее кнопки и изменить CSS, чтобы убрать ее границу, чтобы она стала невидимой.

    Вы можете сделать 2 vbox в элементах и ​​на первом месте imageи во второй половине поместите кнопки.

это не выглядит хорошо из-за неравной ширины и расстояния между кнопками. Для получения дополнительной помощи, пожалуйста, предоставьте код.

...