Flex/AIR加载图片的几种方式

网觅得，略作修改。

 

   代码如下： (以下环境运行通过: Flash Builder4, Flex SDK4.1)

<?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"
			   applicationComplete="application1_applicationCompleteHandler(event)">
	<s:layout>
		<s:VerticalLayout horizontalAlign="center" gap="10"/>
	</s:layout>

	<fx:Script>
		<![CDATA[
			import mx.events.FlexEvent;

			//方式1  这种方式编译以后tsj.jpg 会直接编译进swf文件中 所以swf可以独立存在
			[Bindable]
			[Embed(source="/assets/tsj.jpg")]
			private var imgClass:Class;
			
			//方式2
			private var loader:Loader;
			
			protected function application1_applicationCompleteHandler(event:FlexEvent):void
			{
				//方式1的代码
				imageByEmbed.source = imgClass;
				
				//方式2的代码
				loader = new Loader();
				//这里需要注意: 不是_loader.addEventListener  这样是没有效果的
				loader.contentLoaderInfo.addEventListener(Event.COMPLETE, loaderImage);
				//这里说一个技巧   当url 中有中文字体的话 使用encodeURI方法 如果没有 则可以不加
				loader.load(new URLRequest(encodeURI("assets/tsj.jpg")));

				//方式3比较简单，但注意必须设置autoLoad属性为true
				imageBySource.source = "assets/tsj.jpg";			
			}

			private function loaderImage(e:Event):void
			{
				imageByLoader.source = e.currentTarget.content;
			}
		]]>
	</fx:Script>
	
	<s:HGroup verticalAlign="middle">
		<s:Label text="方式1：Embed(source=...)："/>
		<mx:Image id="imageByEmbed" width="100" height="100"/>
		<s:Label text="等同于（这里增加了图片加载完成时的Fade效果）："/>
		<mx:Image source="@Embed(source='/assets/tsj.jpg')" creationCompleteEffect="Fade"/>
	</s:HGroup>

	<s:HGroup verticalAlign="middle">
		<s:Label text="方式2：loader："/>
		<mx:Image id="imageByLoader" width="100" height="100"/>
	</s:HGroup>

	<s:HGroup verticalAlign="middle">
		<s:Label text="方式3：source："/>
		<mx:Image id="imageBySource" width="100" height="100" autoLoad="true"/>
	</s:HGroup>

	<s:Label text="说明：方式2和3中swf都不会将图片编译进去，图片需要按路径与swf同时发布才能被显示"/>

</s:Application>