2011-02-17 2 views
1

J'ai créé un composant personnalisé basé sur le composant Image. Je veux lui apprendre à répondre au changement de variable liée. Par exemple. Si la classe principale a une balance variable, je veux que le composant change d'image en cas de solde = 100 une image, en cas de solde = 50 à l'autre.flex: Comment répondre aux changements de données dans un composant

peut aider quelqu'un à comprendre comment faire


J'utilise Flex3 donc ne pas voir propertyWatcner là. Aussi je me sers composant2 du fichier MXML principal de cette façon

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

Et à l'intérieur MyIcon des composants que je veux être en mesure de réagir des changements de variables binded accountState.

+0

Vous pouvez convertir une variable en getter/setter et changer l'image dans le setter. – alxx

Répondre

3

Sans aucun code (veuillez inclure un échantillon des deux composants si vous le pouvez), il existe plusieurs façons d'aborder cette question.

Vous pouvez ajouter un ChangeWatcher qui est lié à la variable en question et appelle une méthode lorsque la propriété change. Cette méthode peut modifier l'image, en fonction des conditions applicables à la propriété.

Il regarderait quelque chose comme ceci:

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; 
    } 
    } 

De toute évidence, cela est très tronquée et la sténographie, mais nous espérons qu'il va vous aider à démarrer.


Modifier: ChangeWatchers existent dans Flex 3, mais il semble que vous devriez aller dans une autre direction. Étant donné que l'extrait de code que vous avez posté est un peu petit, je vais faire quelques hypothèses sur la façon dont vous pourriez faire :)

Comme alxx mentionné dans son commentaire, vous pouvez changer la propriété accountState dans votre composant d'un propriété réelle, à un setter/getter. Cela vous permettra de faire un traitement plus approfondi lorsque accountState sera mis à jour.

Il devrait ressembler à quelque chose comme ceci:

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 
    } 
} 

Cela ne changera pas le code affiché: il doit encore travailler comme vous l'avez écrit. Je n'ai pas testé cela, donc il est possible que je manque quelque chose, mais j'espère que cela aidera :)

+0

S'il vous plaît voir le commentaire –

Questions connexes