Apache Adobe Flex TutorialTutoriaux Adobe Flex & AIR en Français

Flex Tips – Ne donnez jamais "controlBar" comme id de composant

Un petit "bug" assez original que j'ai trouvé avec un collègue sur une application Flex toute simple.Voici en simplifié, le code que l'on avait pour notre application Flex 3:

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" paddingBottom="0" paddingLeft="0"
                paddingRight="0" paddingTop="0">
  <mx:Canvas width="100%" height="100%" backgroundColor="white">
    <mx:HBox id="controlBar" backgroundColor="0xBBBBBB" width="100%">
      <mx:Button label="button 1" />
      <mx:Button label="button 2" />
      <mx:Button label="button 3" />
      <mx:Button label="button 4" />
    </mx:HBox>
  </mx:Canvas>
</mx:Application>

Plutôt simple, non? Il y avait bien sûr d'autres composants mais voilà le point principal qui nous intéresse. En théorie, on devrait avoir un Canvas blanc qui prend tout l'écran avec dedans, une barre de menu horizontale contenant quelques boutons. Voici pourtant le résultat:

Bon, si vous avez lu le titre de ce billet (vous l'avez lu, non ?), vous avez sûrement compris ce qui cloche: l'identifiant donné à notre HBox: "controlBar". Alors pourquoi cela représente-t-il un problème?

Et bien il existe déjà une déclaration de variable dans le composant Application qui est "controlBar":

    /**
     *  The ApplicationControlBar for this Application.
     *
     *  @see mx.containers.ApplicationControlBar
     *  @default null
     */
    public var controlBar:IUIComponent;

Votre composant vient donc en quelque sorte "surcharger" cette variable réservée pour une éventuelle ApplicationControlBar. Celle-ci vient se docker en haut de l'application, l'espace lui sera alors réservé même si votre composant est ailleurs dans la display list.

Voilà, pour corriger ce "bug", donnez simplement un autre identifiant à votre composant