Magnifying Glass
| Category | : Flash | Views | : 37068 | ||
| Version | : 8 | Rating | : | ||
| Type | : Text | Source File | : magnifying-glass.zip | ||
| Result | : See the result | ||||
Magnifying glass is not just in the real world. In Flash, we can also create a magnifying glass. You can zoom a picture or even text. Maybe you can even use this for disability people that are using your computer.
Create a new Movie Clip and draw your magnifying glass; fill the glass part with any color you want.
Select the red and press F8, this will create a new Movie Clip that we will use as a mask.
After converting, delete it from the magnifying glass Movie Clip.
Drag both Movie Clip to the stage, one with the instance "imgMask" and the other "magGlass".
Now create a new Movie Clip just to hold our image, drag it to the stage and give the instance name "imgHolder".
Paste this on the first frame:
//load an image named "image.jpg" to the imgHolder Movie Clip
loadMovie('image.jpg', imgHolder);
//new Movie Clip just to hold the zoomed image
this.createEmptyMovieClip("zoomImg", 33);
//Set a mask inside the Movie Clip so the zoomed image is rounded
zoomImg.setMask(imgMask);
// bitmap object to zoom the image
var zoomBitmap = new flash.display.BitmapData(155, 155, false, 0xEAEAEA);
//attach the bitmap to the" zoomImg" Movie Clip
zoomImg.attachBitmap(zoomBitmap, 5);
//zoom power, increase this to zoom more
var magPower = 2;
//matrix object to position the zoomed bitmap inside the magnifier
var zoomMtx = new flash.geom.Matrix();
//scale the image using the "magPower"
zoomMtx.scale(magPower, magPower);
//swap depths for the magnifier Movie Clip so it is on top
magGlass.swapDepths(_root.getNextHighestDepth());
_root.onEnterFrame = function()
{
//hide the mouse
Mouse.hide();
//set the magnifier Movie Clip to the position of the mouse
magGlass._x = _xmouse - 70;
//so the mouse is in the middle of the lens
magGlass._y = _ymouse - 70;
//zoomed image Movie Clip
zoomImg._x = magGlass._x;
zoomImg._y = magGlass._y;
//Mask Movie Clip
imgMask._x = magGlass._x;
imgMask._y = magGlass._y;
//where to draw the zoomed image
zoomMtx.tx = -_xmouse * magPower;
zoomMtx.ty = -_ymouse * magPower;
//draw zoomed image using the image in the
//holder and the position of the matrix.
zoomBitmap.draw(imgHolder, zoomMtx);
}
It works for any image, choose a different picture and name it "image1.jpg" to test.More cool tech articles from other blogs.
