入應用程序資源
可以在 Adobe? Flex? 應用程序中嵌入各種類型的資源。 嵌入的資源被編譯到 Flex 應用程序的 SWF 文件中。 它們不是在運行時加載的, 您并非必須使用您的應用程序部署原始資源文件。

提示: 嵌入資源的另一種方法是在運行時加載它們。 在運行時加載的資源必須使用您的應用程序進行部署, 因為它們沒有被編譯到您的應用程序中。 這具有保持 Flex 應用程序的文件大小更小和縮短其初始加載時間的優點。

可以嵌入具有 PNG、JPEG 和 GIF 文件格式的圖像, SWF 文件, 具有 MP3 文件格式的聲音文件, SVG 文件和字體。 下列主題描述如何嵌入這些資源:

圖像 (多個實例)
圖像 (單一實例)
使用 scale-9 拉伸的圖像
用于與 CSS 和外觀一起使用的圖像
SWF 文件
SWF 庫資源
聲音文件
SVG 文件
字體
嵌入圖像 (多個實例) 可以在 Flex 應用程序中嵌入具有 PNG、JPEG 或 GIF 文件格式的圖像并創建它的一個或多個實例。

此示例使用 [Embed] 元數據標簽在您的應用程序中嵌入圖像并將它與可綁定的 Actionscript 類相關聯。 接著它將 Image 控件的 source 屬性綁定到 Logo 類。 可以將 Logo 類綁定到采用某個圖像的任何組件屬性, 比如 Button 控件的 icon 屬性。

示例
<?xml version="1.0" encoding="utf-8"?>
<mx:Application
xmlns:mx="http://www.adobe.com/2006/mxml"
viewSourceURL="src/EmbeddingImages/index.html"
layout="horizontal" width="350" height="250"
>

<mx:script>
<![CDATA[
[Embed(source="assets/logo.png")]
[Bindable]

public var Logo:Class;
]]>
</mx:script>

<mx:Image id="myLogo" source="{Logo}"/>

<mx:Image id="myLogo2" source="{Logo}"/>

</mx:Application>




嵌入圖像 (單一實例) 可以使用線上 @Embed 指令在 Flex 應用程序中嵌入只希望顯示一次的圖像。

此示例將一個圖像組件添加到一個應用程序中并使用其 source 屬性中的 @Embed 指令。 若要在另一個 Image 控件中使用這一相同的圖像, 則還必須將它嵌入到該組件中。 如果希望顯示嵌入的圖像的多個實例, 請使用 [Embed]元數據標簽。

示例
<?xml version="1.0" encoding="utf-8"?>
<mx:Application
xmlns:mx="http://www.adobe.com/2006/mxml"
viewSourceURL="src/EmbeddingAnImage/index.html"
width="200" height="240"
>
<mx:Image id="myLogo" source="@Embed('assets/logo.png')"/>

</mx:Application>



嵌入使用 scale-9 伸縮的圖像 您可以將某個圖像文件嵌入到您的 Flex 應用程序并以類似組件的方式智能地縮放它。 通過使用 scale-9 功能, 您的圖像的四個角根本沒有縮放, 水平邊框僅在水平方向上縮放, 而垂直邊框僅在垂直方向上縮放。 例如, 這對于以下情況很有用: 創建使用圓角的框, 或在您希望在縮放組件時保持邊框清晰的位置進行組件樣式調整。

此示例使用 Embed 元數據標簽的 scaleGridTop、 scaleGridBottom、 scaleGridLeft 和 scaleGridRight 網格線位置屬性來創建您的 scale-9 網格。

提示: 獲得網格線位置的值的一種比較容易的方法是將指南與 Adobe? Photoshop? 中的 Rectangular Marquee 工具和 Info 選項板一起使用。

提示: 旋轉嵌入的 scale-9 圖像的實例會關閉該圖像的 scale-9 以在將來進行任意大小轉換。

示例
<?xml version="1.0" encoding="utf-8"?>
<mx:Application
xmlns:mx="http://www.adobe.com/2006/mxml"
viewSourceURL="src/EmbeddingImagesScale9/index.html"
layout="vertical" width="400" height="480"

>

<mx:script>
<![CDATA[
[Embed(
source="assets/fancy_border.png",
scaleGridTop="55", scaleGridBottom="137",
scaleGridLeft="57", scaleGridRight="266"

)]

[Bindable]
public var FancyBorderImage:Class;
]]>

