| 网站首页 | 文章中心 | 电子书下载 | 矢量图库 | 视频教程 | 素材下载 | 程序代码下载 | JS代码 | 论坛 | 
常用软件类:
|杀毒安全 |联络聊天 |网络软件 |多媒体类 |系统工具 |图形图像 |系统工具 |应用软件 |行业软件
开发设计类:
|动画制作 |图像处理 |3D设计 |操作系统 |站长学院 |网络相关 |WEB设计 |数据库类 |程序开发
Flash实现Bump Mapping的效果
作者:未知    文章来源:网络    点击数:    更新时间:2007-3-18
 
 

2.  接下来在稍微讲一下这么玄的效果大致是怎么运算出来的。
先来看一下一张普通的用亮度表示的Bump Map(凹凸图) 。



如果要求出这个点的颜色首先求出它的法向量,之后再于灯光以及材质进行运算后,这个点的最终颜色就求出来了。
x_gradient = pixel(x-1, y) - pixel(x+1, y)
y_gradient = pixel(x, y-1) - pixel(x, y+1)



使用这个公式可以很容易的求出每个点的斜度,然后使用这个斜度外加光线的位置就可以求出这个点的明暗,然后再将求出的明暗和材质进行运算后就可以的出最终的颜色啦!最后再将每个点显示出来,我们的效果就出现了!

3. 下面我们开始用Flash 8.0 ActionScript 2.0来实现这个效果的运算吧。
我的代码包里面有两个文件,一个是BumpMapper.as另一个是BumpingClip.as。BumpMapper.as 主要就是实现了一个BumpMapping的滤镜,基本上代码都在这里面。BumpingClip.as 则是一个MovieClip的子类,用来将Bump Mapping搬到台面上面来的。

这次我们将使用Flash 8.0里面新增的两个Filter(滤镜)。
flash.filters.ConvolutionFilter;flash.filters.DisplacementMapFilter。
第一个ConvolutionFilter使用一个3x3的矩阵对于图像每个象素周围的8个象素以及自己进行权加然后的到的值写入该像素。 他的公式如下:
dst (x, y) = ((src (x-1, y-1) * a0 + src(x, y-1) * a1.... src(x, y+1) * a7 + src (x+1,y+1) * a8) / divisor) + bias
我们熟悉的模糊效果就是这么的出来的~~ 当然我们今天不准备拿它作模糊效果。而是借助它能够进行使用临近像素运算的功能来运算出每个象素的斜度。
第二个DisplacementMapFilter则是使用一个MapBitmap来将源位图某位置上的像素影射到目标位图上,通常来实现扭曲效果,当然我们今天将用它来进行凹凸贴图(Bump Map)之后的灯光的映射。

下面我们来亲手制作一个凹凸贴图效果吧。
0. 首先下载源代码并将解压缩后的org目录放置在与你新建的文件同一个目录中,不然Flash可能找不到外部需要使用的Action Script的位置。
1. 将你喜欢的图片也就是Texture拖上来,然后将其转化成元件并命名为textureMap(在将位图放到元件中记住一定要将位图放在左上角,也就是0,0位置,不然会有意想不到的事情发生)。
2. 将舞台上的元件也命名为texture,并且再转化成元件命名为bumpped Map。
3. 在库里面找到bumpped Map右键然后单击链接在action 2.0类 里面输入 org.guRuSoft.Bumper.BumpingClip后确定。



4. 将你喜欢的灯光位图导入库中,然后新建一个元件并命名为light,然后将灯光位图放入这个元件的正中间。
5  将你希望用作为凹凸图的位图导入库中并将位图命名为bumpMap。
7. 进入Bumpped Map元件,并在第一帧里面写入:  
import flash.display.BitmapData;

this.textureMap=textureMap; //告诉这个BumppingClip我们使用舞台上的texture来作为这个Bump Map的纹理
this.bumpMap = BitmapData.loadBitmap("bumpMap");  //在库中读取bumpMap位图并且教给BumppingClip作为Height Map
this.lightMap = "light"; //告诉Bumpping Clip我们使用库中名字为light的MovieClip来作为灯光
this.startRender(); //告诉Bumpping Clip全都弄好了,可以开始渲染了。
这样一切就都好了,如果你希望在舞台上使用鼠标来控制灯光的话,可以在前面的script后面加上:
function onEnterFrame(){
  this.lightClip._x=textureMap._xmouse;//lightClip属性可以从Bumpping Clip中读出使用中的灯光元件(MovieClip)
  this.lightClip._y=textureMap._ymouse;
}

上一页  [1] [2] 


  • 上一篇文章:

  • 下一篇文章: 没有了
  • 相关文章
    Flash ActionScript脚本代码编写好习惯
    FLASH制作情人节贺卡
    Flash 制作MOV动画短片
    Flash 脚本控制语句说明
    利用Flash 8.0制作精致图标
    实现声音与歌词同步的三种方法
    植物篇
    效果篇
    环境背景篇
    动物篇