在 Flex 4 中使用外部 CSS答案

【问题标题】：Using an external css in Flex 4在 Flex 4 中使用外部 CSS
【发布时间】：2023-12-25 05:01:01
【问题描述】：

我正在使用 Flex 4 测试版，加载外部 CSS 的能力似乎被破坏了。运行下面的代码根本没有显示任何样式。我错过了什么吗？

代码如下：

封装组件 { 导入 flash.events.Event；导入 flash.net.URLLoader；导入 flash.net.URLRequest；导入 flash.text.StyleSheet;

import mx.controls.Label;
import spark.components.Panel;

public class MainPanel extends Panel
{
    private var mainLabel:Label = new Label();
    private var label2:Label = new Label();


    public function MainPanel()
    {
        super();

        var cssUrl:URLRequest = new URLRequest("css/style.css");
        var cssLoader:URLLoader = new URLLoader();
        cssLoader.addEventListener(Event.COMPLETE, cssLoaded);
        cssLoader.load(cssUrl);
    }

    function cssLoaded(event:Event):void {
        var css:StyleSheet = new StyleSheet();
        css.parseCSS(URLLoader(event.target).data);

        mainLabel.styleSheet = css;
        mainLabel.htmlText = "Main Label";
        mainLabel.horizontalCenter = 0;
        mainLabel.verticalCenter = -350;
        mainLabel.setStyle("styleName", "h1");
        addElement(mainLabel);

        label2.htmlText="Sub-Label";
        label2.horizontalCenter="0";
        label2.verticalCenter="-300";
        addElement(label2);
    }
}

}

css/style.css

.h1 { 颜色：#ffe145；字体系列：Verdana；字体大小：36；字体样式：斜体；字体粗细：粗体； }

使用此代码加载（* 软件删除了 s:Application 标签）：

<fx:Declarations>
    <!-- Place non-visual elements (e.g., services, value objects) here -->
</fx:Declarations>

<custom:MainPanel horizontalCenter="0" verticalCenter="0"/>

【问题讨论】：

标签： adobe flex4

【解决方案1】：

如果 CSS 文件与 Web 服务器上的 SWF 处于相对位置，您可以尝试将此标记添加到您的应用程序 MXML。

<fx:Style source="css/style.css"/>

这将引入所有 CSS 设置并自动为您进行分配。

【讨论】：