Flex控制多个button点击后的效果

 

核心：

 

 

internal function moduleCreate():void
{
	this["btnGrxx"].selected = true;
	btnSelected = this["btnGrxx"];
}

protected function totalClick(btnId:String, vsId1:String, vsId2:String, index:int, e:Event):void
{
	if(btnSelected)
		btnSelected.selected = false;
	btnSelected = this[btnId];

	
}

 

在页面.mxml中加入

 

<?xml version="1.0" encoding="utf-8"?>
<mx:Module xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" verticalGap="0" horizontalGap="0"
	xmlns:flexmdi="flexmdi.containers.*" 
	xmlns:flexmdiCtrl="flexmdi.controls.*" 
	xmlns:flexlib="flexlib.controls.*" 
	width="100%" height="100%"  
	backgroundImage="image/background.png" backgroundSize="100%" backgroundColor="#0975D1"
	paddingBottom="0" paddingLeft="0" paddingRight="5" paddingTop="0"
	initialize="onInitialize(event)" creationComplete="moduleCreate()">
	
	<mx:Style source="assets/css/index.css" />
	<mx:Script source="ExamManage/ExamAS.as" />

......
					<!--导航-->
					<mx:HRule strokeWidth="1"  width="100%" strokeColor="#AFC6E3" height="1"/>
					<mx:HBox id="topBar" height="45" width="100%" paddingLeft="10" verticalAlign="middle" horizontalGap="5"
					 backgroundColor="#dff6fe">
						<mx:Button id="btnGrxx" label="排名" toggle="true"
						   height="35" click="totalClick('btnGrxx', 'subvslist_1', 'subvslist_2', 0, event)"/>
						<mx:Button id="btnZbqk" label="指标1" toggle="true" 
						   height="35" click="totalClick('btnZbqk', 'subvslist_1', 'subvslist_2', 1, event)"/>
						<mx:Button id="btnGzzb" label="指标2" toggle="true" 
						   height="35" click="totalClick('btnGzzb', 'subvslist_1', 'subvslist_2', 2, event)"/>
						<mx:Button id="btnGzl"  label="指标3" toggle="true" 
						   height="35" click="totalClick('btnGzl', 'subvslist_1', 'subvslist_2', 3, event)"/>
						<mx:Button id="btnLsgz" label="指标4" toggle="true" 
						   height="35" click="totalClick('btnLsgz', 'subvslist_1', 'subvslist_2', 4, event)"/>
					</mx:HBox>
					<mx:HRule strokeWidth="1"  width="100%" strokeColor="#AFC6E3" height="1"/>
......

其中样式为：

Button {
	highlightAlphas: 0.28, 0.53;
	fillAlphas: 1, 1, 1, 1;
	fillColors: #E0F3FA, #B5DFFC, #FCF285, #F0C142;
	color: #00449d;
	textRollOverColor: #000000;
	borderColor: #95C5E0;
	fontWeight: normal;
	selectedDownSkin: Embed(source="assets/img/Button/ButBag.png");
	selectedOverSkin: Embed(source="assets/img/Button/ButBag.png");
	selectedUpSkin: Embed(source="assets/img/Button/ButBag.png");
	downSkin: Embed(source="assets/img/Button/ButBag.png");
}