android 自绘随机键盘实现,OpenGL 实现正方形绘制，键盘控制移动(三)

其实，在上一次绘制完一个三角形之后，正方形的绘制流程大致是一样，只是需要控制正方形的移动，我们需要多注册一个特殊函数，用于监听方向键的移动，并根据移动方向，平移正方形，首先看一下最后实现的效果，当然gif倍速了，将就看吧😓

方向键控制正方形移动

首先，我们要实现的是一个可以移动的的正方形，而不在是一个静态的图形，那么图形的顶点数据就不是一个不变的值；那我们应该怎么设置顶点数据？ 一开始，我们的正方形有一个初始位置，当每按压一次方向键(上/下/左/右)，那么整个正方形上的所有点朝某一个方向移动一个步长(每一次移动的量stepSize),移动后的位置都是原来的坐标值加上一个步长，当然，方向不同，stepSize有正负之分，那么问题可以转化为 ：顶点数据 = 初始顶点数据 + 移动量。这样我们就可以先将正方形个顶点的坐标先记录下来，再用两个变量分别记录图形在左右方向、上下方向的移动量记录下来，即可得到我们实时的正方形顶点位置，也就可以绘制移动的正方形；准备以上数据如下：// 定义一个着色器管理器

GLShaderManager shaderMagager;

// 定义一个批次类容器GLBatch triangleBatch;

// 正方形边长的1/2

GLfloat blockSize = 0.1f;

//正方形顶点数据 ABCD 正方形边长为 2 * blockSize

GLfloat vVerts[] = {

-blockSize,-blockSize,0.0,

blockSize,-blockSize,0.0,

blockSize,blockSize,0.0,

-blockSize,blockSize,0.0,};

//x轴方向的移动量

GLfloat xPos = 0.0f;

//y轴方向的移动量GLfloat yPos = 0.0f;

从以上初始化数据，我们可以得到如下图中的正方形，在窗口中的坐标系中的位置，如下图，图中的A、B、C、D的坐标，对应于正方形的顶点数据，图中的原点O的坐标为(0，0，0)，我们将这个点选为我们移动的参照点，及通过它移动后的坐标刚好对应(xPos，yPos, 0);以通过它来做边界碰撞的判断；

正方形初始状态

接下来看主函数的工作：主函数中我们需要：1、初始化GLUT库；2、设置窗口模式、大小、标题；3.注册需要回调的函数；4、设置渲染环境;5、启动GLUT Roop;

在主函数中注册的三个函数：ChangeSize、RenderScene、SpecialKey会在GLUT Roop收到对应的消息时，触发回调，其流程如下

程序执行流程

接下来看一下具体函数的实现，首先看主函数int main(int argc,char *argv[]){

gltSetWorkingDirectory(argv[0]);    glutInit(&argc, argv);    //设置工作路径  glutInitDisplayMode(GLUT_DOUBLE|GLUT_RGBA|GLUT_DEPTH|GLUT_STENCIL);    glutInitWindowSize(600, 600);

glutCreateWindow("方向键控制正方形移动");

// 注册函数    //注册窗口发生改变寒色

glutReshapeFunc(changeSize);

//注册渲染函数    glutDisplayFunc(RenderScene);

//注册特殊函数，监听方向键按钮操作的回调函数

glutSpecialFunc(SpecialKeys);

GLenum status = glewInit();

if (GLEW_OK != status) {

printf("GLEW Error:%s\n",glewGetErrorString(status));    }

// 设置渲染环境

setupRC();

// 启动GLUT循环

glutMainLoop();

return 0;

}

设置渲染环境的setupRC，这里顶点的链接模式，我们改为了平面链接模式GL_TRIANGLE_FAN，并且顶点为4个void setupRC(void) {

// 设置清屏颜色

glClearColor(0.8, 0.3, 0.6, 1.0);

//初始化固定着色器

shaderMagager.InitializeStockShaders();

//指定批次容器的类型和顶点个数

triangleBatch.Begin(GL_TRIANGLE_FAN, 4);

//拷贝图形的顶点数据

triangleBatch.CopyVertexData3f(vVerts);

triangleBatch.End();

}

窗口的初始化或大小发生改变的回调函数，ChangeSize函数；/* 在窗口大小改变时，接收新的宽度&高度。 */

void changeSize(int w,int h){

/*      x,y 参数代表窗口中视图的左下角坐标，而宽度、高度是像素为表示，通常x,y 都是为0     */    glViewport(0, 0, w, h);

}

需要渲染时的函数RenderScene的实现void RenderScene(void){

//清理要使用的缓存区    glClear(GL_COLOR_BUFFER_BIT|GL_DEPTH_BUFFER_BIT|GL_STENCIL_BUFFER_BIT);

GLfloat vColor[] = {0.3,0.8,0.6,1.0};

M3DMatrix44f mFinalTansformMatrix;

//平移动

m3dTranslationMatrix44(mFinalTansformMatrix, xPos, yPos, 0);

//提交矩阵结果给固定着色器，触发绘制    shaderMagager.UseStockShader(GLT_SHADER_FLAT,mFinalTansformMatrix,vColor);    triangleBatch.Draw();    glutSwapBuffers();

}

当我们按下方向键时，触发的的时SpecialKeys，当按一次左方向键，图形发生如下改变,很容易得到这个时候的移动量的值，xPos -=stepSize;同理可得到向右移动一次时，xPos += stepSize；我们也同样可以得到向上或向下移动的yPos的变化，向上移动一次 yPos += stepSize;向下移动时 yPos -= stepSize；

正方形向左移动一次

我们想要正方形只在窗口中移动，那么当正方向碰到边时，我们应该让其停下来，我们知道x轴方向和y轴方向的坐标范围都为[-1.0f,1.0f],下图中画出了正方形移动到各端边界时的直观图，当然不一定只在x轴方向、或y轴移动，图示只是为了理解边界碰撞的坐标判断，我们一直以中心点为移动量基准点，所以图中4个红点的位置，即是正方形在各方向的最大移动量的情况，我们想要正方形不超出最左端，那必须xPos>= -1.0 + blockSize，不超出最右端的条件时 xPos <= 1.0 - blockSize;同理，不超出最顶点yPos <= 1.0 - blockSize; 不超出最底端 yPos >= -1.0 + blockSize;

边界效果

SpecialKeys的具体实现：void SpecialKeys(int key, int x, int y){

GLfloat stepSize = 0.05f;

if (key == GLUT_KEY_UP) {

yPos += stepSize;

}

if (key == GLUT_KEY_DOWN) {

yPos -= stepSize;

}

if (key == GLUT_KEY_LEFT) {

xPos -= stepSize;

}

if (key == GLUT_KEY_RIGHT) {

xPos += stepSize;    }

// 边界碰撞检测

if (xPos < -1.0f + blockSize) {

xPos = -1.0f + blockSize;

}

if (xPos > 1.0f - blockSize) {

xPos = 1.0f - blockSize;

}

if (yPos < - 1.0f + blockSize) {

yPos = -1.0f + blockSize;    }

if (yPos > 1.0f - blockSize) {

yPos = 1.0f -blockSize;

}

glutPostRedisplay();

}