1. 程式人生 > >NGUI panel裁剪shader解讀(一般人估計看不懂,慎點)

NGUI panel裁剪shader解讀(一般人估計看不懂,慎點)

  1. 單層panel邊緣漸隱
    ClipRange: 1/cy.z,1/cr.w,cr.x/cr.z,cr.y/cr.w
    解讀:cr.x cr.y panel的中心座標, cr.z半寬,cr.w 半高
    ClipArgs: cr.z/softness.x, cr.w/softness.y
    解讀:漸隱量
    Vert shader:
    Out.worldPos=v.vertex*ClipRange.xy-ClipRang.zw
    結果是:(x-cr.x)/cy.z, (y-cr.y)/cr.w
    Frag shader:
    float f=(float2(1,1)-abs(IN.worldPos))*ClipArgs
    結果是:1. (cr.z-|x-cr.x|)/cr.z, (cr.w-|y-cr.y|)/cr.w
    最終:(cr.z-|x-cr.x|)/softness.x, (cr.w-|y-cr.y|)/softness.y

示意圖:
這裡寫圖片描述

  1. 雙層panel邊緣漸隱
    將第二層畫素的座標對映到第一層panel,計算如上。
    求出兩層panel的最小factor

  2. panel單邊漸隱
    這裡寫圖片描述
    ClipProduct操作:
    這裡寫圖片描述
    WorldPos是進行了標準化操作的頂點,offset4是矩形。
    clipProduct只可能返回0或1,返回1表示此畫素不漸隱,返回0表示此畫素漸隱。但是此畫素如果應該被裁掉的話,那就應該被裁掉。
    Factor<=0表示此畫素應該被裁剪。
    這裡寫圖片描述
    Ceil(f1)就表示如果應該被裁掉,就把它裁掉。

總結:shader裡基本上不會出現判斷語句,而且基本上所有的運算都在[0,1]區間,所有判斷語句會被0或1數值代替(比如上邊的*ceil(f1))。這就是shader的精妙之處,也是shader的難點,不好懂。