Unity之透明度混合与ps的透明度混合计算结果不一致(gamma矫正和线性空间)

1 篇文章 0 订阅
文章探讨了Unity和Photoshop在处理颜色混合时结果不同的原因,主要归因于Unity使用线性空间而PS使用伽马空间。伽马空间源于CRT显示器的物理特性和人眼对光的感知非线性,而线性空间更接近物理亮度。解决方法包括在Unity中切换到伽马空间或在PS中使用线性混合。
摘要由CSDN通过智能技术生成

一、问题及原因

1.遇到的问题 

前段时间学习shader时发现了一个问题,一张纯红色透明度为128的图片叠加在一张纯绿色的图片上在unity中得出的结果与ps中的结果不一致。网上查找了ps中的透明混合的公式为 

color = A.rgb*A.alpha + B.rgb*(1-A.alpha)。自己计算了一下结果总是不对。 

红色透明度128的图                                          绿色透明度255的图

257ac8a8a134426c958f6845e1ea193e.png                               32fba43a539f424fa7176d7b563c6c15.png

 ps中红色在上绿色在下叠加后的结果色

3eeb0d29b70442d587e6ed9e1a734b84.png    4e730d020ba845e786a85014b1c55a83.png

 Unity叠加后的结果色

9222fa26356b4744b9b99d61a3ce9924.pngff4622cfda7044beb58e23f24c73bc6c.png

可以明显看出ps混合后的数值要比unity中的数值低。

2.产生的原因 

问题产生原因是unity使用的颜色空间(Color Space)为线性空间数值(Linear),而ps使用的是伽马矫正后的空间数值(gamma)。一般被gamma矫正后的图片会比线性空间的数值要低。所以ps混合后的数值要比unity中的数值低。

二、关于颜色空间描述

1.伽马空间(gamma)。

在查阅资料学习时关于gamma矫正产生的原因基本上围绕着两点

1. CRT 显示器的物理特性

2. 人眼对光强的感知能力并不是线性的

 1.1 伽马矫正之CRT显示器的问题

ba50407d0cd6495fb9cc6482af5db1ce.png

在早期我们的电脑显示器基本上是阴极射线管显示器(CRT),就是上面有个后脑勺的显示器。显示器一般是通过电压来控制每个像素的数值从而显示出图片的,但是CRT显示器有一个物理特性是输入的电压会输出为约等于输入电压2.2次幂的亮度。从理论上讲这个值应该是2.5倍,但在当时根据实际统计市面上的产品的特性总结出来的值约是2.2倍。这样就会导致显示器的图比实际图像要暗。图片借用文章

397910b5972d4dd8b951d8e8c193df75.png

我们想要让图片最终展示的亮度与原图一致就需要对gamma2.2进行一个矫正,这个矫正值就是gamma1/2.2(2.2次幂的对数0.45) ,看下方的矫正示意图。

 e9873d0420ea4418a60887469571d86b.png

a6e4ab8a50f840149876c89c70b9ce70.png

我们为什么要进行gamma1/2.2(0.45)的矫正呢?除了上方需要与gamma2.2进行抵消后显示原图外还有一点就是我们渲染计算的数值要在伽马值为 1 的理想线性空间进行的。

这里举个例子:

矫正图来看假如我们输入一个暗红色的光照RGB颜色为(0.5, 0.0, 0.0)的图, 然后将这个颜色提升一倍变为(1.0, 0.0, 0.0). 但由于显示器的非线性特性, 我们最终调节的颜色实际是从 (0.218, 0.0, 0.0) 变成了 (1.0, 0.0, 0.0)

所以gamma矫正是为了解决CRT的物理特性。但基于人眼的感知特性这个gamma矫正又是怎么实现的呢?我们继续往下看。

1.2 伽马矫正之人眼的感知特性并不是线性的

这是一个黑白渐变图。在rgba数值中是(0,0,0,1)~(1,1,1,1)

1b623707c828454d9fed8aa40fd77e48.png根据上面这个图左侧黑色数值为0,右侧白色数值为1,那么半灰色是不是0~1区间的中间数0.5呢?在数学中0~1的中间值的确应该是0.5。但是人眼在自然界中看到的半灰色实际在上面这张图的3/4的位置即:0.75。来我们看下面这张图:

d11398369aa6455cbdfe457cb82f41fe.png

我们根据 “物理亮度图” 第0.5的半灰色对比去找 “人类自然界感知亮度图”中对应的颜色应该是在0.75左右。所以“ 人眼对光强的感知能力并不是线性的 ” 的意思就是如此。

e9873d0420ea4418a60887469571d86b.png

人类的视觉系统在黑暗环境下的辨识能力要强于明亮环境这是进化过程中出现的特性, 这样有助于我们及时发现黑暗中隐藏的危险。而且人眼的这一特性与CRT显示器的gamma2.2相似。

1.3 CRT显示器与人眼特性的关系

网上查的好多资料视频有的说gamma矫正是因为人眼感知特性,有的又说是为了解决CRT显示问题。但其实一开始gamma矫正是为了解决CRT的物理特性巧合的是人眼的感知特性也是如此,而且后面Led等液晶显示器现世后已经可以达到与现实色彩呈线性的数值因为人眼特性和兼容CRT显示器处理的图片才保留了gamma矫正。我感觉这才是正确的。如果有什么不对的也欢迎大家指正。

其他:

  1. gamma本身是人眼对于不同灰阶画面切换时候,一个让眼睛觉得更自然的亮度补充.
  2. 保存在计算机中的图片数据是经过gamma1/2.2(0.45)后的数据。

2. 线性空间(Linear)

这个空间对应的就是物理空间亮度图。半灰色在0~1区间中属于正常的0.5。根据上方伽马空间描述了解到人眼感受的亮度值比实际物理空间的亮度值暗,所以unity中线性空间下的图片亮度会比gamma矫正后的图片要亮。

2.1Texture纹理图片sRGB(Color Texture)属性

Texture纹理图片sRGB(Color Texture)属性只有在线性空间下才管用。勾选是开启gamma矫正,未勾选是不开启gamma矫正。

66f82a53e2f44a5e925c56664f5029ec.png

在线性空间下勾选了sRGB效果图:

bf57485119bf410f8ac761a3bb26dc06.png

运算公式 color = (A.rgb^2.2 * A.alpha + B.rgb^2.2 * (1-A.alpha)) ^ (1/2.2)   

未勾选sRGB效果图:

c31f41b7d85240eda6cdf8cd5e7ca7b3.png

运算公式 color = (A.rgb * A.alpha + B.rgb*(1-A.alpha)) ^(1/2.2)   

三、解决方法 

1.将unity改为伽马空间(gamma)

修改 File—>Build Settings—>Player Settings—>Other Setting选项卡中的Color Space为gamma即可。

331bc44cde3f4c0e9d987ea76535fedf.png

2.PS修改为Linear 

 “编辑”—>“颜色设置”—>勾选“用灰度系数混合RGB颜色”。

b924272b9e744a67a4530d8a21518321.png

 修改后ps的最后混合颜色结果 与unity中的一致。

bda7ba0fa83b43b396c2edb4f2988024.png200791010c634cb0b4be679e86057361.png

  • 1
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 3
    评论
评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值