ActionScript 3.0中通过调用getDefintionByName函数动态创建按钮等控件的例子

By Minidxer | August 31, 2008

接下来的例子演示了ActionScript 3.0中通过调用getDefintionByName函数,动态创建按钮等控件。

让我们先来看一下Demo可以右键View Source或点击这里察看源代码):


下面是完整代码(或点击这里察看):

Download: main.mxml
  1. <?xml version="1.0" encoding="utf-8"?>
  2. <mx:Application name="getDefinitionByName_test"
  3.         xmlns:mx="http://www.adobe.com/2006/mxml"
  4.         layout="vertical"
  5.         verticalAlign="middle"
  6.         backgroundColor="white">
  7.  
  8.     <mx:Script>
  9.         <![CDATA[
  10.             import mx.core.UIComponent;
  11.             import flash.utils.getDefinitionByName;
  12.             import mx.controls.*;
  13.  
  14.             /**
  15.              * Create references to component classes so the classes get
  16.              * included in the SWF document.
  17.              */
  18.             private var dummyArr:Array = [Button, CheckBox, ComboBox,
  19.                                             List, TextInput, TextArea];
  20.  
  21.             private function createBtn_click(evt:MouseEvent):void {
  22.                 var className:String = comboBox.selectedItem.toString();
  23.                 // Convert class name to Class object.
  24.                 var cls:Class = getDefinitionByName(className) as Class;
  25.  
  26.                 // Create a new instance of the class.
  27.                 var instance:UIComponent = new cls();
  28.                 if (instance) {
  29.                     switch (instance.className) {
  30.                         case "Button":
  31.                             Button(instance).label = "I am a Button";
  32.                             break;
  33.                         case "CheckBox":
  34.                             CheckBox(instance).label = "I am a CheckBox";
  35.                             break;
  36.                         case "ComboBox":
  37.                             ComboBox(instance).dataProvider = ["I am a ComboBox"];
  38.                             break;
  39.                         case "List":
  40.                             List(instance).dataProvider = ["I am a List"];
  41.                             instance.width = 100;
  42.                             break;
  43.                         case "TextInput":
  44.                             TextInput(instance).text = "I am a TextInput";
  45.                             break;
  46.                         case "TextArea":
  47.                             TextArea(instance).text = "I am a TextArea";
  48.                             break;
  49.                     }
  50.  
  51.                     // Remove all children and add new child.
  52.                     canvas.removeAllChildren();
  53.                     canvas.addChild(instance);
  54.                 }
  55.             }
  56.         ]]>
  57.     </mx:Script>
  58.  
  59.     <mx:ApplicationControlBar dock="true">
  60.         <mx:Form styleName="plain"
  61.                 defaultButton="{createBtn}">
  62.             <mx:FormItem label="Class:"
  63.                     direction="horizontal">
  64.                 <mx:ComboBox id="comboBox">
  65.                     <mx:dataProvider>
  66.                         <mx:Array>
  67.                             <mx:String>mx.controls.Button</mx:String>
  68.                             <mx:String>mx.controls.CheckBox</mx:String>
  69.                             <mx:String>mx.controls.ComboBox</mx:String>
  70.                             <mx:String>mx.controls.List</mx:String>
  71.                             <mx:String>mx.controls.TextInput</mx:String>
  72.                             <mx:String>mx.controls.TextArea</mx:String>
  73.                         </mx:Array>
  74.                     </mx:dataProvider>
  75.                 </mx:ComboBox>
  76.                 <mx:Button id="createBtn"
  77.                         label="Create"
  78.                         click="createBtn_click(event);" />
  79.             </mx:FormItem>
  80.         </mx:Form>
  81.     </mx:ApplicationControlBar>
  82.  
  83.     <mx:Canvas id="canvas"
  84.             horizontalCenter="0"
  85.             verticalCenter="0" />
  86.  
  87. </mx:Application>
代码:Peter deHaan 翻译/整理/编译:中文Flex例子

Topics: Flex | No Comments » | 976 views Tags: ,

Search Posts