使用 CSS 定义 Flex 4 皮肤

发布于 2024-11-01 03:30:39 字数 653 浏览 5 评论 0原文

我正在尝试通过 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"/>

任何帮助将不胜感激。

原文

I am trying to define my Flex 4 Skins via CSS but I my custom skin will not display. Here is what I am doing:

In my application I import my css and define the styleName in my button:

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

Here is my 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");
}

My understanding is that my button should be supplied it's skinClass via the CSS but it fails to work. If I define the skinClass directly like below it works fine:

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

Any help would be appreciated.

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

何处潇湘 2024-11-08 03:30:39

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

编辑

您还可以尝试将样式放入与按钮相同的容器内的样式标签中，看看是否有效。您确定您的应用程序可以找到您的 style.css 吗？显示更多代码可能会有所帮助。

回复收藏 0 原文

久而酒知 2024-11-08 03:30:39

根据官方 Flex CSS 文档：

类选择器：CSS 类选择器
匹配符合类别的组件
健康）状况。声明一个 CSS 语法
类选择器是前缀
带点的条件。你可以
将类选择器声明为
类型选择器的条件，或
普遍适用于满足以下条件的任何类型
班级情况。

.header { background-color: #CCCCCC; }

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

注意：在 Flex 中满足类条件
使用 styleName 属性
成分。例如，您可能有
HBox 的两个类：“header”和
“页脚”。上面，第一个选择器
适用于任何组件
样式名称=“标题”；第二个
选择器应该只适用于 HBox
styleName="footer" 的组件
（实际上需要的东西
在 Gumbo 中固定并强制执行，如
迄今为止的类选择器仅是
通用和选择器中的任何类型
被忽略）。

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

Per the official Flex CSS documentation:

Class Selector: A CSS class selector
matches components that meet a class
condition. The CSS syntax to declare a
class selector is to prefix the
condition with a dot. You can either
declare a class selector as a
condition of a type selector, or
universally to any type that meets the
class condition.

.header { background-color: #CCCCCC; }

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

Note: In Flex a class condition is met
using the styleName attribute on a
component. For example, you may have
two classes of HBox: "header" and
"footer". Above, the first selector
applies to any component with
styleName="header"; the second
selector should only apply to HBox
components with styleName="footer"
(something that actually needs to be
fixed and enforced in Gumbo, as
to-date class selectors have only been
universal and any type in the selector
is ignored).

It looks like selectors may not be working in Gumbo...

回复收藏 0 原文

~没有更多了~