将更改事件添加到自定义 MXML 组件答案

【问题标题】：Add change event to a custom MXML component将更改事件添加到自定义 MXML 组件
【发布时间】：2012-11-17 12:40:18
【问题描述】：

我正在 Flash Builder 4.5 中构建一个 MXML 项目

我有一个包含 TextInput 字段的自定义 MXML 组件。我希望自定义组件具有触发主应用程序中的功能的更改事件。

我搜索了这个网站，发现很多帖子与我想要的内容很接近，但我无法准确找到我需要的内容，我现在很困惑。

我创建了一个测试项目来尝试解决这个问题。目前，它似乎触发了一次事件然后停止。请看一下，让我知道我哪里出错了。非常感谢。

customComponent.mxml

    <?xml version="1.0" encoding="utf-8"?>
<mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml"
           width="40" height="20"> 
    <mx:Script>
    <![CDATA[

        [Bindable]
        public var value:Number;

        protected function inputBox_clickHandler(event:KeyboardEvent):void
        {
            if (event.keyCode == 38 ) {
                keyUp();
            }
            if (event.keyCode == 40 ) {
                keyDown();
            }
        }
        protected function keyUp():void
        {
            value = value++;
            dispatchEvent(new Event('change'))
        }
        protected function keyDown():void
        {
            value = value--;
            dispatchEvent(new Event('change'))
        }
    ]]> 
</mx:Script>
<mx:Metadata>
    [Event(name="change", type="flash.events.Event")]
</mx:Metadata>

<mx:TextInput id="inputBox" x="0" y="0" width="40" height="20"
              text="{value}"
              keyDown="inputBox_clickHandler(event)"
              change="dispatchEvent(new Event('change'))" 
              />
 </mx:Canvas>

main.mxml

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
            xmlns:CustomComponents="CustomComponents.*"
            minWidth="955" minHeight="600" layout="absolute">
<mx:Script>

    <![CDATA[

        private function changeTestLabel():void 
        {
            testLabel.text = String(myComponent.value);
        }

    ]]> 

</mx:Script>
<CustomComponents:customComponent x="180" y="183"
    id="myComponent" value="0"
    change="changeTestLabel()">
</CustomComponents:customComponent>
<mx:Label id="testLabel" x="165" y="206" text="Test label"/>

</mx:Application>

【问题讨论】：

标签： flash events flash-builder mxml custom-component

【解决方案1】：

我已经找到了解决办法...

线索是它在第一次进行更改时起作用，将值更改为默认的“0”。问题是 var 值是 Number 类型，而 inputBox.text 是 String 类型。

因此我添加了以下功能：

  protected function textChange():void
  {
   value = Number(inputBox.text);
   dispatchEvent(new Event('change'))
  }

我还将 change="dispatchEvent(new Event('change'))" 属性更改为

valueCommit="textChange()"

...然后解决了它。

感谢所有不厌其烦的人。

【讨论】：