可以在Flex应用程序中嵌入各种元素。被嵌入的元素将编译进SWF文件。它们不是在运行时载入的,所以不必为应用程序部署原元素。
1. 可以嵌入的图像格式有PNG、JPEG、GIF。嵌入后可以同时使用它的多个实例
下面的例子使用[Embed]原标签经image嵌入应用程序,并且采用绑定ActionScript类的形式。这就可以绑定Image控件的source属性到Logo类。可以绑定Logo类到任何可以使用image的组件属性上,比如Button控件的icon属性。
<?xml version="1.0" encoding="utf-8"?><!-- http://yecon.blog.hexun.com/29628260_d.html --> <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>
或
<?xml version="1.0" encoding="utf-8"?> <mx:Application <!-- http://yecon.blog.hexun.com/29628260_d.html --> 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>
2. 可以在Flex应用程序中嵌入image,并且可以将它应用于组件的皮肤
可以定义一个CSS选择器,以设置所有组件的皮肤
<?xml version="1.0" encoding="utf-8"?><!-- http://yecon.blog.hexun.com/29628260_d.html --> <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>
3. 嵌入SWF文件的方法与嵌入IMAGE的方法差不多,只是可以把已嵌入的SWF文件实例当做MovieClip类
(不可直接访问嵌入SWF文件的属性和方法,但是可以使用LocalConnection来允许他们之间的通信)
<?xml version="1.0" encoding="utf-8"?><!-- http://yecon.blog.hexun.com/29628260_d.html --> <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文件库里的特殊标签。
Flash定义了三种类型的标签:Button、MovieClip、Graphic。可以嵌入Button和MovieClip标签到Flex应用程序,但是不能嵌入Graphic标签。
<?xml version="1.0" encoding="utf-8"?><!-- http://yecon.blog.hexun.com/29628260_d.html --> <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>
4. 可以通过使用[Embed]原标签的方法在Flex应用程序中嵌入MP3文件
<?xml version="1.0" encoding="utf-8"?><!-- http://yecon.blog.hexun.com/29628260_d.html --> <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 { stopSound(); channel = mySong.play(); } public function stopSound():void { 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 (c) 2004 (Creative Commons Attribution License)</a>]]> </mx:htmlText> </mx:Text> </mx:Application>
5. 可以在Flex应用程序中嵌入SVG文件
<?xml version="1.0" encoding="utf-8"?><!-- http://yecon.blog.hexun.com/29628260_d.html --> <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:Application>
6. 可以在Flex应用程序中嵌入字体
<?xml version="1.0" encoding="utf-8"?><!-- http://yecon.blog.hexun.com/29628260_d.html --> <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%"/> </mx:Application>