4 Replies Latest reply on Aug 18, 2008 6:11 PM by Newsgroup_User

    Retreive information at run time

    Linus75
      Hi,

      I'm new with Flex 2. I try to display custom components at run time in a canvas and positioning them in it.
      I cant display all my component in the canvas but i'm not able to positionning them. In fact, i can't retrieve the width and height of the component. They are always at 0.

      Here is the code of my mxml
      public function buttonclick() : void
      {
      var myObject:Object = dgPosts.dataProvider;
      var wCpt: int = 1;
      var wBox1Width:int = Box1.width;
      var wBox1CurrentXPosition:int = 0;
      var wBox1CurrentYPosition:int = 0;

      // Add images to Canvas
      for each (var item:Object in myObject)
      {
      var image1:ImageComponent = new ImageComponent(item.AgentName, item.AgentType, item);
      image1.id = item.UniqueName;
      image1.addEventListener(MouseEvent.CLICK, clickHandler);
      image1.addEventListener(MouseEvent.MOUSE_MOVE, tbMouseMoveHandler);

      // here comes the trouble
      // image1.width and image1.height are always at 0 and i don't know why ??
      // i'm expecting the size of the component...

      if (wBox1Width >= image1.mouseX)
      {
      image1.x = wBox1CurrentXPosition;
      wBox1CurrentXPosition = wBox1CurrentXPosition + image1.width + 5;
      wBox1Width = wBox1Width - image1.width;
      image1.y = wBox1CurrentYPosition;
      }
      else
      {
      // Begin an other row
      wBox1CurrentXPosition = 0;
      wBox1CurrentYPosition = wBox1CurrentYPosition + image1.height + 5;
      wBox1Width = Box1.width;
      image1.x = wBox1CurrentXPosition;
      wBox1CurrentXPosition = wBox1CurrentXPosition + image1.width + 5;
      wBox1Width = wBox1Width - image1.width;
      image1.y = wBox1CurrentYPosition;
      }
      wCpt++;
      Box1.addChild(image1);
      }

      // Eventually Add links between images here
      }

      Thank's for helpping me undrestand what i'm doing wrong.
        • 1. Re: Retreive information at run time
          Linus75 Level 1
          I Forgot to add the code of the component .as for a better understanding of my problem. Here it is :

          [Bindable]
          public class ImageComponent extends Panel
          {
          private var wImage:Image;

          public function ImageComponent(name:String, type:String, item:Object)
          {
          super();
          wImage = new Image();
          wImage.id = item.UniqueName;
          wImage.load("D:/" + item.Type + ".jpg");
          this.title = item.Name;
          this.doubleClickEnabled = true;
          this.addChild(wImage);
          this.data = item;
          }
          • 2. Re: Retreive information at run time
            peterent Level 2
            Flex uses a multi-phase approach to creating components. In order to see a component on the screen, Flex has to measure it, position it, and render it. That's done in several passes. That means you cannot create a component, set its properties and expect to get its width - that won't be determined until "later".

            To work properly you need to go with the flow of the Flex framework. It is easier than it sounds. First, no matter what component you have your code within, as long as it is a class that extends UIComponent (and MXML files for the most part do), you can use the Flex framework.

            First, create your components in the createChildren function:

            override protected function createChildren() : void
            {
            super.createChildren();
            // now create your components - just do new YourComponent() and set its properties and styles.
            }

            override protected function commitProperties() : void
            {
            super.commitProperties();
            // now use any of the properties in this file to modify your components. For example, may be you have a property in this
            // file which changes a property on the components created in createChildren(). You have to do this here because
            // your property in this file may not be set when createChildren is called.
            }

            override protected function measure() : void
            {
            super.measure();
            // The Flex framework calls this function when it wants to know how big your component is. If you have set your component's
            // width and height explicitly, this function won't be called. If it is called, set measuredWidth and measuredHeight to reasonable
            // values
            }

            override protected function updateDisplayList( unscaledWidth, unscaledHeight ) : void
            {
            super.updateDisplayList( unscaledWidth, unscaledHeight );
            // When this function is called your components have been measured so they will now have a width and height
            // so you can position them. Or you can change their width and height if need to.
            }

            Take a moment and read up on these functions in the Flex documentation, it will make writing your own components a lot easier.
            • 3. Re: Retreive information at run time
              vikceo
              can you please point me to a doc or tutorial describing this process?
              • 4. Re: Retreive information at run time
                Level 7

                "vikceo" <webforumsuser@macromedia.com> wrote in message
                news:g8ctmn$5q0$1@forums.macromedia.com...
                > can you please point me to a doc or tutorial describing this process?

                There's an example available from the Start Page.