U3D线性空间及UI相关

首先说一下碰到的问题:应美术的要求,项目的Color Space转换为Linear Space(默认为Gamma Space)。转换后,UI出现了半透及颜色偏差的问题。

Gamma space:从纹理中采样得到的数值(G(x)1/gamma)直接参与shader计算,然后传入color buffer混合,最后传入Frame Buffer等待渲染。

Linear space:勾选sRGB,unity认为是非线性贴图,从纹理中采样得到的数值先做一次decode gamma校正(G(x)gamma),不勾选的话,unity认为是线性贴图,就不进行Gamma校正。然后参与shader计算,计算完成后再做一次G(x)1/gamma的校正;然后这些值被放入sRGB buffer(代替原本的color buffer),做混合处理。混合处理仍然需要在线性空间下完成,所以这些数值再做一次G(x)gamma,变为线性空间下的值,然后参与混合计算,计算完成后,做G(x)1/gamma,保证输出前仍在Gamma空间下。

问题一:UI半透。

左侧(问题图片)较右侧(效果图)出现半透问题:

但是新建工程后(新工程也设为Linear Space)发现没有出现该问题。对比后怀疑问题应该出在贴图RGB与Alpha分离上。

查阅Color Space相关资料后了解到:我们得到的贴图都是经过伽马校正(encode gamma)的(G(x)1/Gamma)。在Linear Space下,贴图的sRGB属性会被勾选:

它保证了贴图在参与shader计算中,采样得到的值都转换到线性空间下再进行计算(G(x)Gamma)。但是Alpha是不进行伽马校正的,项目中部分图集的Alpha图的sRGB被勾选了,即Alpha图在参与shader计算时也进行了G(x)Gamma(Gamma为2.2)。这就导致Alpha图的像素值较原图偏小(rgba在计算时是0-1的float值),也就出现了半透的问题。

解决方法:Alpha图的sRGB不要勾选。

问题二:UI颜色偏差问题。

UI元素与效果图颜色有偏差:

对比发现:把问题元素放到空白位置,或者把问题元素重新导出不带alpha的贴图,颜色与效果图并没有差别,所以问题应该出在alpha混合阶段。

导入U3D的贴图是经过encode gamma校正的gamma空间下的值(即G(x)1/gamma)。贴图的sRGB选项如果勾选,表明这张图是非线性的,需要做一次decode gamma校正(即G(x)gamma),把值转到线性空间下;否则表明这张图是线性的,不再需要做decode gamma校正。

解决办法有三种:

  1. 调整alpha通道
  2. 通过shader调整
  3. 后处理

前两种方法只能通过调整不断接近效果图,并不能完美解决。

所以采用第三种方法:后处理。

使用后处理方法解决,所有图集(alpha图和RGB图)的sRGB选项不能勾选,这样系统会认为图集是线性的,就不再进行decode gamma校正,经过shader计算,做一次encode gamme,之后所有值进入sRGB buffer,等待混合。混合之前,会把所有值再做一次decode gamma,以转到线性空间下,然后进行混合计算,计算完的结果在做一次encode gamma转到gamma空间。我们的后处理就发生在混合之后,相机渲染之前。把之前计算的结果进行一次decode gamma校正,这样最终的结果就和ps里出来的图一样,是个G(x)1/gamma的gamma空间下的值,以便显示器显示(所有显示器会自动做一次display gamma校正,即G(x)gamma,所以我们要保证最终的结果是gamma空间下的值,即G(x)1/gamma)。

后处理是通过挂在相机上的脚本在OnRenderImage()方法中调用Graphics.Blit(source,target,material)方法,修改混合完成后的RenderTexture,然后再传给相机渲染。

因为UI相机要渲染在最前面,但是UI相机的渲染是经过decode gamma处理的,所以整个显得整个场景颜色发暗色。解决办法是在场景相机上再加一次encode gamma的后处理,把UI相机后处理所产生的decode gamma抵消。

注:以上过程仅个人理解,细节部分不保证完全正确,欢迎指正讨论。

Gamma存在的意义:

这是一张从黑到白的渐变图,按理说中灰是0.5,应该在正中间的位置,但是这张图中却在大概0.2的位置。这是因为图是线性的,但是人眼的感知却是非线性的(人眼对暗部信息更加敏感)。这张图中,暗部的色阶只占大概51个(0.2 * 256)。这样暗部的细节表现的不够明显。如果在存储时,进行Encode Gamma校正。把0.2变为0.5。那么暗部的所占的色阶提升到了128个,这样暗部的细节处理会比之前好很多。

Gamma的存在是为了:

  1. 调节客观存在与人眼感知的矛盾。

     2.硬件

  • 2
    点赞
  • 11
    收藏
    觉得还不错? 一键收藏
  • 7
    评论
评论 7
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值