Magnify Pixel Bender Filter

The "Magnify" effect is an age old Flash trick that we used to accomplish using two images and some clever masking.  This pixel shader can achieve the same effect with less code, only 1 image, and has a few new tricks up its sleeve.  It magnifies a circular section of an image and optionally creates a smooth transition between the magnified and unmagnified areas.  The four parameters are center, outerRadius, innerRadius, and magnification.

• center ([0-2048, 0-2048]) - the center coordinates of the magnified area
• outerRadius (0-500) - the radius of the magnified part of the image
• innerRadius (0-500) - the radius of the fully magnified part of the image
• magnification (1-50) - the amount to magnify the image by (e.g. set to 2 for a 2x magnification)

Note that the ranges specified above are just the recommendations from the .pbk file, you can set these values to whatever you want in your application.

Take some time and play around with the settings, it is possible to acheive a several different effects.  If innerRadius is 0, it creates a "bubble".  If it is higher than outerRadius, then you get a hard edged circle.  In this demo, I disabled values between 0 and 1 for magnification because they can create some strange side effects, but if you are careful you can use fractional magnifications to create a "pinch" type effect.

Application - Source

[kml_flashembed movie="http://www.rphelan.com/flex/MagnifyDemo/MagnifyDemo.swf" height="475" width="450" /]

Share: