理解EncodeFloatRGBA和DecodeFloatRGBA

最近在看渲染阴影的各种方法，发现在生成ShadowMap时有一个很常见压缩方法，但是在网上只能搜到代码，看不到比较详细的解释，所以这里给出一种我认为比较容易理解的解释。

inline float4 EncodeFloatRGBA( float v ) {
  float4 enc = float4(1.0, 255.0, 65025.0, 16581375.0) * v;
  enc = frac(enc);
  enc -= enc.yzww * float4(1.0/255.0,1.0/255.0,1.0/255.0,0.0);
  return enc;
}
inline float DecodeFloatRGBA( float4 rgba ) {
  return dot( rgba, float4(1.0, 1/255.0, 1/65025.0, 1/16581375.0) );
}

首先介绍一下使用的场景

ShadowMap保存了从灯光角度观察场景时，每一个像素对应的深度值，范围是[0,1]，这个值在后面的Pass中用来判断是否在阴影中，所以我们需要将这个值保存下来，因为计算ShadowMap是在一个单独的Pass中，所以可以将其渲染到贴图上。

还需要了解的是精度， float类型的精度是4btye，贴图有着各种各样的格式，但为了将4btye的数据完整保存下来，我们选择R8G8B8A8格式的贴图来作为渲染目标。

下面我们一步一步来计算

        首先将float看作是四部分8bit构成：

        因为我们选择的RT是R8G8B8A8，所以刚好每个通道存储8bit数据。四个通道是各自独立的，所以自然想到的办法是对float的四部分数据进行位移，然后分别存储，这些描述可能还是不清楚，可以看下面的图示。

1. 先将四部分的数据进行“对齐”.

对于b、c、d，分别移位8、16、24，这样abcd就出现在了一个维度，

这对应了代码

float4 enc = float4(1.0, 255.0, 65025.0, 16581375.0) * v;

得出的结果就变成了这样：

 第一行因为是乘的1，所以可以看作是原始数据。那么我们最后只要把黄色格子内的数据保存下来就好了。

2. 删除额外数据

首先回忆一下，因为是处理的ShadowMap中的深度，float的范围在0~1，所以对于超出32位的数据我们可以看作是大于1的部分，先将这些数据删掉，这对应了方法Frac

结果如图：

然后我们需要处理在0-24位的数据，经过观察可以发现，有两部分的数据一模一样！

所以我们可以继续进行位移，让两部分相减。之前将float乘2^n是左移，那么除法运算就是右移了，提取出YZW向量除以对应位数即可（因为之前的数据是XYZW，所以为了匹配，我们使用YZWW来计算，但是最后一个W乘的是0）。

这一步对应代码

enc -= enc.yzww * float4(1.0/255.0,1.0/255.0,1.0/255.0,0.0);

 经过这一步之后就只剩下了黄色框部分了，这时候将数据直接存储进R8G8B8A8就不会丢失精度了。Decode和Encode是类似的思想，只不过反过来了。