最近的项目很让人头疼, 整个前端框架是jquery桌面系统所来负责的, 但是当我们在处理图片的时候,
发现一个问题就是 怎么去处理图像呢 , 包括图像放大、缩小、 旋转 、 锐化、 直方图 、 标准化.........
经过讨论我们还是决定引入flex来处理这块(主要是借鉴Internate上面很多对图片的处理 都是基于flex的),
当是看到图丫丫网用flex做的对图像处理的还是不错的, 所以就考虑用flex做的, 由于之前一直致力于extjs、
jquery , 但是对flex只是局限于了解, 开发就不甚了解了 于是就翻了大量的
资料和书籍开始了解flex处理图像
这块内容, 主要是flex的滤镜这块, 引用几个例子
先附上几个别人例子,引自:http://www.cnblogs.com/xxcainiao/archive/2008/11/08/1329664.html
1:聚光灯效果:
实例:http://www.rphelan.com/flex/SpotlightDemo/SpotlightDemo.html
源文件:http://www.rphelan.com/flex/SpotlightDemo/srcview/index.html
2:放大镜效果:
实例:http://www.rphelan.com/flex/MagnifyDemo/MagnifyDemo.html
源文件:http://www.rphelan.com/flex/MagnifyDemo/srcview/index.html
3:缩放模糊效果:
实例:http://www.rphelan.com/flex/ZoomBlurDemo/Zo
omBlurDemo.html
源文件:http://www.rphelan.com/flex/ZoomBlurDemo/srcview/index.html
4:浮雕效果:
实例:http://www.rphelan.com/flex/SharpenDemo/SharpenDemo.html
源文件:http://www.rphelan.com/flex/SharpenDemo/srcview/index.html
5:水波效果:
实例:http://www.rphelan.com/flex/WaveReflectionDemo/WaveReflectionDemo.html
源文件:http://www.rphelan.com/flex/WaveReflectionDemo/srcview/index.html
然后又在finalbug的指引下 初步完成了flex图像直方图的算法
private function image2Balanced():void
{
var bitmapData:BitmapData = Bitmap(myImage.content).bitmapData;
var maxGray:uint;
var minGray:uint;
maxGray = minGray = getGray(bitmapData.getPixel(0, 0));
//
//return;
if(defW == 0 || defH == 0){
defH = myImage.content.height;
defW = myImage.content.width;
}
var grayList:Array = new Array();
for(var gi:uint = 0 ; gi < 256 ; gi++)
{
grayList[gi] = 0;
}
for(var i:uint = 1 ; i <= defW ; i++)
{
for(var j:uint = 1 ; j <= defH ; j++)
{
var gray:uint = getGray(bitmapData.getPixel(i, j));
if(gray > maxGray) maxGray = gray;
if(gray < minGray) minGray = gray;
grayList[gray]++;
}
}
//
var p:Array = new Array(); // 归一化之后的直方图
var allPix:uint = defW * defH;
var len:uint = grayList.length;
for(var pi:uint = 0 ; pi < len ; pi++)
{
p[pi] = grayList[pi] / allPix ;
}
//
var c:Array = new Array(); // 累计的归一化直方图
for(var ci:uint = 0 ; ci < len ; ci++)
{
c[ci] = 0;
for(var cj:uint = 0 ; cj <= ci ; cj++)
{
c[ci] += p[cj];
}
}
var newBD:BitmapData = new BitmapData(defW, defH, true, 0xFFFFFFFF);
for(var ti:uint = 1 ; ti <= defW ; ti++)
{
for(var tj:uint = 1 ; tj <= defH ; tj++)
{
var newGray:uint = c[getGray(bitmapData.getPixel(ti, tj))] * (maxGray - minGray) + minGray;
newBD.setPixel(ti, tj, getColor(newGray));
//return;
}
}
var bitmap:Bitmap = new Bitmap(newBD);
myImage.source = bitmap;
}
以上代码借助于finalbug的帮助, 然后记了下来, 接下来开始flex的图像强化和标准化......