1.静态背景图设置
在这里我使用了BorderContainer,我的简单用法如下所示:
<?xml version="1.0" encoding="utf-8"?>
<!-- Simple example to demonstrate Spark BorderContainer component -->
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark">
<s:Panel title="BorderContainer Component Example"
width="75%" height="75%"
horizontalCenter="0" verticalCenter="0">
<s:BorderContainer
backgroundColor="red" cornerRadius="10"
borderStyle="inset" borderWeight="4"
left="10" right="10" top="10" bottom="10">
<s:layout>
<s:HorizontalLayout
paddingLeft="5" paddingRight="5"
paddingTop="5" paddingBottom="5"/>
</s:layout>
<s:Button label="Button 1"/>
<s:Button label="Button 2"/>
<s:Button label="Button 3"/>
<s:Button label="Button 4"/>
</s:BorderContainer>
</s:Panel>
</s:Application>
要把它作为背景设置,代码如下所示:
<s:BorderContainer id="borderContainer"
width="100%"
height="100%"
borderVisible="true"
backgroundImageFillMode="scale">
<s:backgroundFill>
<s:SolidColor color="0xffffff" alpha="0"/>
</s:backgroundFill>
</s:BorderContainer>
//动态绑定
[Bindable]
[Embed(source='assets/background.png')]
public var icons:Class;
borderContainer.setStyle("backgroundImage",'assets/background.png');
2.如果要动态设置,则如下所示:
在这里我使用BitmapImage控件,我之前用了BorderContainer,但没有成功,故用BitmapImage.
<s:BitmapImage
id="bitmapImage"
width="100%" height="100%"
x="0" y="0"/>
this.bitmapImage.source = xmlFiles.getNativeXML();
即可。