Как выровнять радиокнопки с левой стороны в Touch Sencha? - PullRequest
Новая
       35

Как выровнять радиокнопки с левой стороны в Touch Sencha?

0 голосов
/ 12 июня 2018

Есть ли решение для выравнивания этих переключателей на левой стороне?Вот пример сенсорного кода Sencha, который вы можете запустить на Sencha Fiddle 

Ext.application({
    name : 'Fiddle',

    launch : function() {
      var form = Ext.create('Ext.form.Panel', {
    fullscreen: true,
    items: [
        {
            xtype: 'radiofield',
            name : 'color',
            value: 'red',
            label: 'Red',
            labelAlign: 'right',
            checked: true
        },
        {
            xtype: 'radiofield',
            name : 'color',
            value: 'green',
            label: 'Green'
        },
        {
            xtype: 'radiofield',
            name : 'color',
            value: 'blue',
            label: 'Blue'
        }
    ]
});
    }
});

Здесь есть 3 переключателя.Первый, который я пытаюсь установить на левой стороне и хочу установить выравнивание метки на правой стороне.Я сделал это с помощью опции конфигурации labelAlign: 'right' Но вы можете видеть в дизайне, что метка устанавливается с правой стороны, а компонент не получает установки с левой стороны.Я не знаю, почему это добавление отступов на левой стороне.Я перепробовал много вещей для этого, но не смог решить эту проблему.Есть ли у вас какие-либо предложения / решения по этому вопросу?

enter image description here

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

1 Ответ

0 голосов
/ 12 июня 2018

Источник HTML / CSS говорит, что причина для радиоблока справа: 

.x-field.x-body-align-end > * > .x-body-el {
    align-items: flex-end;
}

Источник ExtJS Field говорит, что body-align-... класс установлен здесь: 

updateBodyAlign: function(bodyAlign, oldBodyAlign) {
    var element = this.element;

    if (oldBodyAlign) {
        element.removeCls(Ext.baseCSSPrefix + 'body-align-' + oldBodyAlign);
    }

    if (bodyAlign) {
        element.addCls(Ext.baseCSSPrefix + 'body-align-' + bodyAlign);
    }
},

Так что япопробовал в скрипке: 

bodyAlign: 'start',

и все работает.

...