Question

我的应用程序中有VGroup，其中包含多个MyComponent类型的自定义组件。现在我在MyComponent中有一个删除方法，该方法一旦运行就会从VGroup中删除该元素。我知道我应该使用parentDocument.vgroupId.removeElement()但是要传递什么作为参考？

注意：我想在MyComponent

的方法中进行删除

更新：这是我的来源：在我的主要应用程序中

<s:VGroup id="vgroupId" width="100%" height="100%" />

现在我将自定义组件添加为：

 var cust:FunctionElement = new MyComponent(); // MyComponent extends spark Panel
 vgroupId.addElement(cust);

从MyComponent致电

parentDocument.vgroupId.removeElement(this) // get this error => TypeError: Error #1034: Type Coercion failed: cannot convert global@5ed30d1 to mx.core.IVisualElement.

如果我将其投放为this as IVisualElement，我会收到一个等于null的错误

Answer 1

此示例将说明如何执行此操作..

ExampleApp.mxml

<?xml version="1.0" encoding="utf-8"?>
<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[
            protected function button1_mouseUpHandler(event:MouseEvent):void
            {
                vgroup.addElement(new MyComponent());
            }
        ]]>
    </fx:Script>
    <s:VGroup id="vgroup" top="30" />
    <s:Button label="Add" mouseUp="button1_mouseUpHandler(event)"/>
</s:Application>

像这样定义MyComponent.mxml ......

<?xml version="1.0" encoding="utf-8"?>
<s:Group xmlns:fx="http://ns.adobe.com/mxml/2009" 
         xmlns:s="library://ns.adobe.com/flex/spark" 
         xmlns:mx="library://ns.adobe.com/flex/mx" width="100" height="35">
    <fx:Script>
        <![CDATA[
            import spark.components.VGroup;
            protected function button1_mouseUpHandler(event:MouseEvent):void
            {
                // A few useful traces to see what's what and where.
                trace(this);
                trace(this.parent);
                trace((this.parent as VGroup).getElementIndex(this));
                // But all we actually need is ...
                var vgroup:VGroup = (this.parent as VGroup);
                vgroup.removeElement(this);
                // (this.parent as VGroup).removeElement(this); // Would also work fine.
            }
        ]]>
    </fx:Script>
    <s:Button mouseUp="button1_mouseUpHandler(event)" label="Kill me!"/>
</s:Group>

Answer 2

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" xmlns:s="library://ns.adobe.com/flex/spark">
    <mx:Script>

            import mx.core.IVisualElement;
            import spark.components.Button;

            private function getNewElement():IVisualElement
            {
                var btn:spark.components.Button = new spark.components.Button();
                btn.label = "button " + myContent.numElements;
                return btn;
            }

            private function addFirstElement():void
            {
                myContent.addElementAt( getNewElement(), 0 );
            }

            private function removeFirstElement():void
            {
                if( myContent.numElements > 0 )
                    myContent.removeElement( myContent.getElementAt( 0 ) );
            }

            private function removeLastElement():void
            {
                if( myContent.numElements > 0 )
                    myContent.removeElementAt( myContent.numElements - 1 );
            }


    </mx:Script>


    <mx:Button label="addFirst" click="addFirstElement();" />
    <mx:Button label="removeFirst" click="removeFirstElement()" />
    <mx:Button label="removeLast" click="removeLastElement()" />
    <mx:Button label="removeAll" click="myContent.removeAllElements()" />

    <mx:VBox id="myContent">
    </mx:VBox>

</mx:Application>

Flex：删除视觉元素

2 个答案: