ActionScript 3.0: bitmap.smoothing
ok, the task here is to move a fairly sized picture 500 px to the left and 50 px up in 20 seconds.
the movement has to be as smooth as possible.
so here are some scenarios.
1st scenario:
in the first scenario I’ve added my picture to the stage, converted it into a MovieClip and instancenamed it “thePicture”.
finally I’ve added this code:
Tweener.addTween(thePicture, {x:-500, y:-50, time:20, transition:"linear"});
check out what the movement looks like in this first scenario
the movement is not smooth and the result is far from acceptable.
2nd scenario:
same as the first, but before exporting my Flash movie, I rightclick my picture in my Library, choose Properties and mark the allow smoothing checkbox.
check out what the movement looks like in this second scenario
wow, much smoother and much better.
this is definately the way to do it if you want the smoother animation
3rd scenario:
often I need to load pictures into Flash before using them, so lets try loading an external picture and moving it like we’ve moved the pictures in the previous scenarios.
the following actionscript does this; loads the picture, when the picture is completely loaded, it’s added to stage and we start moving it:
var _loader:Loader;
var _picture:String = "moustache.jpg";
loadPicture(_picture);
function loadPicture(s:String):void {
var picture:String = s;
_loader = new Loader();
_loader.contentLoaderInfo.addEventListener(Event.COMPLETE, doneLoading);
_loader.load(new URLRequest(picture));
}
function doneLoading(e:Event):void {
addChild(_loader);
Tweener.addTween(_loader, {x:-500, y:-80, time:20, transition:"linear"});
}
check out what the movement looks like in this third scenario
hmmm, not nice.
we’re back at the jumpy animation.
4th scenario:
so, lets try loading that picture like before, but instead of adding the Loader and moving that, we’ll convert the loaded picture into a Bitmap and allow smoothing for this Bitmap.
here’s the code for it:
var _loader:Loader;
var _picture:String = "moustache.jpg";
loadPicture(_picture);
function loadPicture(s:String):void {
var picture:String = s;
_loader = new Loader();
_loader.contentLoaderInfo.addEventListener(Event.COMPLETE, doneLoading);
_loader.load(new URLRequest(picture));
}
function doneLoading(e:Event):void {
var bitmap:Bitmap = Bitmap(e.target.content);
bitmap.smoothing = true;
addChild(bitmap);
Tweener.addTween(bitmap, {x:-500, y:-80, time:20, transition:"linear"});
}
check out what the movement looks like in this fourth scenario
this one is quite tricky, I think.
actually, I’m not even sure, if I see any difference from this and the third scenario example.
but the bad thing is, that it’s not as smooth movement, as in the second scenario.
any examples of how to make a slow animation like this smoother?