Forked from:: taiga's MXML Test 081225 XML から Flex Control を動的生成するサンプル

flex勉強中。ごちゃごちゃ

forked:0
favorite:0
lines:184
license : All rights reserved
modified : 2009-08-14 07:52:05

Embed: Tweet

<?xml version="1.0" encoding="utf-8"?>

<mx:Application
    xmlns:mx = "http://www.adobe.com/2006/mxml"
    layout   = "vertical"
>

<mx:Style>
        Application {
            background-gradient-colors: #ffffff, #000000;
        }
        .hogeStyle {
            color : #333333;
            font-size: 20;
        }
    </mx:Style>

<mx:Model id="datalist">
      <states>
        
        <data label="Alabama">
            <hoge type="Button">moge</hoge>
            <fuga type="TextInput">age</fuga>
            <piyo type="TextArea">aaaaaaa</piyo>
        </data>
      </states>
    </mx:Model>    
                    
    <mx:Label id="debugLabel"/>  
    
    <mx:HBox id="hbox">
        <mx:Box>
            
            <mx:List height="300" labelField="label" id="id_list" dataProvider="{datalist.data}" change="ChangeList(event)" >
            </mx:List>
        </mx:Box>
 
        <mx:Box id="dataArea">
            
            <mx:HBox><mx:Label text="ID"/><mx:TextInput id="data_id" /></mx:HBox>
        </mx:Box>
        
    </mx:HBox>
    <mx:Script>
        <![CDATA[
            import mx.controls.*;
            import mx.core.UIComponent;
            /**
             * サンプル XML データ
             */
            private static const SAMPLE_XML:XML =
                <component>
                    <Button
                        id        = 'hoge'
                        name      = 'hoge'
                        x         = '100'
                        y         = '100'
                        width     = '200'
                        height    = '50'
                        label     = 'ほげ'
                        styleName = 'hogeStyle'
                     />
                    <TextInput
                        id        = 'fuga'
                        name      = 'fuga'
                        x         = '100'
                        y         = '170'
                        width     = '200'
                        height    = '20'
                     />
                    <TextArea
                        id        = 'piyo'
                        name      = 'piyo'
                        x         = '100'
                        y         = '200'
                        width     = '200'
                        height    = '300'
                     />
             </component>;
             
             private var dataIDList:Vector.<String>;
             public var selectedItem:Object;
             public var componentDataName:Object = new Object();
             
             private function ChangeList(event:Event) : void
             {
                 this.selectedItem=List(event.target).selectedItem;
                 
                //    うまく行かないのはわかるけど、なんとかしたいなあぁあああああ
                //debugLabel.text = dataIDList[0];
                for each( var s:String in dataIDList ) 
                {
                    debugLabel.text = s + selectedItem.hoge;
                    this[s].label = selectedItem.hoge;
                    debugLabel.text = "uo";
                 }
                 //debugLabel.text =  selectedItem.data//.toString();
             }
            /**
             * @private
             * 子生成
             */
            protected override function createChildren():void {
                
                super.createChildren();
                var attributeName :XML;
                var child         :XML;
                var xml           :XML     = SAMPLE_XML;
                var list          :XMLList = xml.children();
                var componentName :String;
                var properties    :Object;
                
                dataIDList = new Vector.<String>();
                
                for each(child in list) {
                    componentName = child.localName().toString();
                    properties    = new Object();
                    for each(attributeName in child.attributes()) {
                        properties[attributeName.localName()] = attributeName.toString();
                    }
                    generateComponent(componentName, properties);
                }
                
                
                //    データを追加するためのボタン
                var button:Button = new Button();
                button.label = "このデータを追加する"
                dataArea.addChild(button);
                button.addEventListener( MouseEvent.CLICK, AddData );
        
                debugLabel.text = dataIDList.length.toString();//"success"
                
                /*
                
                
            registerClassAlias("ComboBox",    ComboBox    );
            registerClassAlias("Image",       Image       );
            registerClassAlias("Label",       Label       );
            registerClassAlias("Text",        Text        );
            registerClassAlias("TextArea",    TextArea    );
            registerClassAlias("TextInput",   TextInput   );
            registerClassAlias("RadioButton", RadioButton );
            */
                
                componentDataName["Button"]       = "label";
                componentDataName["CheckBox"]     = "selected";
                componentDataName["ColorPicker"]  = "selectedColor";
                componentDataName["ComboBox"]  = "selectedColor";
            }
            
            /**
             * 子供のデータを追加する
             * @param event まうすいべんと
             */
            private function AddData( event:MouseEvent ) : void
            {
                debugLabel.text ="debuglabel"
                
                var obj:Object = new Object();
                obj = {label:"test", data:"aaaaaaaaa" };
                
                obj.label = data_id.text;
                datalist.data.push(obj);
                
                for( var s:String in dataIDList ) 
                {
                   obj[s] = this[s];
                }
                
                //    更新
                id_list.dataProvider=datalist.data;
            }
            
            /**
             * @private
             * Flex Control の生成
             */
            private function generateComponent(componentName:String, properties:Object):void {
                var clazz     :Class       = getClassByAlias(componentName);
                var newObject :UIComponent = new clazz();
                var xml       :XML         = describeType(clazz);
                var propDesc  :XML;
                var list      :XMLList;
                var prop      :String;
                var propType  :String;
                for(prop in properties) {
                    list = xml.factory.accessor.(@name == prop);
                    if(!list) {
                        list = xml.factory.variable.(@name == prop);
                    }
                    if(list && list.length() > 0) {
                        propDesc = list[0] as XML;
                        propType = propDesc.@type.toString();
                        switch(propType) {
                            case "Object":
                            case "String":
                                newObject[prop] = properties[prop];
                                break;
//                            case "Date":
//                                newObject[prop] = properties[prop];
//                                TODO:日付のパース
//                                break;
                            case "Number":
                                newObject[prop] = parseFloat(properties[prop]);
                                break;
                            case "int"  :
                            case "uint" :
                                newObject[prop] = parseInt(properties[prop]);
                                break;
                        }
                    }
                }
                //    idをもらう
                dataIDList.push( newObject.id );
                dataArea.addChild(newObject);
            }
            registerClassAlias("Button",      Button      );
            registerClassAlias("CheckBox",    CheckBox    );
            registerClassAlias("ColorPicker", ColorPicker );
            registerClassAlias("ComboBox",    ComboBox    );
            registerClassAlias("Image",       Image       );
            registerClassAlias("Label",       Label       );
            registerClassAlias("Text",        Text        );
            registerClassAlias("TextArea",    TextArea    );
            registerClassAlias("TextInput",   TextInput   );
            registerClassAlias("RadioButton", RadioButton );
            
        ]]>
    </mx:Script>
</mx:Application>

Code Fullscreen

Preview Fullscreen