通过前几篇教程,相信大家对于RGB颜色方面的编程应该已经是得心应手了吧?还有一个方面我们没有涉及,那就是:颜色叠加。等这一篇写完,我想我的这个RGB教程也该结束了,因为我肚子里可就只有这么点东西了。
这个色光叠加部分,更多的是一种想法,连算法都算不上。因为这一部分连可以copy了直接用的代码都没有,只有一个swf文件,还是为了演示用的,不过我想这个swf里模仿photoshop的取色器大概还是有一点意思的,因为这不是本节的重点,大家还是自己分析源码吧,看过上一节和这一节后,应该不难理解!
言归正传,我们都知道可以用RGB的3色值来表示一个颜色。但是这并不是说我们在实际中看到的眼色就是由3原色光叠加组成的(计算机屏幕自然如此),而是说这种光的颜色和对应的3色光叠加对人眼的刺激是相同的,也就可以等效起来了。因此或许如果对于别的生物,比如猫,因为眼睛构造的不同,我们看来屏幕上和实物完全相同,猫看起来却不一样。这一部分在学科划分上属于色度学和心理学(交叉),大家有兴趣可以自己找资料看一看。
说这些废话是为了分清楚一件事情,光叠加和色(比如水彩)叠加。红光加上绿光看起来是黄光,但是红墨水掺上绿墨水可就差不多是黑的了。我们在计算机上所作的,都是光叠加的内容。
如果是一束ff0000的光和一束00ff00的光线叠加,是什么颜色?不错,是黄色:0xffff00.这也种简单的叠加方法其实也适合于更复杂的情况。
看到这里大家可能有一个担心,如果一种色光的强度超过255怎么办?很简单,超过255就把他设置为255,可不要进位啊!呵呵,开个玩笑。其实,这个担心是多余的,我们能证明,实际的情况中,永远也不会出现某一色光强度超过255的情况,最高等于255.
我觉得色光叠加最核心的问题是:如果是一个半透明的东西覆盖在另一个物体上,颜色怎么计算?
这可能是很多网友最头疼的问题之一,我也是和cnmusa讨论这个到问题才开始深入的思考色光叠加问题的。为简单考虑,我们先考虑整块的色块。一个色块的alpha值是30,意味着什么?就是说他本身的颜色我们可以看到30%,有70%(1-30%)的底色可以透过它射上来。是不是这个样子的呢?我们来做一下验证,看下面这个flash.
页面:点这儿参观
源代码(34K):colortest5.zip
在这个flash,你可以自己选择底色、覆盖层颜色、覆盖层透明度,然后看看我根据刚才那个原理预测的颜色是否和实际颜色相同。因为用了很多Math.floor(),肯定有误差,但是到目前我自己还没发现误差很大的情况。基本上可以证明,我关于半透明覆盖的猜想是正确的。
那现在我们可以得出计算公式了:叠加色r=覆盖色r*覆盖alpha+底色r*(1-覆盖色alpha);绿和蓝也是如此,然后再3色组合起来。
在我的这些flash文件里,rgb都是自己定义的,开始就是分立的。如果不是这样,那我们如果怎么得到一个诸如0xf456c7这样的颜色代码的rgb分立值?很简单:color=0xf456c7;r=(color&0xff0000)>>16;g=(color&0x00ff00)>>8;b=color&0x0000ff;
如果大家不明白,用下面这个也是一样的:color = 0x666666;r = Math.floor(color/65536);g = Math.floor((color-65536*r)/256);b = color-65536*r-256*g;
是不是很简单?:)
色光叠加写完了,我的这个《RGB颜色action自定义教程》也就算是可以告一段落了,写的不好,占用了大家很多的宝贵时间来都读、看,甚至是替我改错,真是非常感谢。其中特别感谢desigm、cnmusa两位网友。:D
希望大家对本教程的各种错误、不足提出意见,我将尽力将它修改完善。我也将继续就网友提出的各种问题在论坛为大家作出解答,谢谢大家。:D