紋理座標
當紋理映射啓動後繪圖時,你必須爲OpenGL ES提供其他數據,即頂點數組中各頂點的 紋理座標。紋理座標定義了圖像的哪一部分將被映射到多邊形。它的工作方式有點奇怪。你有一個正方形或長方形的紋理,其左下角爲二維平面的原點,高和寬的單位爲一。像這樣:
這就是我們的“紋理座標系統”,不使用x 和 y 來代表二維空間,我們使用 s 和 t 作爲紋理座標軸,但原理上是一樣的。
除了 s 和 t 軸外,被映射的紋理在多邊形同樣有兩個軸,它們稱爲 u 和 v軸。這是源於許多3D圖像程序中的UV 映射 的術語。
好,我們明白了紋理座標系統,我們現在討論怎樣使用這些紋理座標。當我們指定頂點數組中的頂點時,我們需要在另一個數組中提供紋理座標,它稱爲紋理座標數組。 每個頂點,我們將傳遞兩個GLfloats (s, t) 來指定頂點在上圖所示座標系統的位置。讓我們看看一個可能是最爲簡單的例子,將整個圖像映射到一個由三角形條組成的正方形上。首先,我們創建一個由四個頂點組成的頂點數組:
現在將兩個框圖疊在一起,所使用的座標數組的值變得很明顯:
將其轉化爲 GLfloat數組:
static const GLfloat texCoords[] = {
0.0, 1.0,
1.0, 1.0,
0.0, 0.0,
1.0, 0.0
};
下面是我使用的紋理:
運行時的結果:
請等下:那並不正確。如果你仔細對比一下紋理圖像和上面的截屏,你就會發現它們並不完全相同。截屏中圖像的y軸(或t軸)完全顛倒了。它上下顛倒了,並不是旋轉,而是翻轉了。
更多的映射方式
上個例子中這個圖像都被映射到繪製的正方形上。那是因爲設定的紋理座標所決定的。我們可以改變座標數組僅使用源圖像的中心部分。讓我們看看僅使用了圖像中心部分的另一個框圖:
其座標數組爲:
static const GLfloat texCoords[] = {
0.25, 0.75,
0.75, 0.75,
0.25, 0.25,
0.75, 0.25
};
運行使用了新映射到程序,屏幕上只顯示了圖像的中心部分:
類似地,如果我們只希望顯示紋理的左下部:
座標數組爲:
static const GLfloat texCoords[] = {
0.0, 0.5,
0.5, 0.5,
0.0, 0.0,
0.5, 0.0
};
顯示結果:
等一下,還有更多的方式
實際上,並不是真正還有更多的映射方式,只是說此功能在正方形到正方形的映射時並不很明顯。同樣的步驟適合於幾何體中任何三角形,而且你甚至可以通過非常規方式的映射來扭曲紋理。例如,我們可以定義一個等腰三角形:
但將底部頂點映射到紋理的左下角:
運行時結果如下:
注意到紋理正方形左下角的弧形花紋現在處於三角形的底部了嗎?總而言之,紋理上的任何一點都可以映射到多邊形的任何一點。或者換而言之,你可以對任何地點(u,v)使用任何(s,t)而OpenGL ES則爲你進行映射。