博客> OpenGLES系列07-摄像机
OpenGLES系列07-摄像机
2017-09-23 22:29 评论:0 阅读:213 handyTOOL
ios 开发 3D OPenGL ES

获取示例代码


上一篇文章中说到了透视和正交两种投影矩阵,文末提到了三个基本矩阵MVP。本文就以介绍MVP为开头,然后再详细讲解摄像机的概念。 MVP表示的是模型矩阵(Model),观察矩阵(View),投影矩阵(Projection)。投影矩阵介绍过了。模型矩阵针对的是单个3D模型,渲染每一个3D模型前,需要将各自的模型矩阵传递给Vertex Shader。观察矩阵针对的是场景中的所有物体,当观察矩阵改变时,所有顶点的位置都会受到影响,就好像你移动现实世界的摄像机,拍摄到的场景就会变化一样。所以观察矩阵可以理解为OpenGL 3D世界中的摄像机。我们有了摄像机这个变换矩阵之后,就可以很方便的在3D世界中游览,就像第一人称视角游戏中一样。 大概了解MVP之后,我们开始使用代码实现它们。首先要修改一下Vertex Shader。

attribute vec4 position;
attribute vec4 color;

uniform float elapsedTime;
uniform mat4 projectionMatrix;
uniform mat4 cameraMatrix;
uniform mat4 modelMatrix;

varying vec4 fragColor;

void main(void) {
    fragColor = color;
    mat4 mvp = projectionMatrix * cameraMatrix * modelMatrix;
    gl_Position = mvp * position;
}

我把之前的uniform transform换成了三个变换矩阵projectionMatrix,cameraMatrix,modelMatrix,它们分别是投影矩阵,观察矩阵,模型矩阵。将它们相乘projectionMatrix * cameraMatrix * modelMatrix,结果乘以position赋值给gl_Position。注意相乘的顺序,这个顺序的结果是先进行模型矩阵变换,再是观察矩阵,最后是投影矩阵变换。这样Vertex Shader中的MVP就实现完了,很简单是不是。

回到OC代码,我将之前的属性transform换成了4个变换矩阵,分别是两个M和VP。本文的例子将绘制两个矩形,所以我为它们分别定义了模型矩阵modelMatrix1modelMatrix2

@property (assign, nonatomic) GLKMatrix4 projectionMatrix; // 投影矩阵
@property (assign, nonatomic) GLKMatrix4 cameraMatrix; // 观察矩阵
@property (assign, nonatomic) GLKMatrix4 modelMatrix1; // 第一个矩形的模型变换
@property (assign, nonatomic) GLKMatrix4 modelMatrix2; // 第二个矩形的模型变换

接下来初始化这些属性。

    // 使用透视投影矩阵
    float aspect = self.view.frame.size.width / self.view.frame.size.height;
    self.projectionMatrix = GLKMatrix4MakePerspective(GLKMathDegreesToRadians(90), aspect, 0.1, 100.0);

    // 设置摄像机在 0,0,2 坐标,看向 0,0,0点。Y轴正向为摄像机顶部指向的方向
    self.cameraMatrix = GLKMatrix4MakeLookAt(0, 0, 2, 0, 0, 0, 0, 1, 0);

    // 先初始化矩形1的模型矩阵为单位矩阵
    self.modelMatrix1 = GLKMatrix4Identity;
    // 先初始化矩形2的模型矩阵为单位矩阵
    self.modelMatrix2 = GLKMatrix4Identity;

投影矩阵使用了透视投影进行初始化。两个模型矩阵初始化为单位矩阵。本文的主角观察矩阵初始化为摄像机在 0,0,2 坐标,看向 0,0,0点,向上朝向0,1,0。GLKMatrix4MakeLookAt提供了快捷创建观察矩阵的方法,需要传递9个参数,摄像机的位置eyeX,eyeY,eyeZ,摄像机看向的点centerX,centerY,centerZ,摄像机向上的朝向upX, upY, upZ。改变这几个参数就能控制摄像机在3D世界中通过不同角度拍摄物体。 我把上一篇的剖面示意图做了一下修改。

