Flex 4在运行时更改主应用程序背景颜色

时间:2012-07-28 17:59:41

标签: actionscript-3 flash flex actionscript styles

Flex 4中是否可以在运行时更改<s:Application>的背景颜色?我已经看到了如何使用MX版本的Application组件执行此操作的示例,而不是spark版本。

我无法将backgroundColor属性绑定到变量并修改它。但是,我在想我应该使用组件的styleManager属性来执行此更改。

任何人都可以解释如何做到这一点吗?

感谢您的时间。

2 个答案:

答案 0 :(得分:3)

我建议你仔细阅读:

http://help.adobe.com/en_US/flex/using/WS2db454920e96a9e51e63e3d11c0bf69084-7fee.html

视频教程逐步介绍如何使用CSS并在Flex 4中使用外观,这是更改可视组件的主要方法。

应用程序仍然具有backgroundColor样式: http://help.adobe.com/en_US/FlashPlatform/reference/actionscript/3/spark/components/Application.html

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
               xmlns:s="library://ns.adobe.com/flex/spark" 
               xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600"
               creationComplete="application1_creationCompleteHandler(event)">
    <s:layout>
        <s:HorizontalLayout/>
    </s:layout>
    <fx:Script>
        <![CDATA[
            import mx.events.FlexEvent;

            protected function application1_creationCompleteHandler(event:FlexEvent):void
            {
                setStyle('backgroundColor',0xCCCCCC);
            }

        ]]>
    </fx:Script>
    <s:Button click="setStyle('backgroundColor','0xff0000');" label="turn red"/>
    <s:Button click="setStyle('backgroundColor','0x0000ff');" label="turn blue"/>
    <s:Button click="setStyle('backgroundColor','0x00ff00');" label="turn green"/>
</s:Application>

更好的IMO方式

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
               xmlns:s="library://ns.adobe.com/flex/spark" 
               xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600">
    <s:layout>
        <s:HorizontalLayout/>
    </s:layout>
    <fx:Style>
        @namespace s "library://ns.adobe.com/flex/spark";
        @namespace mx "library://ns.adobe.com/flex/mx";
        s|Application{
            backgroundColor:#CCCCCC;
        }
    </fx:Style>
    <s:Button click="setStyle('backgroundColor','0xff0000');" label="turn red"/>
    <s:Button click="setStyle('backgroundColor','0x0000ff');" label="turn blue"/>
    <s:Button click="setStyle('backgroundColor','0x00ff00');" label="turn green"/>
</s:Application>

最好还是将CSS拉入自己的文件中,然后用

引用它
<fx:Style source="myStyle.css"/>

答案 1 :(得分:1)

您可以尝试

FlexGlobals.topLevelApplication.setStyle("backgroundColor", 0xff0000);  // that would turn it into bright red
FlexGlobals.topLevelApplication.setStyle("backgroundAlpha", 1);  // Sometimes background color is ignored when background alpha is zero

如果背景颜色没有变化,则表示您的某个组件可能正在指示背景颜色。