Question

我知道我可以在创建时设置标签的样式属性，但我想在运行时更改样式，我该怎么做？

用户选择：字体，颜色，bg颜色，我想根据用户需要更改现有的标签样式。

谢谢你？

Answer 1

您可以应用样式：

yourFormPanel.getForm().findField("field_name").labelEl.setStyle({"color":"red"});

或添加/删除css类：

yourFormPanel.getForm().findField("field_name").labelEl.addCls("red-label");
yourFormPanel.getForm().findField("field_name").labelEl.removeCls("black-label");

Answer 2

你可以通过多种方式实现

选项1（全局）：更改“Ext.form.Labelable”的SASS变量值

eg: $form-label-font-size: 11px !default;

选项2：创建mixin

eg: 

file -> sass/src/form/Labelable.scss

    @include extjs-label-ui(
        $ui: 'customName',
        $ui-font-size: 11
    );

js: 
    {
        xtype: 'textfield',
        ui: 'customName'
    }

选项3：使用表单字段的“labelStyle”配置

eg:
{
    xtype: 'textfield',
    fieldLabel: 'Test Label',
    labelStyle: 'font-weight: bold; color: #003168;',
    labelWidth: 170
}

选项4：在表单字段中添加“cls”，并将您的样式添加到css文件中例如：

js:
{
    xtype: 'form',
    defaults: {
        cls: 'test-class'
    }
}

CSS:
.test-class .x-form-item-label {
    text-transform:capitalize;
    color: #003168;
}

Extjs如何改变＆＃39;风格＆＃39; Ext.form.Label

2 个答案: