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

这篇具有很好参考价值的文章主要介绍了Unity之透明度混合与ps的透明度混合计算结果不一致(gamma矫正和线性空间)。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

一、问题及原因

1.遇到的问题 

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

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

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

unity透明度对应ps,Unity,ASE,数学建模                               unity透明度对应ps,Unity,ASE,数学建模

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

unity透明度对应ps,Unity,ASE,数学建模    unity透明度对应ps,Unity,ASE,数学建模

 Unity叠加后的结果色

unity透明度对应ps,Unity,ASE,数学建模unity透明度对应ps,Unity,ASE,数学建模

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

2.产生的原因 

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

二、关于颜色空间描述

1.伽马空间(gamma)。

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

1. CRT 显示器的物理特性

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

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

unity透明度对应ps,Unity,ASE,数学建模

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

unity透明度对应ps,Unity,ASE,数学建模

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

 unity透明度对应ps,Unity,ASE,数学建模

unity透明度对应ps,Unity,ASE,数学建模

我们为什么要进行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)

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

unity透明度对应ps,Unity,ASE,数学建模

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

unity透明度对应ps,Unity,ASE,数学建模

人类的视觉系统在黑暗环境下的辨识能力要强于明亮环境这是进化过程中出现的特性, 这样有助于我们及时发现黑暗中隐藏的危险。而且人眼的这一特性与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矫正。

unity透明度对应ps,Unity,ASE,数学建模

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

unity透明度对应ps,Unity,ASE,数学建模

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

未勾选sRGB效果图:

unity透明度对应ps,Unity,ASE,数学建模

运算公式 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即可。

unity透明度对应ps,Unity,ASE,数学建模

2.PS修改为Linear 

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

unity透明度对应ps,Unity,ASE,数学建模

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

unity透明度对应ps,Unity,ASE,数学建模unity透明度对应ps,Unity,ASE,数学建模文章来源地址https://www.toymoban.com/news/detail-743748.html

到了这里,关于Unity之透明度混合与ps的透明度混合计算结果不一致(gamma矫正和线性空间)的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • 【CSS 23】颜色 RGBA HSLA 不透明度opacity 线性渐变 径向渐变 透明度渐变 重复渐变

    颜色 CSS 支持 140 多种颜色名称,以及十六进制值、RGB 值、RGBA 值、HSL 值、HSLA 值和不透明度 RGBA颜色 RGBA 颜色值是 RGB 颜色值的扩展,带有 alpha 通道 - 该通道规定颜色的不透明度 RGBA 颜色值是这样规定的:rgba(red, green, blue, alpha) alpha 参数是介于 0.0(完全透明)和 1.0(完全不

    2024年02月13日
    浏览(53)
  • Android 透明度设置

    目录 一、透明度对照表 二、透明度介绍 三、透明度设置 3.1 xml设置 3.2 代码设置   注:00是完全透明,FF就是完全不透明         我们的UI小姐姐就喜欢给 「不透明度」 ,这个需要自己判断一下。         Android中的颜色值通常遵循RGB/ARGB标准,使用时通常以“#”字符

    2024年02月05日
    浏览(52)
  • uniapp中map组件打点/地图上显示圆/设置map圆的透明度(十六进制颜色透明度)

    一般来说我们都是想设置成透明的圆,十六进制的后两位表示颜色 eg:#0000006A 6A就是表示透明度,数字越大透明度越高

    2024年02月12日
    浏览(55)
  • ObjectArx 设置填充透明度问题

    初始化透明度参数AcCmTransparency对象时,需要调用setAlpha设置透明度值,这里传入的值是0 255,但cad特性面板上显示的是0 90,且经过测试发现,传入值与特性面板显示的值也是不同的,比如传入90,显示64,百度搜索了个寂寞,最后还是在谷歌找到了答案,原来设置的值和特性面

    2024年02月15日
    浏览(53)
  • Android中设置颜色透明度

    1.布局中的xml设置 2.在代码中用的话就是用Java代码设置是这样设置的 3.从FF开始表示完全不透明,到00表示完全透明。左边的是透明百分比,右边是透明的代号,如果你想设置颜色透明50%,就是 #809E9E9E

    2024年02月14日
    浏览(45)
  • 人工智能透明度的最新进展

    作者:禅与计算机程序设计艺术 人工智能(AI)已经成为社会发展的重要组成部分。随着人工智能技术的不断发展,在法律界也逐渐将其作为重要的驱动力之一。然而,由于人工智能算法和模型的黑箱特性,加之对人工智能模型的理解能力有限,因此导致人工智能系统产生的

    2024年02月08日
    浏览(54)
  • WPF 控件设置透明度的方法

    方法一:通过 Opacity 属性设置背景色透明度。范围从0-1,0表示完全透明,看不见。     通过 Opacity 属性去改变控件透明度 会影响子控件的透明度,是因为Opacity属性是在UIElement 类(以及Brush基类)中定义,所有元素都具有该属性; 界面如下图图  方法二:通过Background 属性的

    2024年02月11日
    浏览(52)
  • Android 透明度颜色值对照表

      注:00是完全透明,FF就是完全不透明         我们的UI小姐姐就喜欢给 「不透明度」 ,这个需要自己判断一下。 二、透明度介绍         Android中的颜色值通常遵循RGB/ARGB标准,使用时通常以“#”字符开头,以16进制表示。         Android中的颜色值一般格式是:#AAR

    2024年04月14日
    浏览(78)
  • 小程序对色值透明度的处理

    在微信小程序中,可以使用CSS样式来实现对色值透明度的显示。下面是两种常用的实现方式: 1、使用rgba()函数: 2、使用十六进制颜色值: 在上述代码中, .element 是你想要设置透明度的元素的选择器,可以根据实际情况修改。通过设置透明度,可以让元素的背景颜色透出底

    2024年02月13日
    浏览(48)
  • 区块链溯源:让珠宝更有透明度

    作者:禅与计算机程序设计艺术 《区块链溯源:让珠宝更有透明度》 引言 1.1. 背景介绍 随着经济的发展和人们生活水平的提高,珠宝消费市场日益繁荣。然而,珠宝行业的假冒伪劣问题也时有发生,给消费者带来了经济损失和信任危机。为了解决这一问题,珠宝行业开始引

    2024年02月15日
    浏览(40)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包