</mx:script>

<mx:Image source="{FancyBorderImage}" width="146" height="82"/>

<mx:Image source="{FancyBorderImage}" width="266" height="150"/>
<mx:Image source="{FancyBorderImage}" width="325" height="183"/>

</mx:Application>


使用 CSS 為外觀嵌入圖像 您可以在 Flex 應用程序中嵌入圖像并將它用于設置組件的外觀。

您可以定義一個 CSS 類型選擇器為給出類型的所有組件設置外觀。 在此示例中, 您為 Button 控件創建了一個類型選擇器。 類型選擇器通過使用 Embed指定這些圖像用作您的組件的外觀屬性。 您還可以定義一個類選擇器來創建可作為樣式應用到特定組件的自定義 CSS 類。

提示: 類選擇器創建可用來設置單獨的組件的樣式的已命名樣式類, 方法是通過使用 styleName 屬性將類選擇器分配給該組件。 類型選擇器為給出類型的所有組件設置樣式, 如下面的示例所示。

示例
<?xml version="1.0" encoding="utf-8"?>
<mx:Application
xmlns:mx="http://www.adobe.com/2006/mxml"
viewSourceURL="src/EmbeddingImagesCSS/index.html"
layout="horizontal" width="270" height="100"
horizontalAlign="center" verticalAlign="middle"

>

<mx:Style>
Button
{
upSkin: Embed("assets/box_closed.png");

overSkin: Embed("assets/box.png");
downSkin: Embed("assets/box_new.png");

}
</mx:Style>

<mx:Button/>

<mx:Text text="Roll over and click the box!"/>

</mx:Application>


嵌入 SWF 文件嵌入 SWF 文件與嵌入圖像幾乎是相同的。 差別在于您可以將嵌入的 SWF 文件的實例當作 MovieClip 類的實例處理。 (它們實際上是 MovieClipAsset 類的子類, MovieClipAsset 類是 MovieClip 類的子類。)

注意: 您無法直接訪問嵌入的 SWF 文件的屬性或方法。 但是, 您可以使用 LocalConnection 以允許它們進行通信。

示例
<?xml version="1.0" encoding="utf-8"?>
<mx:Application
xmlns:mx="http://www.adobe.com/2006/mxml"
viewSourceURL="src/EmbeddingSwfFiles/index.html"
layout="horizontal" width="290" height="290"
horizontalAlign="center" verticalAlign="middle"
>

<mx:script>
<![CDATA[
[Embed(source="assets/hourglass.swf")]

[Bindable]
public var Hourglass:Class;
]]>
</mx:script>

<mx:Image id="hourglass" source="{Hourglass}"/>
</mx:Application>


嵌入 SWF 庫資源 您可以在應用程序中嵌入來自現有 SWF 庫中的特定符號。 Flash 定義三種類型的符號: Button、MovieClip 和 Graphic。 您可以在 Flex 應用程序中嵌入 Button 和 MovieClip 符號, 但您不能嵌入 Graphic 符號, 因為無法為 Actionscript 導出 Graphic 符號。

此示例使用 [Embed] 元數據標簽的 source 屬性來指定包含您的庫的 SWF 文件, 并使用 [Embed] 元數據標簽的 symbol 屬性來指定您要在該庫中嵌入的符號的鏈接 ID。

示例
<?xml version="1.0" encoding="utf-8"?>
<mx:Application
xmlns:mx="http://www.adobe.com/2006/mxml"
viewSourceURL="src/EmbeddingSwfLibraryAssets/index.html"
layout="horizontal" width="450" height="240"
horizontalAlign="center" verticalAlign="bottom"

>

<mx:script>
<![CDATA[
[Embed(source="assets/library.swf", symbol="BadApple")]

[Bindable]
public var BadApple:Class;

[Embed(source="assets/library.swf", symbol="Pumpkin")]

[Bindable]
public var Pumpkin:Class;

]]>
</mx:script>

<mx:Image id="badApple" source="{BadApple}" width="150" height="151.8"/>

<mx:Image id="pumpkin" source="{Pumpkin}" width="150" height="131.7"/>


</mx:Application>


嵌入聲音文件 您可以在 Flex 應用程序中通過使用 [Embed] 元數據標簽嵌入 MP3 文件并播放它。

