CGArt-中国CGer中的绿色家园
首页 信息动态 原创排行 互动教程 资源千寻 CG人才 CGArt杂志 艺术设计 CG画廊 CG论坛 酷站欣赏 CG搜索 会员中心
Flash制作一个极有真实感的放大镜
来源:闪吧 作者:guruqu 编辑:浪漫的季节 发布时间:2007年04月04日 17:38:01

先讲一下实现的思路和原理吧:放大镜大家都用过对吧?其实在flash里面实现发大镜无非就是用一块很大的区域显示比这个区域小的部分,所以也就是将放大镜中的像素按照位置映射到原图像上的某小部分。当然如果这一小部分比放大镜本身都大得话,那就变成缩小镜了。

首先,我们还是先看一下代码中的像素映射那部分。

var _dfilter:DisplacementMapFilter = new DisplacementMapFilter(一个Bitmap映射参数,new Point(0,0),1,2,0,0);

没错,在flash中我们可以使用DisplacementMapFilter滤镜来做像素映射,之前做的另一个效果Bump Mapping也用的是这个滤镜,大家知道这个滤镜的强大了吧。看到这个函数大家一定觉得很奇怪,怎么像素映射是使用一个图来作为映射的参数呢?这是因为通常在做图形时,他们更喜欢使用图象来做为参数传输,这样就可以把一个数组的参数当作一张贴图传输到显卡中。这个就是我们传入的映射图的样子。

Flash制作一个极有真实感的放大镜

使用图片作为参数另一个好处,就是可以直观的看到这些参数分布的形态。至于这个映射图是怎么解析的呢?其实我们知道,通常一个真彩的像素有32bit,分别是ARGB,其中任意一个通道就占有8位宽,也就可以表示0-255中任何一个数字啦。在DisplacementMapFilter这个类中,他会读入这么一张图,然后将要显示的像素经过预先指定的2个通道分别读出x和y轴的位移,然后再到目标图上去寻找,bingo,就可以把颜色找到啦。具体的形式如下:

dstPixel[x, y] = srcPixel[x + ((componentX(x, y) - 128) * scaleX) / 256, y + ((componentY(x, y) - 128) * scaleY) / 256]

在这里,我就给这个displaceMapFilter传入了这么一张图。这张图在中间部分让图像平均放大,并且在靠近边缘是进行很夸张的放大,最终的效果大家可以在2进制里面下载。使用了一个DisplacementMapFilter之后,我们就可以得到一张非常朴素的放大镜效果了,然而有时候我们希望来点有意思的事情,比如把放大镜的折射率设置的夸张点,这样我们就可以透过放大镜看到一些再物体边缘有真实的折射效果,相信在日常生活中你也一定遇到过这些情况。实际上折射效果实现非常简单,其实就是把原图像的R,G,B通道分开,然后分别对他们使用我们前面说的放大镜效果,并且将这些放大镜的放大率作少许的调整,比如1.5,1.6,1.7。最后我们在将的到的三个通道使用Add渲染模式叠加起来。下面是使用和不使用棱镜效果的比较图。

Flash制作一个极有真实感的放大镜

有棱镜效果

Flash制作一个极有真实感的放大镜

大家也许会问这个映射的参数图是哪里来的,其实,那个图是我做的另外一个flash生成的....然后我在截个图,编辑编辑,在导到flash中的,很土吧,至于具体实现,大家可以去看我的代码。

Flash制作一个极有真实感的放大镜

新闻标题 发布 时间
Flash特效制作常用的源代码放送 2007年04月04日 13:09:08
Flash制作彩色线条动态图案生长动画 2007年04月02日 13:36:28
Flash制作环形立体旋转的动态文字 2007年03月28日 15:01:28
Flash制作用键盘方向键控制的动画实例 2007年03月27日 16:03:14
Flash制作星星写字特效动画实例 2007年03月27日 15:57:12
Flash制作三维方格弹跳动画 2007年03月07日 18:10:49
Flash制作片头动画:碧海蓝天海鸥飞 2007年01月17日 10:35:19
Flash制作淡雅动态菜单:蜻蜓飞飞 2006年11月30日 15:51:13
共有评论0条
更多评论..
作者信息 详细信息
评论人:
验证码:
内容:
 
about us advertisement publish conformity service cooperate associate link site map contact us help jump to the top of page