ps濾鏡之旋轉扭曲演算法實現

最近捕魚達人3的發布，人氣比較高，由於前2部作品已經有一大群「粉絲」，所以此次3代再發布就受到很多關注。就畫面3代是3d的效果，加上一些特殊效果，在畫面質量上有了一定的提公升。本文講述一下捕魚3的開場漩渦實現方法，它類似ps的旋轉扭曲效果，只是程式中可以動態改變引數，實現像漩渦一樣的效果。

首先，進入主場景的時候，將整個場景渲染到乙個節點中，然後執行shader操作，vert著色器將所有的點進行扭曲變換，在顏色著色器乘以乙個沿著中心點變化的因子，使得越靠近中心點，顏色逐漸變成白色或者透明。

為了將扭轉力具體化，這裡我將它看出角加速度，假設靠近中心點的距離在一定範圍內用百分比表示，比如在400個單位的範圍，距離中心點100的點就是100/400=0.25，將它用do表示。假如扭力在距離中心點100的地方是最大的，然後向兩邊越來越少，這樣就會形成旋轉扭曲的效果。

float d=sqrt(ja_position.x*ja_position.x+ja_position.y*ja_position.y);

float d0=d/400;

float w=0.1+(1-(do-0.25)*(do-0.25))*force;

float c=cos(w);

float s=sin(w);

mat4 m1=mat4(c,s,0,0,-s,c,0,0,0,0,1,0,0,0,0,1);

gl_position =cc_mvpmatrix *m1* ja_position;

在以上的**中，m1是點的變換矩陣，將所有點左乘m1，最後就會出現扭曲的效果。

gl_fragcolor =dstclr*d0;

以上是將目標色乘以變化因子，這裡只是簡單將中心點附近的顏色變淺。

由於源**很多，還要建立網格，頂點索引等等，這裡就不一一貼上來啦~，需要的朋友可以聯絡，呵呵

效果圖：

變換前：

變換後：