如何跨多个组件重用单个函数?

时间:2011-08-20 18:39:32

标签: flex

我创建了一个我正在使用的自定义组件,更方便的是,作为SkinnablePopUpContainer,我想使用相同的函数来调用和接收UI中的几个按钮的数据。无需为每个按钮创建新功能,实现此目的的最佳方法是什么?

<fx:Script>
        <![CDATA[
            import spark.events.PopUpEvent;

            protected function button1_clickHandler(event:MouseEvent):void
            {

                popup.addEventListener(PopUpEvent.CLOSE, onPopUpEventClose1, false, 0, true);
                popup.open(this);

            }

            private function onPopUpEventClose1(event:PopUpEvent):void {
                popup.removeEventListener(PopUpEvent.CLOSE, onPopUpEventClose1);
                trace(event.commit);
                trace(event.data);
                button1.label=event.data;
            }

            protected function button2_clickHandler(event:MouseEvent):void
            {

                popup.addEventListener(PopUpEvent.CLOSE, onPopUpEventClose2, false, 0, true);
                popup.open(this);

            }

            private function onPopUpEventClose2(event:PopUpEvent):void {
                popup.removeEventListener(PopUpEvent.CLOSE, onPopUpEventClose2);
                trace(event.commit);
                trace(event.data);
                button2.label=event.data;
            }


        ]]>
    </fx:Script>

    <s:Button id="button1" x="102" y="103" label="Button 1 Numbers"
              click="button1_clickHandler(event)"/>
    <s:Button id="button2" x="102" y="200" label="Button 2 Numbers"
              click="button2_clickHandler(event)"/>

你可以看到我宁愿拥有一套能够处理所有这些功能而不是手动编码每个功能的功能。

有没有办法获取调用该函数的组件的id?解决这个问题的最佳方法是什么?

编辑:解决方案

我已经能够使用以下修剪器替换所有代码:

            private var buttonPick:Button;


        public function button_clickHandler(button:Button):void
        {
            switch (button) {
                case button1: popup.addEventListener(PopUpEvent.CLOSE, onPopUpEventClose, false, 0, true);
                    popup.open(button);
                 break;
                case button2: popup.addEventListener(PopUpEvent.CLOSE, onPopUpEventClose, false, 0, true);
                    popup.open(button); break;

            }
            buttonPick = button;

        }

        private function onPopUpEventClose(event:PopUpEvent):void {
            popup.removeEventListener(PopUpEvent.CLOSE, onPopUpEventClose);
            trace(event.commit);
            trace(event.data);

            buttonPick.label=event.data;
        }

这是mxml:

<s:HGroup click="button_clickHandler(event.target as Button)">


<s:Button id="button1" x="102" y="103" label="Button 1 Numbers"
          />
<s:Button id="button2" x="102" y="200" label="Button 2 Numbers"
          />
</s:HGroup>

感谢您的意见和建议!如果有一种比用case语句更有效的方法,请务必提出建议!

2 个答案:

答案 0 :(得分:1)

阅读Event.targetEvent.currentTarget的文档。在这种情况下,您要使用currentTargetThis article描述了targetcurrentTarget之间的差异。

答案 1 :(得分:1)

您应该将这些按钮放入一个公共容器中,并监听该容器的点击次数。然后,您可以使用Event#target来检测容器中的哪个元素被单击。

您在普通容器中的按钮:

<s:Group click="button_clickHandler(event.target as Button)">
    <s:Button id="button1" x="102" y="103" label="Button 1 Numbers" />
    <s:Button id="button2" x="102" y="200" label="Button 2 Numbers" />
</s:Group>

事件处理程序:

protected function button_clickHandler(button:Button):void {
    switch (button) {
        case button1: trace('clicked button 1'); break;
        case button2: trace('clicked button 2'); break;
        default: trace('clicked somewhere else in the group'); break;
    }
}

如您所见,我使用'as'关键字将event.target强制转换为Button类。这样,如果单击除Button之外的任何其他内容,则“button”参数将为“null”。