Flex中CSS样式的切换

Flex样式切换

最新推荐文章于 2025-04-27 15:48:46 发布

weixin_33775582

最新推荐文章于 2025-04-27 15:48:46 发布

阅读量98

点赞数

本文介绍了一个Flex应用程序中通过组合框选择不同样式文件实现界面风格切换的方法。提供了三种样式选择：style1CSS、style2CSS 和 style3CSS，每种样式定义了不同的背景图片和主题颜色。

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" minWidth="955" minHeight="600"
				creationComplete="init();"
				>
	
	<mx:Script>
		<![CDATA[
			private function init():void {
				StyleManager.loadStyleDeclarations('style1CSS.swf');
			}
		]]>
	</mx:Script>
	
	<mx:ComboBox 
		id = "styleCombo" top="10" left="10" right="10"
		dataProvider="['style1CSS', 'style2CSS', 'style3CSS']"
		change="StyleManager.loadStyleDeclarations(styleCombo.selectedItem + '.swf')"
		/>
	
</mx:Application>

style1CSS.css定义了Application容器的背景色与背景图：

Application { 
   backgroundImage: Embed(source="assets/backgrounds.swf#bluestripe");
   themeColor: #009999;
}

style2CSS.css为：

Application { 
   backgroundImage: Embed(source="assets/brushedmetal.jpg");
   themeColor: #0033cc;
}

style3CSs.css为：

Application { 
   backgroundImage: Embed(source="assets/backgrounds.swf#retroFifties");
   themeColor: #ff9900;
}

运行的效果图：

实例与资源请到这个地址下载自行测试：www.idceye.com/blog/post/281/