Flex 4从自定义组件中调度自定义事件

时间:2012-02-16 07:49:20

标签: flex event-handling custom-component custom-events

这类似于here提出的问题。我正在调度自定义事件“ShopEvent”,但是我收到错误“类型强制失败:无法将flash.events::Event@81ecb79转换为com.events.ShopEvent”

注意:从父自定义组件(第3个代码段)引发错误,我在那里添加了更多详细信息

这是我的自定义事件。看到第一个常量,我复制了自定义组件中的事件名称。

package com.events
{
    import flash.events.Event;

    public class ShopEvent extends Event
    {

        public static var MENU_SELECTED:String = "menuSelected";
        public static var SUBMENU_SELECTED:String = "submenuSelected";
        public static var ITEM_SELECTED:String = "itemSelected";
        public static var NAV_NEXT:String = "navNext";
        public static var NAV_PREVIOUS:String = "navPrevious";
        public static var NAV_LAST:String = "navLast";
        public static var NAV_FIRST:String = "navFirst";
        public static var CLOSE:String = "close";

        public var menuIdx:int;
        //public var menuType:String;
        public var menuId:int;
        public var menuName:String;
        public var itemId:int;
        public function ShopEvent(type:String, bubbles:Boolean=false, cancelable:Boolean=false)
        {
            super(type, bubbles, cancelable);
        }
    }
}

自定义组件。检查元数据标签。事件正确注册

<?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="72" height="82"
         mouseChildren="false"
         creationComplete="init()"
         click="onClick()"
         buttonMode="true">
    <s:layout>
        <s:VerticalLayout horizontalAlign="center"/>
    </s:layout>
    <fx:Script>
        <![CDATA[
            import com.events.ShopEvent;

            import mx.controls.Image;
            public var menuId:int;

            [Bindable]
            public var menuText:String;
            [Bindable]
            public var bmp:Bitmap;

            private function init():void{
                //img.addChild(bmp);
            }
            private function onClick():void{
                var e:ShopEvent = new ShopEvent(ShopEvent.MENU_SELECTED);
                e.menuId = menuId;
                e.menuName = menuText;
                dispatchEvent(e);
            }

        ]]>

    </fx:Script>
    <fx:Metadata>
        [Event(name="menuSelected", type="com.events.ShopEvent")]
    </fx:Metadata>
    <fx:Declarations>
        <!-- Place non-visual elements (e.g., services, value objects) here -->
    </fx:Declarations>
    <s:Label text="{menuText}" fontWeight="bold" fontSize="12" width="44"/>
    <mx:Image id = "img" width="57" height="47" source="{bmp}"/>

</s:Group>

父自定义组件。这是上面的自定义组件的父组件。它侦听menuSelected事件,它只是将事件路由到侦听器。检查meatadata标签。事件注册已正确完成。

然而,错误发生在

           menus[i].addEventListener( ShopEvent.MENU_SELECTED,function(e:ShopEvent):void{dispatchEvent(e);});

据我所知,我没有看到代码中的任何问题。它有什么不对吗?

更新

令人惊讶的是,如果我创建shopwevent的“新”实例将解决问题,但遗憾的是,我需要关闭事件对象的所有属性。我希望这不是flex的限制。

                menus[i].addEventListener( ShopEvent.MENU_SELECTED,function(e:ShopEvent):void{dispatchEvent(new ShopEvent(ShopEvent.MENU_SELECTED));});

完整代码

<?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="720" height="605"
         creationComplete="init()" xmlns:shop="UI.shop.*" xmlns:hasu="UI.shop.hasu.*"
         >
    <fx:Declarations>
        <!-- Place non-visual elements (e.g., services, value objects) here -->
    </fx:Declarations>
    <fx:Metadata>
        [Event(name="navNext", type="com.events.ShopEvent")]
        [Event(name="navPrevious", type="com.events.ShopEvent")]
        [Event(name="menuSelected", type="com.events.ShopEvent")]
        [Event(name="submenuSelected", type="com.events.ShopEvent")]
        [Event(name="itemSelected", type="com.events.ShopEvent")]
        [Event(name="close", type="com.events.ShopEvent")]
    </fx:Metadata>

    <fx:Script>
        <![CDATA[
            import com.events.ShopEvent;

            private const MAX_SLOTS:int = 6;

            public var menus:Vector.<ShopMenuItemView>;
            public var itemSlots:Vector.<ShopItemSlotView> = new Vector.<ShopItemSlotView>(MAX_SLOTS);

            private function init():void{
                trace("BEGIN:UI.shop.hasu.ShopView.init");
                initSlots();
            }

            private function initSlots():void{

                for (var i:int = 0;i<itemSlots.length;i++){
                     var slot:ShopItemSlotView = new ShopItemSlotView();
                    itemSlots[i] = slot; 
                    itemSlotsContainer.addElement(slot);
                }
            }

            public function initMenus():void{
                trace("BEGIN:UI.shop.hasu.ShopView.initMenus");
                for (var i:int = 0;i < menus.length;i++){
                    menuContainer.addElement(menus[i]);
                    menus[i].addEventListener(ShopEvent.MENU_SELECTED,function(e:ShopEvent):void{dispatchEvent(e);});
                    //menus[i].addEventListener( ShopEvent.MENU_SELECTED,function(e:ShopEvent):void{dispatchEvent(new ShopEvent(ShopEvent.MENU_SELECTED));});
                }
            }



        ]]>
    </fx:Script>

    <s:layout>
        <s:VerticalLayout />
    </s:layout>
    <s:VGroup name="top">
        <hasu:ShopPlayerAttributesView id="attribsComp"/>
        <s:Group id="menuContainer" name="menus">
            <s:layout>
                <s:HorizontalLayout />
            </s:layout>
        </s:Group>
    </s:VGroup>
    <s:Group>
        <s:layout>
            <s:HorizontalLayout />
        </s:layout>
        <s:Button label="&lt;" />
        <s:Group id = "itemSlotsContainer" name="items">
            <s:layout>
                <s:TileLayout requestedColumnCount="3" requestedRowCount="3"/>
            </s:layout>
        </s:Group>
        <s:Button label="&gt;" />
    </s:Group>
</s:Group>

4 个答案:

答案 0 :(得分:2)

您必须覆盖自定义事件类的clone()方法。在传播过程中可以多次克隆事件。

答案 1 :(得分:1)

杰克的回答是正确的。它在flex文档中给出。

  

您需要覆盖您的Event.clone()方法   子类。 clone()方法返回事件对象的克隆副本   通过在克隆中设置type属性和任何新属性。   通常,您定义clone()方法以返回事件实例   使用新运算符创建。

有关详细信息,请参阅Working with events部分

下的creating subclass from the event

了解新flex / as3开发人员阅读Dispatching the custom events

的自定义事件的好地方

注意:链接指向Flex 4.6文档,但自定义事件部分不依赖于版本(对于flex 3和先前版本,只有mxml部分可能不同)

答案 2 :(得分:0)

您必须返回事件类的新构造函数,如:

return new ShopEvent(type,...); //in the clone() method;

clone()方法通过设置类型属性和克隆中的任何新属性来返回事件对象的克隆副本。通常,您定义clone()方法以返回使用new运算符创建的事件实例。

答案 3 :(得分:-1)

您要调度的事件来自flash.events.Event类型,并且侦听器期望的事件来自类型:com.events.ShopEvent。

这就是错误信息的含义。

相关问题