一、准备工作
- 电脑配置安装 Xcode 环境
- 下载环境需要的资源文件 CLTools、glew、libGLTools.a
二、开始配置环境
2.1、用 Xcode 创建文件
打开 Xcode->New->Project->macOS->App
如下图:
2.2、删除不用文件类
2.3、添加准备工作中的资源文件及配置路径
资源文件拖到项目目录或者粘贴复制进来都可以。
2.4、添加系统库 GLUT.framework、OpenGL.framework
2.5、将 main.m 文件更改为 main.cpp 或者删除新建 .cpp 文件
新建 .cpp 文件如下:
此时,OpenGL 环境搭建完成,接下来通过一个案例来实现一个三角形。
三、案例渲染三角形
接下来的代码在 main.cpp 文件中编写,如果 main.cpp 里面有内容,先清空。
3.1、引入着色器头文件及辅助类头文件
#include "GLShaderManager.h"
#include "GLTools.h"
#include <GLUT/GLUT.h>
OpenGL 的渲染是依靠着色器的,因此,需要引入着色器管理类头文件 #include "GLShaderManager.h"。GLTools.h 头文件包含独立函数,提供给不同平台调用。GLUT.h 作为辅助类,提供一些帮助,比如提供循环调用,类似 runloop。
3.2、定义一个着色器和三角形的容器类
GLShaderManager shaderManager;
GLBatch triangleBatch;
整个过程离不开着色器,所以着色器管理类是少不了的。另外,渲染三角形需要一个容器,就好比制作东西需要一个模具一样,GLBatch 可以理解为一个容器类,只是这次我们要制作一个三角形。
3.3、main 函数
头文件和管理类及容器定义完之后,我们需要从 main 函数为入口开始初始化。
int main(int argc, char *argv[]) {
//初始化GLUT
glutInit(&argc, argv);
//初始化不同类型
glutInitDisplayMode(GLUT_DOUBLE|GLUT_RGBA|GLUT_DEPTH|GLUT_STENCIL);
//初始化窗口大小
glutInitWindowSize(800, 600);
//创建窗口标题
glutCreateWindow("Triangle");
//辅助类 GLUT 提供的消息循环,调用的2个回调函数
glutReshapeFunc(changeSize);
glutDisplayFunc(RanderScene);
//检测
GLenum status = glewInit();
if (GLEW_OK != status) {
//打印错误信息
printf("GLEW Error:%s\n",glewGetErrorString(status));
return 1;
}
//设置渲染环境
setupRC();
//加入loop循环
glutMainLoop();
return 0;
}
main 函数作为程序的入口,需要初始化辅助类并创建窗口信息
//初始化GLUT
glutInit(&argc, argv);
//初始化不同类型
glutInitDisplayMode(GLUT_DOUBLE|GLUT_RGBA|GLUT_DEPTH|GLUT_STENCIL);
//初始化窗口大小
glutInitWindowSize(800, 600);
//创建窗口标题
glutCreateWindow("Triangle");
另外主要的是辅助类提供的函数回调的2个方法:
-
glutReshapeFunc(changeSize)
此函数在改变窗口大小时,可以实时回调新窗口的大小信息,回调方法 changeSize 的实现如下:
void changeSize(int w,int h) {
glViewport(0, 0, w, h);
}
首次进入程序或者每次改变窗口时,都会触发这个方法。此方法要放在 main 函数之前调用。
-
glutDisplayFunc(RanderScene)
此函数为显示函数,专门来绘制图形的,回调方法 ** RanderScene** 的实现如下:
void RanderScene (void) {
//清理缓冲区
glClear(GL_COLOR_BUFFER_BIT|GL_DEPTH_BUFFER_BIT|GL_STENCIL_BUFFER_BIT);
//调配颜色
GLfloat vGreen[] = {0.0,1.0,0.0,1.0};
//调用固定着色器
shaderManager.UseStockShader(GLT_SHADER_IDENTITY,vGreen);
//绘制
triangleBatch.Draw();
//缓冲区互换
glutSwapBuffers();
}
此函数回调是用着色器绘制图形的,根据双缓冲区原理,那么绘制前要先清理缓存区,然后加入本次绘制需要的颜料,调用加入颜料后的着色器,拥有三角形的容器开始绘制,完成后,通过缓冲区互换,显示在窗口上。
那么,着色器只是着色,三角形是从何而来呢?接下来解析三角形容器环境的配置,也就是 setupRC() 方法的实现:
void setupRC () {
//背景颜色
glClearColor(0.9, 0.2, 0.7, 1);
//初始化着色器
shaderManager.InitializeStockShaders();
//确定三角形的三个顶点
GLfloat vVerts[] = {
-1.0f,0.0f,0.0f,
0.5f,0.0f,0.0f,
0.0f,0.5f,0.0f,
};
//开始建立三角形
triangleBatch.Begin(GL_TRIANGLES, 3);
//copy 顶点数据
triangleBatch.CopyVertexData3f(vVerts);
//建立完成
triangleBatch.End();
}
此方法用来建立一个三角形容器的环境,首先确定整个环境的背景颜色,然后初始化着色器(着色器没有初始化之前,是不能调用着色器上颜料的,因此这个方法完成后才会去调用前面 changeSize 和 RanderScene函数),然后确定三个顶点的坐标,建立三角形容器,复制坐标数据,最后建立完成。
至此,调用 glutMainLoop() 加入循环。
特别注意:
- changeSize、RanderScene、setupRC 这三个方法是要写在 main 函数之前的,因为 OpenGL 是面向过程编程,否则编译报错。
- changeSize、RanderScene、setupRC 这三个方法的名称是可以自定义的。