图中的lookAt就是center。

我们可以这么理解观察矩阵。在观察矩阵的作用下,透视矩阵的原点变成了摄像机的位置eye。up决定了摄像机围绕eye和lookAt形成的轴(本例中就是Z轴)的旋转角度,读者可以修改本例的中的up值看看效果。lookAt决定了摄像机能看到的区域,可以看做是控制摄像机在Y轴和X轴上的旋转角度。

在第一人称的游戏中,只要控制lookAt的位置就可以实现360度查看周边景物的效果,后面介绍到渲染3D场景的时候会深入讲解。

初始化完后在update中为这些矩阵赋新的值。

- (void)update {
    [super update];
    float varyingFactor = (sin(self.elapsedTime) + 1) / 2.0; // 0 ~ 1
    self.cameraMatrix = GLKMatrix4MakeLookAt(0, 0, 2 * (varyingFactor + 1), 0, 0, 0, 0, 1, 0);

    GLKMatrix4 translateMatrix1 = GLKMatrix4MakeTranslation(-0.7, 0, 0);
    GLKMatrix4 rotateMatrix1 = GLKMatrix4MakeRotation(varyingFactor * M_PI * 2, 0, 1, 0);
    self.modelMatrix1 = GLKMatrix4Multiply(translateMatrix1, rotateMatrix1);

    GLKMatrix4 translateMatrix2 = GLKMatrix4MakeTranslation(0.7, 0, 0);
    GLKMatrix4 rotateMatrix2 = GLKMatrix4MakeRotation(varyingFactor * M_PI, 0, 0, 1);
    self.modelMatrix2 = GLKMatrix4Multiply(translateMatrix2, rotateMatrix2);
}

float varyingFactor = (sin(self.elapsedTime) + 1) / 2.0;的值从0到1。 摄像机的Z轴坐标为2 * (varyingFactor + 1),从2到4。 第一个矩形向左偏移0.7,绕Y轴旋转varyingFactor * M_PI * 2,从0到360度。 第二个矩形向右偏移0.7,绕Z轴旋转varyingFactor * M_PI * 2,从0到360度。

最后给uniform赋值。

- (void)glkView:(GLKView *)view drawInRect:(CGRect)rect {
    [super glkView:view drawInRect:rect];

    GLuint projectionMatrixUniformLocation = glGetUniformLocation(self.shaderProgram, "projectionMatrix");
    glUniformMatrix4fv(projectionMatrixUniformLocation, 1, 0, self.projectionMatrix.m);
    GLuint cameraMatrixUniformLocation = glGetUniformLocation(self.shaderProgram, "cameraMatrix");
    glUniformMatrix4fv(cameraMatrixUniformLocation, 1, 0, self.cameraMatrix.m);

    GLuint modelMatrixUniformLocation = glGetUniformLocation(self.shaderProgram, "modelMatrix");
    // 绘制第一个矩形
    glUniformMatrix4fv(modelMatrixUniformLocation, 1, 0, self.modelMatrix1.m);
    [self drawRectangle];

    // 绘制第二个矩形
    glUniformMatrix4fv(modelMatrixUniformLocation, 1, 0, self.modelMatrix2.m);
    [self drawRectangle];
}

先给uniform projectionMatrixuniform cameraMatrix赋值。每个矩形绘制之前,再将各自的modelMatrix赋值给uniform modelMatrix,就像开头说的那样,每个3D模型有自己的模型变换。

最终效果如下。

本篇主要介绍了摄像机(观察矩阵),三大基本矩阵MVP的概念。下一篇小试牛刀,开始渲染真正的3D物体-正方体。

收藏
1
sina weixin mail 回到顶部