按钮控件 Button Controls（二）

1.ButtonBar组件 

 

普通按钮集合，显示出一个包含多个普通按钮组件的的水平栏，其中的普通按钮组件不能通过Button来定义，而是通过

DataProvider来定义数据源，如果按钮的的样式没有特殊要求，通过String对象的集合作为DataProvider:

 

代码如下：

 

<?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"> <mx:Script> <!--[CDATA[ import mx.events.ItemClickEvent; public function chilkhandler(event:ItemClickEvent):void { txt.text ="my selcet button index" + String(event.index)+"/n"+ "select button label" + event.label } ]]--> </mx:Script> <mx:Panel x="250" y="59" width="387" height="330" layout="absolute" title="ButtonBar Example" fontSize="12"> <mx:TextArea x="10" y="44" width="326" height="179" id="txt"/> <mx:ButtonBar x="10" y="245" width="276" height="33" itemClick="chilkhandler(event);"> <mx:dataProvider> <mx:Array> <mx:String>Flex</mx:String> <mx:String>Jsp</mx:String> <mx:String>Flash</mx:String> <mx:String>Php</mx:String> </mx:Array> </mx:dataProvider> </mx:ButtonBar> </mx:Panel> </mx:Application>

 

效果如图所示：

 

 

 2，CheckBox 复选框

 

 

代码如下所示：

<?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"> <mx:Script> <!--[CDATA[ import mx.controls.Alert; public function modifyCart():void { cartItems.text=""; if(a.selected==true) { cartItems.text += "面包" + "/n"; } if(b.selected==true) { cartItems.text += "鸡蛋" + "/n"; } if(c.selected==true) { cartItems.text += "牛奶" + "/n"; } } public function sendmessage(event:Event):void { if(d.selected==true) { Alert.show("即将获得优惠券!"); } else Alert.show("很遗憾，你将没有得到优惠券!"); } ]]--> </mx:Script> <mx:Panel x="138" y="55" width="383" height="329" layout="absolute" borderColor="#AD9BF0" title="CheckBox Example" fontSize="12"> <mx:VBox y="41" x="26"> <mx:CheckBox label="面包" fontSize="12" id="a" click="modifyCart();"/> <mx:CheckBox label="鸡蛋" fontSize="12" id="b" click="modifyCart();"/> <mx:CheckBox label="牛奶" fontSize="12" id="c" click="modifyCart();" height="39" width="48"/> </mx:VBox> <mx:VBox x="83" y="10" width="240" height="179"> <mx:Label text="选择你所需要的物品，放进购物车" width="235" height="23" fontSize="13" color="#20A6C3"/> <mx:TextArea width="216" height="107" fontSize="12" id="cartItems"/> <mx:CheckBox label="送的优惠卷券物放进购物车" borderColor="#F5F8FA" color="#318597" width="192" height="20" id="d" click="sendmessage(event);" selected="true"/> </mx:VBox> </mx:Panel> </mx:Application>

 

 

 

效果如图所示：