Tag Archives: actionscript 3

Smoothing <mx:image/> – the simple way

Posted on by
3

Solved this little problem the simple way. One of the centralized file sharing applications we’re developing needed some form of branding at the bottom of the screens. The logo bar, 1400 px wide, needs to be resized when the user changes the resolution of the browserwindow.

Without smoothing, things turn ugly and pixelated. With smoothing turned on, everything keeps looking the way it should, even when resized.

<mx:VBox>
    <mx:script>
	private function smoothImage ( img : Image ) : void
	{
		var bmp : Bitmap = img.content as Bitmap;
		bmp.smoothing = true;
	}
    </mx:script>
    <mx:image id="logoImage" complete="smoothImage(logoImage)" source="images/logo.png" width="100%" scaleContent="true"/>
</mx:VBox>

How to merge two images into one using Actionscript

Posted on by
9

Well, it’s very easy, using BitmapData and Bitmap. This example makes things a bit more complex to show some principles. Hope you learn something out of it off course.

// we'll scale the first ( background ) image by 50%
var s : Number = .5;

// create a matrix to make the scalilng of the bitmap possible
var scaleMatrix : Matrix = new Matrix();

// apply the scaling to the matrix
scaleMatrix.scale(s,s);

// create a bitmapdata object from an existing bitmap ( "bmp" in this case )
var scaledBitmap : BitmapData = new BitmapData(bmp.width*s,bmp.height*s,false,0);

// draw the content and scale it using the matrix
scaledBitmap.draw(bmp,scaleMatrix);

// we have an embedded asset called "flickr", a flickr logo in gif format
var icon : Bitmap = new flickr() as Bitmap;

// let's place it in the bottom right corner
var ix : Number = scaledBitmap.width-icon.width;
var ij : Number = scaledBitmap.height-icon.height;

// create a matrix for the position of the icon
// note the use of the ix and ij variables in the parameters
var positionMatrix : Matrix = new Matrix(1,0,0,1,ix,ij);

// draw the icon bmp to the bitmapdata
scaledBitmap.draw( icon, positionMatrix );

// add the new, merged, bitmap to your displaylist
var bmp : Bitmap = new Bitmap( scaledBitmap );
addChild( bmp );

// that's it!

PS: as per user comments I’ve also uploaded an example to use in the Flash IDE ( *.fla file ) – the above example assumes you’re using Flash Builder or another editor

I do have to say I don’t understand why people try to merge two bitmaps in Flash using the IDE. You could just as easily create a MovieClip with the two bitmaps on top of each other. Or am I missing something? Tell me in the comments!

Download the example *.fla file here: http://www.webdevotion.be/blog/wp-content/mergy.fla.zip