设置或者清除Flex应用程序中的背景图片

接下来的例子展示了Flex应用中如何通过设置 backgroundImage风格，来设置或者移除背景图片。

下面是具体的源代码：

Download: main.mxml

1. <?xml version="1.0" encoding="utf-8"?>
2. <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
3.         layout="vertical"
4.         verticalAlign="middle"
5.         backgroundColor="white"
6.         applicationComplete="init();">
8.     <mx:Script>
9.         <![CDATA[
10.             import mx.events.ItemClickEvent;
12.             [Bindable]
13.             private var defaultBackgroundImage:Class;
15.             private function init():void {
16.                 defaultBackgroundImage = Application.application.getStyle("backgroundImage");
17.             }
19.             private function toggleButtonBar_itemClick(evt:ItemClickEvent):void {
20.                 Application.application.setStyle("backgroundImage", evt.item.data);
21.             }
22.         ]]>
23.     </mx:Script>
25.     <mx:Array id="arr">
26.         <mx:Object label="default" data="{defaultBackgroundImage}" />
27.         <mx:Object label="null" data="{null}" />
28.     </mx:Array>
30.     <mx:ApplicationControlBar dock="true">
31.         <mx:Form styleName="plain">
32.             <mx:FormItem label="backgroundImage:">
33.                 <mx:ToggleButtonBar id="toggleButtonBar"
34.                         dataProvider="{arr}"
35.                         itemClick="toggleButtonBar_itemClick(event);" />
36.             </mx:FormItem>
37.         </mx:Form>
38.     </mx:ApplicationControlBar>
40. </mx:Application>

你还在扩展.CSS文件或者<mx:Style />中设置backgroundImage风格。下面是参考代码：

1. <mx:Style>
2.     Application {
3.         backgroundImage: ClassReference(null);
4.     }
5. </mx:Style>

或者你可以在MXML中设置backgroundImage风格，下面是参考代码：

1. <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
2.         backgroundImage="{null}">