0

在此处输入图像描述

我在样式复选框和单选按钮方面遇到问题，当页面第一次启动时，复选框和单选按钮图标周围会出现一个白色区域，但是当我更改选择时它看起来很正常！

这是Appearance.js中单选按钮的代码：

"radiobutton" :
{
  alias : "atom",

  style : function(states)
  {
    var icon = (states.checked) ? icon = "decoration/form/checked-radio.png" : "qx/static/blank.gif";
    return {
      icon: icon,
      gap : 8
    };
  }
},

"radiobutton/icon" : {
  style : function(states)
  {
    var decorator;

    if (states.disabled) {
      decorator = "radiobutton-disabled";
    } else if (states.checked) {
      decorator = "radiobutton-checked";
    } else if (states.hovered) {
      decorator = "radiobutton-hovered";
    } else {
      decorator = "radiobutton";
    }

    decorator += states.invalid && !states.disabled ? "-invalid" : "";

    return {
      decorator : decorator,
      width: 16,
      height: 16
    };
  }
},

这是Decoration.js 中的单选按钮装饰器：

"radiobutton" : {
  style : {
    width: 1,
    innerWidth : 1,
    radius: 8,
    gradientStart: ["radiobutton-start", 0],
    gradientEnd: ["radiobutton-end", 50],
    color: "radiobutton-border",
    innerColor : "radiobutton-inner-sides",
    colorBottom: "radiobutton-border-bottom",
    innerColorTop: "radiobutton-inner",
    innerWidthBottom: 0,
    shadowColor: "reflection",
    shadowLength: 1,
    shadowHorizontalLength: 0,
    shadowBlurRadius: 0
  }
},

"radiobutton-hovered" : {
  include : "radiobutton",
  style : {
    gradientStart: ["radiobutton-end-hovered", 0],
    gradientEnd: ["radiobutton-start", 100],
    color: "radiobutton-border",
    colorBottom: "radiobutton-border-bottom-hovered",

    innerWidth : 0,
    shadowLength: 0
  }
},

"radiobutton-focused" : {
  include : "radiobutton",
  style : {
    gradientStart: ["radiobutton-start-focused", 0],
    gradientEnd: ["radiobutton-end-focused", 100],
    color: "radiobutton-border-sides-focused",
    innerColor : "radiobutton-inner-sides-focused",
    colorBottom: "radiobutton-border-bottom-focused",
    colorTop: "radiobutton-border-focused",
    innerColorBottom: "radiobutton-inner-bottom-focused",
    innerColorTop: "radiobutton-inner-focused"
  }
},

我使用PNG图标的图像，我做错了什么，我该如何解决？

编辑：
当我为图标背景使用纯色而不是渐变时，问题得到解决，原子小部件不支持渐变吗？

4

0 回答 0