Question

我已经基于Image组件创建了一个自定义组件。我想教它来响应绑定变量的变化。例如。如果主类具有可变余额，我希望组件在平衡= 100个图像的情况下更改图像，以防余额= 50到另一个图像。

有人可以帮助理解如何做到这一点

我正在使用flex3，所以不要在那里看到propertyWatcner。此外，我正在使用主mxml文件中的component2

<MyComp:MyIcon left="15" top="20" width="60" height="60"
    id="tower" price="100" accountState="{accountMoney}"
    click="drawBuildingShadow(event)" />

在组件MyIcon中，我希望能够对绑定的accountState变量进行更改。

Answer 1

没有任何代码（如果可以的话，请包括两个组件的样本），有很多方法可以解决这个问题。

您可以添加绑定到相关变量的ChangeWatcher，并在属性更改时调用方法。此方法可以根据适用于该属性的任何条件更改图像。

它会像一样：

Component 1:
  [Bindable]
  public var yourVariable:Number;

Component 2:
  private var propertyWatcher:ChangeWatcher;
  //In some initialization method -- this is JUST an example method for how to create the property watcher
  public function init(): void {
      ...
      propertyWatcher = ChangeWatcher.watch(component1, "yourVariable", onVariableUpdate);
  }

  //Define this as a new method to handle when the property changes
  private function onVariableUpdate(event:PropertyChangeEvent):void {
     if(event.newValue == 50) {
       yourImage.source = newSource;
     }
     else if(event.newValue == 100) {
       yourImage.source = otherSource;
     }
  }

显然，这是非常截断和简写，但希望它可以帮助你开始。

编辑：ChangeWatchers确实存在于Flex 3中，但听起来你应该朝着不同的方向前进。由于您发布的代码片段有点小，我将对您如何执行此操作做一些假设：）

正如alxx在评论中提到的，您可以将组件中的属性accountState从实际属性更改为setter / getter。这将允许您在更新accountState时进行更广泛的处理。

它应该看起来像这样的东西：

MyComp：

//Inside your script tag:
private var _accountState:Number;

[Bindable]
public function get accountState():Number {
    return _accountState;
}
public function set accountState(state:Number):void {
    _accountState = state;
    switch(state) {
        case 50:
            yourIcon.source = "blahblahblah";
            break;
        case 100:
            yourIcon.source = "blahblahblah2";
            break;
        //And so on
    }
}

这不会改变您发布的代码：它应该在您编写代码时仍然有效。我没有测试过这个，所以我可能会遗漏一些东西，但希望这会有所帮助：）

flex：如何响应组件内部的数据更改

1 个答案: