Question

我正在尝试通过CSS定义我的Flex 4皮肤，但我的自定义皮肤将无法显示。这就是我在做的事情：

在我的应用程序中，我导入了我的css并在我的按钮中定义了styleName：

        <fx:Style source="styles.css"/>
        <s:Button label="Button" styleName="circle"/>

这是我的CSS：

@namespace s "library://ns.adobe.com/flex/spark";
@namespace mx "library://ns.adobe.com/flex/mx";

s|Button.circle
{
    skinClass: ClassReference("skins.buttons.CircleButton");
}

我的理解是我的按钮应该通过CSS提供它的skinClass但它无法工作。如果我像下面一样直接定义skinClass，它可以正常工作：

<s:Button label="Button" skinClass="skins.buttons.CircleButton"/>

任何帮助都将不胜感激。

Answer 1

根据official Flex CSS documentation：

类选择器：CSS类选择器匹配满足类的组件条件。用于声明的CSS语法类选择器是前缀带点的条件。你也可以将类选择器声明为类型选择器的条件，或普遍适用于任何符合的类型阶级条件。

.header { background-color: #CCCCCC; }

HBox.footer { background-color: #999999; }

注意：在Flex中，满足类条件在a上使用styleName属性零件。例如，你可能有两类HBox：“标题”和 “页脚”。上面是第一个选择器适用于任何组件的styleName = “报头”;第二选择器应该只适用于HBox 具有styleName =“footer”的组件（实际需要的东西固定并在Gumbo中执行，如只有最新的类选择器通用和选择器中的任何类型被忽略了。）

看起来选择器可能无法在Gumbo中工作......

Answer 2

确保首先在根应用程序文件下包含CSS文件。其次，我会尝试在没有类型选择器的情况下执行css，因此只需执行s|Button.circle而不是.circle。

修改

您还可以尝试将样式标记放在与按钮相同的容器中，以查看是否有效。你确定你的应用程序可以找到你的style.css吗？显示更多代码可能有助于这种情况。

使用CSS定义Flex 4外观

2 个答案: