Forms 设置ExtJS复选框的样式，使其看起来像切换按钮

我想知道如何设计ExtJS复选框，使其看起来像一个切换按钮

---

我试图避免为此挖掘自定义主题。

好吧，在我发布完问题之前，我就想好了。事实证明这并不难

JS:

{
    xtype: 'checkboxfield',
    fieldCls: 'toggleBox',
    inputAttrTpl: 'value="Button text here"'
}

.toggleBox {
    background: transparent;
    margin: 0;
    width: auto;
    padding: 0 7px;
    height: 25px;
    border: 1px solid #aaa;
    color: #999;
}

.x-form-cb-checked .toggleBox {
    border: 1px solid #393;
    background: #7d7;
    color: #fff;
}

自定义CSS:

{
    xtype: 'checkboxfield',
    fieldCls: 'toggleBox',
    inputAttrTpl: 'value="Button text here"'
}

.toggleBox {
    background: transparent;
    margin: 0;
    width: auto;
    padding: 0 7px;
    height: 25px;
    border: 1px solid #aaa;
    color: #999;
}

.x-form-cb-checked .toggleBox {
    border: 1px solid #393;
    background: #7d7;
    color: #fff;
}