Resizing image using as3
I am building a portfolio site which dynamically loads large hi-res images when the user clicks on a thumnail. However I'm having problems maintaining the original image's quality when resizing it to fit the current browser.
Currently I'm just adjusting the width & height properties of the image to width to the stage proportionally which is working fine getting it to fit, however I cannot figure out how to maintain image quality? Do I need to load it as a bitmap and redraw/smooth or something similar?
This is the appropriate code that I am currently using:
var req:URLRequest = new URLRequest("images/101.jpg");
var loader:Loader = new Loader();
var widthRatio:Number;
var heightRatio:Number;
function imageLoaded(e:Event):void
{
 //add image to stage
 addChild(loader);
 // resize proportionally
 if (loader.width > stage.stageWidth){
  widthRatio=loader.width/stage.stageWidth;
  trace(widthRatio)
  trace(loader.width);
 }
 if (loader.height > stage.stageHeight){
  heightRatio=loader.height/stage.stageHeight;
  trace(heightRatio)
  trace(loader.height)
 }
 if (widthRatio > heightRatio){
  loader.width = stage.stageWidth;
  loader.height = loader.height/widthRatio;
 } else {
  loader.height = stage.stageHeight;
  loader.width = loader.width/heightRatio;
 }
 //centre on stage
 loader.x=stage.stageWidth/2 - loader.width/2;
 loader.y=stage.stageHeight/2 - loader.height/2;
}
loader.contentLoaderInfo.addEventListe开发者_如何学Pythonner(Event.COMPLETE, imageLoaded);
loader.load(req);
Have a look at Bitmap smoothing.
Your Loader will have a content property which will be a Bitmap. Set it's smoothing to true.
function imageLoaded(e:Event):void
{
    //add image to stage
    addChild(loader);
    Bitmap(loader.content).smoothing = true;
    // ...
It makes the image a bit blurry but it is a significant improvement in most cases.
 
         加载中,请稍侯......
 加载中,请稍侯......
      
精彩评论