In the old days of Flash 7, anytime you scaled or rotated an image it was automatically smoothed. This was regardless of whether the image was embedded or loaded dynamically. Smoothing gives a nice sub-pixel, anti-aliased look to the resultant image. No smoothing gives a jaggedy, crappy-looking resultant image (see example below).
[kml_flashembed movie=”http://www.airtightinteractive.com/flash/smoothing/smoothing.swf” width=”400″ height=”560″ fversion=”9″/]
Now in Flash 9 when you dynamically load an image using the Loader class, smoothing is turned off by default. The recommended way to smooth the image is to copy the content of the loader into a Bitmap object and enable smoothing on it. The problem is that for images that are loaded cross-domain, we don’t have access to the BitmapData, so there is no way to smooth the image.
There are 2 work-arounds that unfortunately don’t work in many use cases:
- Use a server-side proxy. This is prohibitive for large scale apps in terms of bandwidth costs.
- Use crossdomain.xml files. Only works if you have access to the server where the image is coming from.
In my opinion, it should be possible to get smoothing on a cross-domain image. There’s 2 ways this could happen:
- Allow access to cross-domain BitmapData (although apparently this is not going to happen).
- Add a ‘smoothing’ property to the Loader class. Hopefully Adobe will consider this for a future rev of the player.
[UPDATE]
If you agree that Adobe should add a ‘smoothing’ property to the Loader class for Flash Player 10, please add a feature request here.
Latest Tweets
Related: http://www.yswfblog.com/blog/2007/08/29/flickr-now-even-more-flash-friendly/
Smoothing == Love 🙂 Thx for the tips.
I agree, this is a very annoying problem with Flash Player 8 and above. Since FP8, Adobe changed the rendering engine so images/bitmaps could be displayed more efficiently. You can see it when you enlarge a bitmap image in FP7 then compare the same in FP8.
I was hoping AS3 would change this, but no. Like you said, we have to resort to hacks like using proxies just so we can smooth the image. I don’t know why smoothing isn’t turned on by default, but there you go.
The only thing we can do is to write to Adobe and ask for a ‘smoothing’ property to be added to the Loader class for Flash Player 10. I’ve sent my request already, I hope they’re listening! See http://www.adobe.com/cfusion/mmform/index.cfm?name=wishform&product=15
Hi Paul,
thanks for submitting a feature request to Adobe. I have too. Anyone reading this who wants it fixed should do the same – if we get enough requests Adobe may listen.
@c.moore: Yes that’s exactly the same issue. Flickr used crossdomain.xml files to allow other domains to load their images with smoothing. Unfortunately most websites don’t have a crossdomain.xml.
This particular issue caused a lot of pain for me whilst developing a flickr slideshow player in flash.
After much unsuccessful work using crossdomain files I reluctantly followed the poor server side proxy root. This was an unsatisfactory outcome, to something which should be native to flash and cost me days of painful development time.
What particularly bugs me about this is that it breaks one of the key benefits of using flash in the first place.
In a world of apis and agreggated content Adobe need to fix this.
It is so wonderful flash.
I was hoping AS3 would change this, but no. Like you said, we have to resort to hacks like using proxies just so we can smooth the image. I don’t know why smoothing isn’t turned on by default, but there you go.
How can I get this fla file?
Thanks for share….
I had to deal with this back when flash8 was released. check my solution:
http://www.frontend-multimedia.com/smoothImageLoader/
this doesn’t work on as3 and it really should be converted into a class. maybe i’ll do that next time i need it.
@Helder
thanks for the code sample. Unfortunately this method doesn’t work with cross-domain images and AS3 due to security restrictions.
how about using the undocumented
my_mc.forceSmoothing = true ? it works locally, does it not work with crossdomain images?
@erno: forceSmoothing is not supported in AS3
I am implementing a slide presentation editor/viewer and want to be able to clone images referenced from the slide theme for bullets as well as to be able to scale them smoothly as needed for the screen size. The smoothing property is clearly very important, but it would also be desirable to create copies of the images without reloading them from the network and without any relaxation of the security restrictions. A cross domain policy file is unlikely to be acceptable. One simple idea would be a means to clone the display object corresponding to the loader.content, or even to clone the loader itself. I’ve submitted feature requests to Adobe.
zaman?n?z? iyi kullan?n ve yoldaki engellere çarpmay?n?z.
There is actually an easy solution for AS3:
//===========================================
// Imports
import flash.display.Bitmap
import flash.display.Loader;
import flash.net.URLRequest;
// Code
var myLoader:Loader = new Loader()
myLoader.load(new URLRequest(“myImage.jpg”))
var myBitmap:Bitmap = myLoader.content as Bitmap
myBitmap.smoothing = true
//===========================================
Let me know if that works.
Charles
Ok, I finally figured it out. When you follow this image loading with smoothing workaround by kourantin: http://www.kaourantin.net/2005/12/dynamically-loading-bitmaps-with.html
Smoothing across domains still doesn’t work. Saying “use a crossdomain file” is not enough info: it doesn’t work even with a fully permissive crossdomain file. The images look blank and white. The problem is there is a bug in flash where the crossdomain file is never loaded by the swf when loadBitmap is the first call to the server. However, manually forcing a loading of the file before the loadBitmap is called fixes the problem for me!
System.security.loadPolicyFile(“http://YOURDOMAIN/crossdomain.xml);
It is very nice example. I am new designer for Flash.
How can I get this file’s fla.
Thanks for your helping.
Bye
Thanks Michael!
“System.security.loadPolicyFile” is the answer to my nightmare 😀
Hello,
I don’t use the specific loadPolicyFile approach because I want flash to automatically check for the crossdomain.xml as I may use many different domains.
The follow approach works fine for me;
var context:LoaderContext = new LoaderContext(true, ApplicationDomain.currentDomain);
var loader:Loader = new Loader();
loader.contentLoaderInfo.addEventListener(Event.COMPLETE, loaderCompleteHandler);
loader.load(new URLRequest(“YOUR_PATH_HERE”), context);
function loaderCompleteHandler(e:Event):void
{
var image:Bitmap = (e.target.content as Bitmap);
image.smoothing = true;
addChild(image);
}
Neil solution working fine!! Thanks a lot!
Thanks very great post
Peeps@airtightinteractive: perhaps you should change your “log this as a bug” to this link:
http://bugs.adobe.com/jira/browse/FP-141;jsessionid=90E6C3B6B07A10E221A05EDFA6396FEC?page=com.atlassian.jira.plugin.system.issuetabpanels:all-tabpanel
Very useful information. I think it is useful for many people. Thank you for your blogs.
Your article very diverting! Keep up the beautiful idea!
Hi,
thanks for sharing! Been looking for an answer for a long time 🙂
Tim
Security.loadPolicyFile DOES work, however, with applications I am building for my company, we never know where the images are coming from ( they are client provided images to work within out gallery), therefore, I am forced to turn off smoothing..