您当前的位置: 首页 > 

VT LI

暂无认证

  • 5浏览

    0关注

    126博文

    0收益

  • 0浏览

    0点赞

    0打赏

    0留言

私信
关注
热门博文

二维图片做出三维效果

VT LI 发布时间:2021-04-22 21:11:28 ,浏览量:5

上面这个效果是2D图片实现的3D效果。这个效果是利用2D图片模拟3D的效果,他利用了一张高度图来实现,这种现象叫做视差效果。

如果你以前玩过超级马里奥,会发现他根据你移动的不同速度,不同层级的背景的移动速度会不一样,越往后的背景图他的移动速度越慢。

这个效果告诉我们的大脑在对视差效果有很严重的依赖,视差效果能让我们感知物体的远近。

用线性插值来完成这种效果是比较不理想的,而本方案的做法是用根据高度图的信息等比例的对像素采样进行偏移。能实现的效果是在摄像机角度,根据深度的远近然后简单的偏移像素来模拟小范围的3D旋转效果。

下面我们用一只猫做例子,我们需要两张图,一张是猫的原图,一张是猫每个像素距离相机的距离的值的黑白图。

然后我们需要根据距离摄像机越近则偏移越大的原则来实现。红色的位置向左偏移两个像素,蓝色位置向右偏移两个像素。他的假设是如果我们像素移动到右边,那么附近的像素也会向这个方向做等比例的偏移。

然后我们用unity的表面着色器来做例子。

核心代码是:

fixed height = tex2D(_HeightTex, IN.uv_MainTex).r;
fixed2 displacement = _Scale * ((height - 0.5) * 2);
fixed4 c = tex2D (_MainTex, IN.uv_MainTex - displacement) * _Color;
o.Albedo = c.rgb;

首先displacement通过(height-0.5)*2变换深度维0到1之间,然后乘系数。采样maintex在uiv与displacement的偏移之间。结果就能得到一开始的效果。

 

关注
打赏
1649603425
查看更多评论
立即登录/注册

微信扫码登录

0.1223s