Un composant Flex pour voir les composants

Si vous vous demandez parfois pourquoi ce satané composant ne prend pas toute la largeur qui lui est allouée alors que vous lui avez expressement demandé, alors ce qui suit est fait pour vous!

Ce composant vous permet d’espionner en temps réel tous les composant d’une application Flex. Voici par exemple, ce que cela donne sur l’application FlexStore de Adobe.

Télécharger ComponentTree.zip

Ce composant est complètement libre de droit, il est livré sous licence WTFPL. Pour l’inclure dans votre application, téléchargez le, puis importez le dans Flex Builder (File > Import puis General > « Existing Projects into Workspace ») et linkez le à votre projet.

Ensuite, vous pouvez soit ajouter un bouton pour afficher la pop-up comme suit:

<mx:Application ...>
...
<mx:Script>
  <![CDATA[
    import com.coderpeon.comptree.ComponentTreeWnd;
  ]]>
</mx:Script>
<mx:Button label="Button" click="ComponentTreeWnd.show()" />
...
</mx:Application>

ou bien, enregistrez un raccourci clavier pour ouvrir l’espion de composants (dans le creationComplete de votre application par exemple):

<mx:Application creationComplete="onCreationComplete()"...>
...
<mx:Script>
  <![CDATA[
    private function onCreationComplete():void
    {
      // Register "Ctrl+F12" shortcut.
      ComponentTreeWnd.registerKey(this, 123, true, false, false);
    }
  ]]>
</mx:Script>
...
</mx:Application>

Et voilà.

[18-10-2007] Le lien pour télécharger le fichier a été mis à jour.