Qt5版NeHe OpenGL教程之十：飄動(dòng)的旗幟
[導(dǎo)讀]這一課將把如下圖片做成一個(gè)飄動(dòng)的旗幟，其實(shí)主要還是用到了紋理映射。lesson10.h#ifndef?LESSON10_H
#define?LESSON10_H
#include#include#i
這一課將把如下圖片做成一個(gè)飄動(dòng)的旗幟，其實(shí)主要還是用到了紋理映射。
lesson10.h
#ifndef?LESSON10_H
#define?LESSON10_H
#include#include#includeclass?QPainter;
class?QOpenGLContext;
class?QOpenGLPaintDevice;
class?Lesson10?:?public?QWindow,?QOpenGLFunctions_1_1
{
????Q_OBJECT
public:
????explicit?Lesson10(QWindow?*parent?=?0);
????~Lesson10();
????virtual?void?render(QPainter?*);
????virtual?void?render();
????virtual?void?initialize();
public?slots:
????void?renderNow();
protected:
????void?exposeEvent(QExposeEvent?*);
????void?resizeEvent(QResizeEvent?*);
????void?keyPressEvent(QKeyEvent?*);?//?鍵盤事件
????void?timerEvent(QTimerEvent?*);??//?定時(shí)器
private:
????void?loadGLTexture();
private:
????QOpenGLContext?*m_context;
????GLfloat?m_x_rotate;
????GLfloat?m_y_rotate;
????GLfloat?m_z_rotate;
????GLuint?m_texture[1];
????//我們將使用points數(shù)組來存放網(wǎng)格各頂點(diǎn)獨(dú)立的x，y，z坐標(biāo)。這里網(wǎng)格由45×45點(diǎn)形成，
????//換句話說也就是由44格×44格的小方格子依次組成了。
????float?m_points[45][45][3];?//?Points網(wǎng)格頂點(diǎn)數(shù)組
};
#endif?//?LESSON10_Hlessson10.cpp
#include?"lesson10.h"
#include#include#include#include#include#includeLesson10::Lesson10(QWindow?*parent)?:
????QWindow(parent)
??,?m_context(0)
??,?m_x_rotate(0.0f)
??,?m_y_rotate(0.0f)
??,?m_z_rotate(0.0f)
{
????setSurfaceType(QWindow::OpenGLSurface);
????startTimer(20);
}
Lesson10::~Lesson10()
{
????glDeleteTextures(1,?&m_texture[0]);
}
void?Lesson10::render(QPainter?*painter)
{
????Q_UNUSED(painter);
}
void?Lesson10::render()
{
????glClear(GL_COLOR_BUFFER_BIT|GL_DEPTH_BUFFER_BIT);
????glViewport(0,0,(GLint)width(),(GLint)height());?//?重置當(dāng)前視口
????glMatrixMode(GL_PROJECTION);????????????????????//?選擇投影矩陣
????glLoadIdentity();???????????????????????????????//?重置投影矩陣為單位矩陣
????gluPerspective(45.0f,(GLdouble)width()/(GLdouble)height(),0.1f,100.0f);
????glMatrixMode(GL_MODELVIEW);?//?選擇模型視圖矩陣
????glLoadIdentity();???????????//?重置模型視圖矩陣為單位矩陣
????float?float_x,?float_y,?float_xb,?float_yb; //?用來將旗形的波浪分割成很小的四邊形
????glTranslatef(0.0f,0.0f,-12.0f); ????//?移入屏幕12個(gè)單位
????glRotatef(m_x_rotate,1.0f,0.0f,0.0f); //?繞?X?軸旋轉(zhuǎn)
????glRotatef(m_y_rotate,0.0f,1.0f,0.0f); //?繞?Y?軸旋轉(zhuǎn)
????glRotatef(m_z_rotate,0.0f,0.0f,1.0f); //?繞?Z?軸旋轉(zhuǎn)
????glBindTexture(GL_TEXTURE_2D,?m_texture[0]); //?選擇紋理
????glBegin(GL_QUADS); ????????????//?四邊形繪制開始
????for(int?x?=?0;?x?<?44;?x++?) ????//?沿X平面0-44循環(huán)(45點(diǎn))
????{
????????for(int?y?=?0;?y?<?44;?y++?) ????//?沿Y平面0-44循環(huán)(45點(diǎn))
????????{
????????????//接著開始使用循環(huán)進(jìn)行多邊形繪制。這里使用整型可以避免我以前所用的int()強(qiáng)制類型轉(zhuǎn)換。
????????????float_x?=?float(x)/44.0f; //?生成X浮點(diǎn)值
????????????float_y?=?float(y)/44.0f; //?生成Y浮點(diǎn)值
????????????float_xb?=?float(x+1)/44.0f; //?X浮點(diǎn)值+0.0227f
????????????float_yb?=?float(y+1)/44.0f; //?Y浮點(diǎn)值+0.0227f
????????????//上面我們使用4個(gè)變量來存放紋理坐標(biāo)。每個(gè)多邊形（網(wǎng)格之間的四邊形）分別映射了紋理的1/44×1/44部分。
????????????//循環(huán)首先確定左下頂點(diǎn)的值，然后我們據(jù)此得到其他三點(diǎn)的值。
????????????glTexCoord2f(?float_x,?float_y); //?第一個(gè)紋理坐標(biāo)?(左下角)
????????????glVertex3f(?m_points[x][y][0],?m_points[x][y][1],?m_points[x][y][2]?);
????????????glTexCoord2f(?float_x,?float_yb?); //?第二個(gè)紋理坐標(biāo)?(左上角)
????????????glVertex3f(?m_points[x][y+1][0],?m_points[x][y+1][1],?m_points[x][y+1][2]?);
????????????glTexCoord2f(?float_xb,?float_yb?); //?第三個(gè)紋理坐標(biāo)?(右上角)
????????????glVertex3f(?m_points[x+1][y+1][0],?m_points[x+1][y+1][1],?m_points[x+1][y+1][2]?);
????????????glTexCoord2f(?float_xb,?float_y?); //?第四個(gè)紋理坐標(biāo)?(右下角)
????????????glVertex3f(?m_points[x+1][y][0],?m_points[x+1][y][1],?m_points[x+1][y][2]?);
????????}
????}
????glEnd(); ?????????????????//?四邊形繪制結(jié)束
}
void?Lesson10::initialize()
{
????loadGLTexture();??????????????????????//?加載紋理
????glEnable(GL_TEXTURE_2D);??????????????//?啟用紋理映射
????glShadeModel(GL_SMOOTH);??????????????//?啟用平滑著色
????glClearColor(0.0f,?0.0f,?0.0f,?0.0f);?//?黑色背景
????glClearDepth(1.0f);???????????????????//?設(shè)置深度緩存
????glEnable(GL_DEPTH_TEST);??????????????//?啟用深度測(cè)試
????glDepthFunc(GL_LEQUAL);???????????????//?深度測(cè)試類型
????//?接著告訴OpenGL我們希望進(jìn)行最好的透視修正。這會(huì)十分輕微的影響性能。但使得透視圖看起來好一點(diǎn)。
????glHint(GL_PERSPECTIVE_CORRECTION_HINT,?GL_NICEST);
????glPolygonMode(?GL_BACK,?GL_FILL?); //?后表面完全填充
????glPolygonMode(?GL_FRONT,?GL_LINE?); //?前表面使用線條繪制
????//?上面的代碼指定使用完全填充模式來填充多邊形區(qū)域的背面(后面)。
????//?相反，多邊形的正面（表面）則使用輪廓線填充了。這些方式完全取決于您的個(gè)人喜好。并且與多邊形的方位或者頂點(diǎn)的方向有關(guān)。
????for(int?x=0;?x<45;?x++)
????{
????????for(int?y=0;?ysetFormat(requestedFormat());
????????m_context->create();
????????needsInitialize?=?true;
????}
????m_context->makeCurrent(this);
????if?(needsInitialize)?{
????????initializeOpenGLFunctions();
????????initialize();
????}
????render();
????m_context->swapBuffers(this);
}
void?Lesson10::loadGLTexture()
{
????//現(xiàn)在載入圖像，并將其轉(zhuǎn)換為紋理。
????QImage?image(":/image/Tim.bmp");
????image?=?image.convertToFormat(QImage::Format_RGB888);
????image?=?image.mirrored();
????glGenTextures(1,?&m_texture[0]);//創(chuàng)建紋理
????//使用來自位圖數(shù)據(jù)生成的典型紋理
????glBindTexture(GL_TEXTURE_2D,?m_texture[0]);
????glTexImage2D(GL_TEXTURE_2D,?0,?3,image.width(),?image.height(),
?????????????????0,?GL_RGB,?GL_UNSIGNED_BYTE,image.bits());
????glTexParameteri(GL_TEXTURE_2D,GL_TEXTURE_MIN_FILTER,GL_LINEAR); //?線形濾波
????glTexParameteri(GL_TEXTURE_2D,GL_TEXTURE_MAG_FILTER,GL_LINEAR); //?線形濾波
}
void?Lesson10::exposeEvent(QExposeEvent?*event)
{
????Q_UNUSED(event);
????if?(isExposed())
????{
????????renderNow();
????}
}
void?Lesson10::resizeEvent(QResizeEvent?*event)
{
????Q_UNUSED(event);
????if?(isExposed())
????{
????????renderNow();
????}
}
void?Lesson10::timerEvent(QTimerEvent?*event)
{
????for(int?y?=?0;?y?<?45;?y++?) //?Y平面循環(huán)
????{
????????GLfloat?hold?=?m_points[0][y][2]; //?存儲(chǔ)當(dāng)前左側(cè)波浪值
????????for(int?x?=?0;?x?<?44;?x++) ????//?沿X平面循環(huán)
????????{
????????????//?當(dāng)前波浪值等于其右側(cè)的波浪值
????????????m_points[x][y][2]?=?m_points[x+1][y][2];
????????}
????????m_points[44][y][2]=hold; //?剛才的值成為最左側(cè)的波浪值
????}
????//上面所作的事情是先存儲(chǔ)每一行的第一個(gè)值，然后將波浪左移一下，使圖象產(chǎn)生波浪。
????//存儲(chǔ)的數(shù)值挪到末端以產(chǎn)生一個(gè)永無盡頭的波浪紋理效果。
????//上面的代碼由NeHe（2000年2月）修改過，以消除波浪間出現(xiàn)的細(xì)小鋸齒。
????//現(xiàn)在增加?xrot?,?yrot?和?zrot?的值。
????m_x_rotate+=0.3f; //?X?軸旋轉(zhuǎn)
????m_y_rotate+=0.2f; //?Y?軸旋轉(zhuǎn)
????m_z_rotate+=0.4f; //?Z?軸旋轉(zhuǎn)
????renderNow();
????QWindow::timerEvent(event);
}
void?Lesson10::keyPressEvent(QKeyEvent?*event)
{
????int?key=event->key();
????switch(key)
????{
????}
}main.cpp
#include#includeint?main(int?argc,?char?*argv[])
{
????QGuiApplication?app(argc,?argv);
????QSurfaceFormat?format;
????format.setSamples(16);
????Lesson10?window;
????window.setFormat(format);
????window.resize(640,?480);
????window.show();
????return?app.exec();
}運(yùn)行效果
下載文檔
