OK, this works great when I run the application locally, but when I 
upload to the server and run it from there the images aren't being 
resized (no error message - nothing happens). I tracked the problem 
down to:

var img_width:int = img.content.loaderInfo.width;
var img_height:int = img.content.loaderInfo.height;

These statements work fine when running the Flex app locally, but 
they cause the function to stop execution when executing the Flex app 
from the web server. If I place an Alert before these statements it 
displays fine, but if I place an Alert after these statements it 
never shows up.

Any ideas why the content.loaderInfo would work fine locally but end 
up null or undefined when running from the web server? Why the 
difference? What can I do to ensure this works on the server?

Thanks!


--- In flexcoders@yahoogroups.com, "byte.sensei" <byte.sen...@...> 
wrote:
>
> Thanks for the insight. I did something very similar, although I'm 
> using HBox/VBox components to layout my app so I had to put a VBox 
> wrapper around the image like this:
> 
>               <mx:VBox id="image_01_wrapper" width="100" 
> height="100%" verticalAlign="middle" horizontalAlign="center">
>                       <mx:Image id="image_01" 
> source="{'http://media.basspro.com/'+current_product.image_url_01}" 
> complete="{image_resize(image_01,100,75)}" alpha="0"/>
>               </mx:VBox>
> 
> Then my image_resize() function takes an Image object and desired 
> width/height as parameters:
> 
>               private function image_resize
> (img:Image,w:int,h:int):void {
>                       var img_width:int = 
> img.content.loaderInfo.width;
>                       var img_height:int = 
> img.content.loaderInfo.height;
>                       
>                       if (img_width/img_height >= w/h) {
>                               //image is wider than box 
> proportions - resize based on width
>                               img.width = w;
>                               img.height = w/img_width*img_height;
>                       } else {
>                               //image is taller than box 
> proportions - resize based on height
>                               img.height = h;
>                               img.width = h/img_height*img_width;
>                       }
>                       //Alert.show(img.width.toString() + "x" + 
> img.height.toString());
>                       
>                               var fade_in:Fade = new Fade();
>                               fade_in.target = img;
>                               fade_in.alphaFrom = 0;
>                               fade_in.alphaTo = 1;
>                               fade_in.play();
>                       
>               }
> 
> 
> I also added the fade in tween so that the images gradually fade in 
> when they have been resized.  Anyway, your code below got me going. 
> Thanks!
> 
> -Dan
> 
> 
> --- In flexcoders@yahoogroups.com, Fotis Chatzinikos 
> <fotis.chatzinikos@> wrote:
> >
> > For something similar i do the following, you should be able to 
> change it to
> > do what you want quite easily..:
> > 
> >             <mx:Image
> >                 id="selectedProductImageID"
> >                 verticalCenter="0"
> >                 complete="imageLoaded()"
> >                 source="{selectedPhoto}"
> >                 left="5"
> >                 />
> > 
> > Now the important bit is the "complete="imageLoaded()":
> > 
> > and the imageLoaded function:
> > 
> >             private function imageLoaded():void
> >             {
> >                 if 
(selectedProductImageID.content.loaderInfo.width 
> >=
> > selectedProductImageID.content.loaderInfo.height)
> >                 {
> >                     selectedProductImageID.width = 330;
> >                     selectedProductImageID.height =
> > 
> 
330*selectedProductImageID.content.loaderInfo.height/selectedProductIm
> ageID.content.loaderInfo.width
> > ;
> >                 }
> >                 else
> >                 {
> >                     selectedProductImageID.height = 330 ;
> >                     selectedProductImageID.width =
> > 
> 
330*selectedProductImageID.content.loaderInfo.width/selectedProductIma
> geID.content.loaderInfo.height;
> >                 }
> >             }
> > 
> > On Mon, Feb 23, 2009 at 9:36 PM, byte.sensei <byte.sensei@> 
> wrote:
> > 
> > >   I have an app that loads several images into mx:Image tags 
with
> > > scaleContent=true and width=160 / height=120. The problem is 
not 
> all of
> > > my images have these proportions, and for odd sized images they 
> end up
> > > being loaded into the upper left hand corner instead of 
centered 
> in the
> > > restricting image box.
> > >
> > > All I'm trying to do is have a box 160x120 pixels, then load in 
> images
> > > of various sizes dynamically and have them 1) scale to fit 
within 
> this
> > > box, and 2) render centered vertically/horizontally in this 
box. 
> Is
> > > there any way I can do this not knowing the actual image sizes 
> (and
> > > using images of different proportions)?
> > >
> > > Thanks!
> > >
> > >  
> > >
> > 
> > 
> > 
> > -- 
> > Fotis Chatzinikos, Ph.D.
> > Founder,
> > Phinnovation
> > Fotis.Chatzinikos@,
> >
>


Reply via email to