6 Replies Latest reply on Feb 10, 2007 3:20 AM by darko.romanov

    Get image size

    darko.romanov
      Hi all,

      I'm going mad about this. I need to know the size (width and height) of an image I load runtime. An example:

      ...
      <mx:Image id="myimage" />
      ...

      myimage.source = " http://someurl/getimage.php?id=2";

      trace(myimage.width);

      it returns always 0.

      Have you any idea to solve it?
      thanks
        • 1. Re: Get image size
          frenchi30 Level 1
          What you need to do is make sure that your image is loaded before you access its properties. Below I am calling a function that is called only when the page and its elements are loaded.


          <?xml version="1.0"?>
          <mx:Application xmlns:mx=" http://www.adobe.com/2006/mxml" creationComplete="initApp()">
          <mx:Script>
          <![CDATA[
          private function initApp():void{
          trace(myimage.width)
          }
          ]]>
          </mx:Script>

          <mx:Image id="myimage" source="images/myimage.jpg"/>
          </mx:Application>
          • 2. Re: Get image size
            darko.romanov Level 1
            Hi frenchi30, sadly, it seems it doesn't work :-(

            My code:

            (caller class)
            var ip:ImagePreview = ImagePreview(
            PopUpManager.createPopUp(this, ImagePreview, true));
            ip.curIndex = curIndex;
            ip.imgname = curImage1;
            PopUpManager.centerPopUp(ip);
            ...

            (ImagePreview.mxml)
            private function doInit():void
            {
            this.title = imgname;
            Alert.show(image.width.toString());
            }

            <mx:Image id="image" source="{' http://localhost/myapp/catalog/temp'+curIndex+'/'+imgname}"/>


            it display the image but width it's alway 0.

            I looked around internet and read almost all official docs from adobe but I can't solve this (except using weird programming like reading image size from php and reading it by an HTTPService.... bleah!!)


            • 3. Re: Get image size
              dougmccune Level 1
              You need to have an event handler that handles the cmoplete event that is thrown by the actual Image component. The initialization event that runs your code gets fired when your component is initialized, not once the image has loaded. So on you <mx:Image> tag add something like:

              <mx:Image complete="doWhatever(event)" />
              • 4. Re: Get image size
                darko.romanov Level 1
                it doesn't wok yet :-(

                I suspect the problem is that the source is dynamically set... dunno. I did this:

                <!-- ImagePreview.mxml -->
                <mx:Image id="image" complete="resizeWindow()" source="{' http://localhost/myapp/catalog/temp'+curIndex+'/'+imgname}" />

                private function resizeWindow():void
                {
                Alert.show(image.width.toString()); //it displays 0
                }


                from main application:
                ...
                var ip:ImagePreview = ImagePreview(
                PopUpManager.createPopUp(this, ImagePreview, true));
                ip.curIndex = curIndex;
                ip.imgname = curImage1;
                PopUpManager.centerPopUp(ip);
                ...
                • 5. Re: Get image size
                  darko.romanov Level 1
                  I've finally got it! uff....

                  I did:
                  ...
                  private function doInit():void {
                  image.addEventListener(Event.RENDER, resizeWindow);
                  }

                  private function resizeWindow(event:Event):void
                  {
                  if(! resized)
                  {
                  this.width = image.width+50;
                  this.height = image.height+50;
                  box.width = image.width;
                  box.height = image.height;
                  resized = true;
                  PopUpManager.centerPopUp(this);
                  }
                  }

                  the resized variable is necessary because the event RENDER is always called.

                  I tried first with image.addEventListener(EventCOMPLETE, resizeWindow);

                  but it didn't work. btw, now is ok and that's enough.
                  • 6. Re: Get image size
                    darko.romanov Level 1
                    just last thing. I've modified the code in:

                    if(image.width > 0)
                    {
                    this.width = image.width+50;
                    this.height = image.height+50;
                    box.width = image.width;
                    box.height = image.height;
                    resized = true;
                    }
                    PopUpManager.centerPopUp(this);

                    in this way, if the image is not yet loaded, it will wait and try until image.width is greater than 0.