[Flex] Accordion系列-动态添加或删除Accordion容器中项目

<?xml version="1.0" encoding="utf-8"?>
<!--Flex中如何使用addChild()和removeChild()函数动态添加或删除Accordion容器中项目的例子 -->
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
               xmlns:s="library://ns.adobe.com/flex/spark" 
               xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600">
    
    <fx:Script>
        <![CDATA[
            import mx.containers.VBox;
            private const MAX_CHILDREN:uint = 5;
            protected function accordion_addChild(event:MouseEvent):void
            {
                if (accordion.numChildren < MAX_CHILDREN) {
                    var vbox:VBox = new VBox();
                    vbox.label = "child " + accordion.numChildren;
                    vbox.percentWidth = 100;
                    vbox.percentHeight = 100;
                    var randColor:uint = Math.random() * 0xFFFFFF;
                    vbox.setStyle("backgroundColor", randColor);
                    accordion.addChild(vbox);
                }

            }
            
            protected function accordion_removeChild(event:MouseEvent):void
            {
                if (accordion.selectedChild) {
                    accordion.removeChild(accordion.selectedChild as DisplayObject);
                }
            }
            
        ]]>
    </fx:Script>
    
    <fx:Declarations>
        <!-- 将非可视元素（例如服务、值对象）放在此处 -->
    </fx:Declarations>
    <s:controlBarContent>
        <s:Button label="Add child" click="accordion_addChild(event)"/>
        <s:Button label="Remove child" click="accordion_removeChild(event)"/>
    </s:controlBarContent>
    <mx:Accordion id="accordion" width="240" height="160"/>
</s:Application>