<aside> <img src="/icons/drafts_gray.svg" alt="/icons/drafts_gray.svg" width="40px" /> 筆者的碎碎念: 筆者認為，學習並不是跟著書上的內容敲一遍代碼便可。而是一種不斷思考「為甚麼」的過程。從光照那一章節開始，就感覺到書的作者好像有點忽略了這一點，更多的只是提供了如何實現的過程。

</aside>

屏幕亮度、飽和度和對比度

<aside> <img src="/icons/skull_gray.svg" alt="/icons/skull_gray.svg" width="40px" /> 書中沒有給出來源，這一點比較不好

</aside>

這裏上一下代碼:

fixed4 frag (v2f i) : SV_Target {
		fixed4 renderTex = tex2D (_MainTex, i.uv);
          
    // Apply brightness
    fixed3 finalColor = renderTex.rgb * _Brightness;

    // Apply saturation
    fixed luminance = 0.2125 * renderTex.r + 
											0.7154 * renderTex.g + 
											0.0721 * renderTex.b;
    fixed3 luminanceColor = fixed3 (luminance, luminance, luminance);
    finalColor = lerp (luminanceColor, finalColor, _Saturation);

    // Apply contrast
    fixed3 avgColor = fixed3 (0.5f, 0.5f, 0.5f);
    finalColor = lerp (avgColor, finalColor, _Contrast);
	
	return fixed4 (finalColor, renderTex.a);
}

調整的是「亮度、飽和度、對比度」。

• 亮度: 比較簡單，將紋理顏色乘亮度因子。
• 飽和度: 就是色彩。基於一篇論文所提及的人類感知屏幕色彩的敏感度。得到灰度圖，然後再做插值。
• 對比度: 黑與白之間的插值。在代碼中，筆者將0.5改為0.0了。

更多詳細內容可以搜索顏色相關的資料。

邊緣檢測

本篇文章下面的章節有介紹卷積和梯度，可以先去看一下。這些邊緣檢測算子，所求的梯度的意思，就是指水平、垂直、斜角的差值。

<aside> <img src="/icons/drafts_gray.svg" alt="/icons/drafts_gray.svg" width="40px" /> 如果依然不理解也沒關係，先記著這樣做就能做到邊緣檢測便可

</aside>

就和我之前所說的，學習新技術時，除了學習如何應用，更關鍵的應該是理解背後的原理，以及作者的意圖。所以接下來會說明書上沒有的內容。

Roberts