按钮控件 Button Controls（一）

1. popupButton组件单独使用很少，一般和其它的组件一起使用，如菜单组件Menu

 

 

 

<?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.MenuEvent; import mx.controls.Menu; public var myMenu:Menu; public function initMenu():void { myMenu = new Menu (); var dp:Object = [{label:"My Folder"},{label:"Sent Items"},{label:"Inbox"}]; myMenu.dataProvider=dp; myMenu.selectedIndex=0; myMenu.addEventListener("itemClick",itemchickhander); pop.popUp = myMenu; pop.label = "Put in" + myMenu.dataProvider[myMenu.selectedIndex].label; } public function itemchickhander(event:MenuEvent):void { var label:String = event.item.label; poptype.text= String("move to" + label); pop.label = "put in:" + label; pop.close(); myMenu.selectedIndex = event.index; } ]]--> </mx:Script> <mx:Panel x="184" y="57" width="399" height="322" layout="absolute" title="PopupButton Example" fontSize="12" > <mx:PopUpButton x="68" y="85" label="Edit" width="171" height="27" creationComplete="initMenu();" id="pop"/> <mx:TextInput x="68" y="151" id="poptype" height="58"/> <mx:Spacer height="57" width="1" x="126" y="120"/> </mx:Panel> </mx:Application>

效果如图所示：

 

 

 

 

 

2.Button   这是一个普通的按钮组件

 

 toggle="true"//当点击的时候显示被按住的状态
  icon="@Embed('../assets/6.gif')"//按钮中插入图片
常用属性：
　　1、emphasized：获取或设置一个布尔值，指示当按钮处于弹起状态时，Button 组件周围是否绘有边框。默认为：
false
　　2、Label:按扭上显示的文本。
　　3、Icon:按扭上显示的图标。如：icon="@Embed('Images/mm-icon.png')"
　　4、click:按扭的监听单击事件所的方法。除了click也可以监听它的其他识见，如mouseMove、mouseOver、mouseOut、rollOver、rollOut、mouseDown 和 mouseUp。

 

   代码如下：

 

<?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"> <mx:Script> <!--[CDATA[ import flash.events.Event; public function printMessage(event:Event):void { message.text+= event.target.label+ "ONpress" +"/n" } ]]--> </mx:Script> <mx:Panel x="125" y="70" width="444" height="347" layout="absolute"> <mx:VBox x="25" y="53" width="158" height="254"> <mx:Button label="icon " id="iconButton" width="122" height="38" icon="@Embed('../assets/6.gif')" labelPlacement="right" click="printMessage(event)"/> <mx:Button label="Button" height="35" selected="true" fontStyle="italic" toggle="true" fontSize="13" textAlign="left" width="123" click="printMessage(event)"/> <mx:Button label="按钮" width="116" height="34" click="printMessage(event)"/> </mx:VBox> <mx:TextArea x="218" y="53" width="176" height="231" id="message"/> </mx:Panel> </mx:Application>

 

 

 

效果如如所示：

 

哈哈，猪猪的图片有点大哦!