在 Sencha Touch 1.1 中区分 Radiofield 和 Checkbox 字段的外观

Ant*_*ony 5 sencha-touch

默认情况下,Sencha Touch 1.1 提供 aradiofield和 acheckboxfield显示复选标记(勾号)。由于这种设计,没有视觉方式来区分它们。

煎茶触摸无线电场

如何更改 的外观radiofield,使其看起来像传统的单选按钮?

Ant*_*ony 2

我添加了自己的样式来更改复选框的外观。

.x-field .x-input-radio:after, .x-field .x-input-radio:checked:after {
    content: "";
    position: absolute;
    width: 1.25em;
    height: 1.25em;
    top: 50%;
    left: auto;
    -webkit-transform: rotate(0deg) skew(0deg);
    -webkit-transform-origin: 50% 50%;
    -webkit-border-radius: 2em;
    right: 1.1em;
    border: .45em solid;
    margin-top: -0.75em;
}
.x-field .x-input-radio:checked:after {
    border-color: #06346a;
}
.x-field .x-input-radio:after {
    border-color: #dddddd;
}
Run Code Online (Sandbox Code Playgroud)