注意: 記住嵌入的聲音文件會成為您的應用程序 (最終的 SWF 文件) 的一部分, 而 MP3 文件會很大, 從而會使您的應用程序變得很大并會對應用程序的下載速度產生負面影響。

此實例將該 MP3 的一個新實例創建為一個 SoundAsset。它使用 SoundAsset 類的 play() 方法來播放 MP3 文件的實例, 并存儲返回的 SoundChannel 對象, 從而您可以稍后調用 SoundChannel 對象的 stop() 方法以結束播放。

示例
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" horizontalAlign="center" verticalAlign="center" viewSourceURL="srcEmbeddingSoundFiles/index.html">

<mx:script>
<![CDATA[
import mx.core.SoundAsset;
import flash.media.*;

[Embed(source="assets/pie-yan-knee.mp3")]

[Bindable]
public var Song:Class;

public var mySong:SoundAsset = new Song() as SoundAsset;
public var channel:SoundChannel;

public function playSound():void
{

// Make sure we don't get multiple songs playing at the same time
stopSound();

// Play the song on the channel
channel = mySong.play();
}

public function stopSound():void
{

// Stop the channel, but only if it exists
if ( channel != null ) channel.stop();
}

]]>
</mx:script>

<mx:HBox>
<mx:Button label="play" click="playSound();"/>

<mx:Button label="stop" click="stopSound();"/>
</mx:HBox>

<mx:Text width="348" textAlign="center" color="#ffffff">

<mx:htmlText>
<![CDATA[<a href="http://derekaudette.ottawaarts.com/music.php">Pie-Yan-Knee Written and Performed by: Derek R. Audette ? 2004 (Creative Commons Attribution License)</a>]]>
</mx:htmlText>
</mx:Text>

</mx:Application>


嵌入 SVG 文件 可以將 SCG 文件嵌入到 Flex 應用程序中。

嵌入 SVG 文件與嵌入圖像幾乎是相同的。 差別在于您可以將嵌入的 SVG 文件的實例當作 Sprite 類的實例處理。 (它們實際上是 SpriteAsset 類的實例, SpriteAsset 類是 Sprite 類的子類。) 嵌入的 SVG 文件還保留它們的矢量屬性, 且在被縮放或轉換時不會顯示像素。

注意: 不能在運行時導入 SVG 文件；僅可以在編譯時在 Flex 應用程序中嵌入它們。

示例
<?xml version="1.0" encoding="utf-8"?>
<mx:Application
xmlns:mx="http://www.adobe.com/2006/mxml"
layout="horizontal"
viewSourceURL="srcEmbeddingSvgFiles/index.html"
width="600" height="470"

>
<mx:script>
<![CDATA[
[Embed(source="assets/frog.svg")]

[Bindable]
public var SvgFrog:Class;
]]>
</mx:script>

<mx:Image id="smallFrog" source="{SvgFrog}" width="128" height="130"/>

<mx:Image id="largeFrog" source="{SvgFrog}"/>
</mx:Application>


嵌入字體 您希望在 Flex 應用程序中嵌入一種字體并將它用作基于文本的組件的樣式。

下面的示例創建引用嵌入的字體的 font-family 名稱的一個類選擇器。 接著它會創建一個 Text 控件并將其樣式設置為該類選擇器。

提示: 您在嵌入字體以節省文件大小時僅可以從字體添加某些字符, 方法是指定您的 @font-face 聲明的 unicode-range 屬性。

詳細信息: 有關使用字體的詳細信息, 請參閱 Flex 2 開發人員指南*中的“使用字體”。

示例
<?xml version="1.0" encoding="utf-8"?>
<mx:Application
xmlns:mx="http://www.adobe.com/2006/mxml"
layout="horizontal"
horizontalAlign="center"
verticalAlign="center"
viewSourceURL="src/EmbeddingFonts/index.html"

>

<mx:Style>
@font-face
{
font-family: Copacetix;

src: url("assets/copacetix.ttf");
unicode-range:
U+0020-U+0040, /* Punctuation, Numbers */

U+0041-U+005A, /* Upper-Case A-Z */
U+005B-U+0060, /* Punctuation and Symbols */
U+0061-U+007A, /* Lower-Case a-z */
U+007B-U+007E; /* Punctuation and Symbols */

}

.MyTextStyle
{
font-family: Copacetix;
font-size: 24pt;
}

</mx:Style>

<mx:Text styleName="MyTextStyle" text="Embedded fonts rock!" width="100%"/>