OpenGL ES 2 0 頂點著色器的妙用

2022-08-27 03:15:08 字數 1265 閱讀 9409

基本原理

繪製一幀畫面時由頂點著色器根據一定的規則變換各個頂點的位置,即可得到旗幟迎風飄揚的效果。

為了使旗幟的飄動過程比較平滑,採用基於正弦曲線的頂點位置變換規則。

計算方法

傳入頂點著色器的原始頂點的z座標都是相同的(本案例為0),經過頂點著色器變換後頂點的z座標是根據正弦曲線分布的

首先計算出當前處理頂點的x座標與最左側頂點x座標的差值,即x距離

然後根據距離與角度的換算率將x距離換算為當前頂點與最左側頂點的角度差(tempangle)

接著將tempangle加上最左側頂點的對應角度(startangle)即可得到當前頂點的對應角度(currangle)

最後通過求currangle的正弦值即可得到當前頂點變換後的z座標

距離與角度的換算率指的是由開發人員認為設定的乙個值,將距離乘以其後就可以換算成角度值。

例如可以規定,x方向上距離4等於2pai,則換算公式為:x距離x2pai/4

基本原理

實現扭曲軟糖的效果只要將代表軟糖的長方體中各層頂點的x,z座標按照一定的規則根據頂點的y座標以及當前幀的控制引數進行變換即可。

計算步驟

首先,需要計算出當前頂點y座標與最下層頂點y座標的差值。

接著根據y座標的差值,角度換算比例以及本幀的總扭曲角度換算出當前頂點的扭曲角度,計算公式為currangle=(curry-starty)/ysanxanglespan.

最後根據當前頂點的x、z座標,扭曲的角度計算出變換後頂點的x、z座標,

x2 = xcosa-zsina

z2 = xsina+zcosa

基本原理

為了簡化計算,採用的風向是與xoz平面平行的。設當前風向與z軸正方向的夾角為a,樹幹原始狀態下與y軸重合,點a為樹幹模型中的任一頂點,在風的吹動下偏轉到a`點

則頂點著色器需要計算的問題為:已知a點座標(x0,y0,z0)、當前風向與z軸正方向的夾角a以及弧oa`所在圓的半徑oo`,求a點偏轉到a`後的座標。

計算步驟:

......有時間補補數學吧

基本原理:

給頂點著色器提供動畫中的每個關鍵幀對應的各個頂點的位置資料以及融合比例。頂點著色器根據兩套位置資料及當前融合的比例融合出一套結果頂點位置資料。只要在繪製每一幀時提供不同的混合比例即可產生想要的動畫。

要想能對原始三角形實現扭曲處理,必須將大三角形切分為很多的小三角形。

OpenGL ES 3 0頂點著色器(一)

opengl es 3.0流程圖 1.vertex shader 頂點著色器 頂點著色實現了一種通用的可程式設計方法操作頂點。頂點著色器的輸入包括以下幾個 shader program.程式的頂點著色程式源 或可執行程式,描述將在頂點上執行的操作。vertex shader inputs or at...

頂點著色器 片段著色器

一 著色器 著色器只是一種把輸入轉化為輸出的程式。著色器也是一種非常獨立的程式,因為它們之間不能相互通訊 它們之間唯一的溝通只有通過輸入和輸出。在最簡配置下,至少都得有兩個著色器 乙個叫頂點著色器 vertex shader 它將作用於每個頂點上 另乙個叫片段著色器 fragment shader ...

Shader 學習03 頂點著色器

shader hidden 3 shader2.0 subshader struct v2f v2f 頂點著色器的輸出值 片段著色器的輸入值 sampler2d maintex v2f 頂點著色器的輸出值 片段著色器的輸入值 fixed4 frag v2f i sv target endcg uni...