`
luosijin123
  • 浏览: 12162 次
  • 性别: Icon_minigender_1
  • 来自: 南昌
社区版块
存档分类
最新评论

Flex里用IconUtility动态加载Icon

阅读更多

为了减少Flex文件体积,我们可以使用Release模式编译外,一些资源可以在运行时加载Run-Time-Load(RTL),今天闲逛WEB时,无意发现这个IconUtility类包,很好用,能定义Icon或者Image的source 它的格式如下:

IconUtility.getClass(id,picpath,width,height)

下载:http://lab.benstucki.net/archives/IconUtility.zip

我用一些名车图片做了几个Icon和图片来作为外部资源,结合IconUtilit类写.你可以发挥自己想象,在实际项目中试用一下吧!

效果如下:

Icon.mxml:

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" 
				layout="vertical" verticalAlign="middle"
				backgroundColor="0x414141">
	<mx:Style>
		Accordion{
			headerStyleName: "mycanvaslTitle"; 
		}
		.mycanvaslTitle { 
			fontFamily: Arial; 
			fontSize: 12; 
			fontWeight: normal; 
		} 
	</mx:Style>
	<mx:Script>
		<![CDATA[
			import com.benstucki.utilities.IconUtility;
		]]>
	</mx:Script>
	<mx:ApplicationControlBar dock="true">
		<mx:Label text="Icon与 Image运行时加载实例"/>
		<mx:Spacer width="100%"/>
		<mx:Button id="btn1" label="宝马" click="accordion.selectedIndex=0;" icon="{IconUtility.getClass(btn1,'baoma.jpg',32,32)}"/>
		<mx:Button id="btn2" label="奔驰" click="accordion.selectedIndex=1;" icon="{IconUtility.getClass(btn2,'benchi.jpg',32,32)}"/>
		<mx:Button id="btn3" label="保时捷" click="accordion.selectedIndex=2;" icon="{IconUtility.getClass(btn3,'bsj.jpg',32,32)}"/>
	</mx:ApplicationControlBar>
	<mx:Accordion id="accordion" width="80%" height="100%">
		<mx:Canvas id="canvas1" label="宝马车辆" icon="{IconUtility.getClass(canvas1,'baoma.jpg',16,16)}">
			<mx:Image id="img1" source="{IconUtility.getClass(img1,'baoma1.jpg',130,126)}"/>
		</mx:Canvas>
		<mx:Canvas id="canvas2" label="奔驰车辆" icon="{IconUtility.getClass(canvas2,'benchi.jpg',16,16)}">
			<mx:Image id="img2" source="{IconUtility.getClass(img2,'ben1.jpg',130,126)}"/>
		</mx:Canvas>
		<mx:Canvas id="canvas3" label="保时捷车辆" icon="{IconUtility.getClass(canvas3,'bsj.jpg',16,16)}">
			<mx:Image id="img3" source="{IconUtility.getClass(img3,'bao1.jpg',130,126)}"/>
		</mx:Canvas>
	</mx:Accordion>
</mx:Application>

 

代码见附件:

 

分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics