基本概念一览

  • OpenGL: PC图形图像渲染处理,主要针对MAC、windows平台

  • OpengGL ES: ES是嵌入式的意思,主要针对移动端(IOS、安卓)

  • OpenCV: 主要是识别(人脸识别、身份识别、物体 -> OpenCV, face++)主要是与人工智能结合

  • Metal: 苹果底层使用的,在2018年前苹果底层渲染部分->CoreAnimation -> 基于OpenGL ES 封装的上层框架;2018年以后底层渲染迁移到Metal

  • 图形API解决了哪些问题:

    • 系统的按钮、图片、视图、图层等渲染都是通过图形API来完成的
    • 游戏引擎-> 人物、场景的渲染
    • 视频播放的框架 -> ijkplayer,kxmovie,视频解码 -> 渲染
    • 核心动画 -> 动画操作(旋转、缩放、移动、图层特效)
    • 视频、图片等特效
  • 上下文(context):

    • 应用程序调用任何OpenGL指令之前,需要安排首先创建一个OpengGL的上下文。这个上下文是一个非常庞大的状态机,保存了OpengGL中的各种状态,这也是OpenGL执行指令的基础
    • OpenGL的函数不论在哪个语言中,都是类C语言一样的面向过程函数,本质上都是对OpenGL上下文这个庞大的状态机中的某个状态或者对象进行操作,当然你得先把这个对象设置为当前对象。因此,通过对OpenGL指令的封装,是可以把OpenGL的相关调用封装成为一个面向对象的图形API的
    • 由于OpenGL上下文是一个巨大的状态机,切换上下文往往会产生较大的开销,但是不同的绘制模块,可能需要使用完全独立的状态管理。因此,可以在应用程序中分别创建多个不同的上下文,在不同的线程中使用不同的上下文,上下文之间共享纹理、缓冲区等资源。这样的方案,会比反复切换上下文,或者大量修改渲染状态更加合理高效。
  • OpenGL状态机:

    • 理论上是一个机器,其实可以这么理解,状态机描述了一个对象在其生命周期内所经历的各种状态,状态机描述了一个对象在其生命周期内所经历的各种状态,状态间的转变,发生转变的动因,条件及转变中所执行的活动。或者说,状态机是一种行为,说明对象在其生命周期中相应事件所经历的状态序列以及对那些状态事件的相应
    • 有记忆功能,能记住其当前的状态
    • 可以接收输入,根据输入的内容和自己的原先的状态,修改自己当前的状态,并且可以有对应的输出
    • 当进入特殊状态(停机等)的时候,便不再接收输入,停止工作
  • 渲染(Rendering): 将图形、图像数据转换成2D空间图像的操作叫渲染

    • 图片、按钮、视频 -> 解码图片 - > 渲染
  • 顶点数组(VertexArray)| 顶点缓冲区: OpenGL中的图像都是由图元组成的,在OpenGL ES中有3中类型的图元:点、线、三角形。那这部分图元数据是如何存储的呢?开发者可以选择设定函数指针,在调用绘制方法的时候,直接由内存传入顶点数据,也就是说这部分数据之前是存储在内存当中,被称为顶点数组。而性能更高的做法是,提前分配一块显存,将顶点数据预先传入到显存当中。这部分显存就被称为顶点缓冲区

  • 位图: 比如我们120120像素的图片 = 14400 像素 ,然后每个像素又包含RGBA 每个位置8个字节总共 4位 所以 144004 的纹理,纹理就是位图

  • 管线(流水线):其实就是一个制作的过程,分为固定管线和可编程管线

    • 固定管线:对象非常多固定的模具(固定着色器)-> 结果(OpenGL 固定的画面)
    • 可编程管线:可自定义的着色器,相当于个人定制的模块
  • 着色器: 其实就是 函数、方法或者代码段 -> CPU使用 ;shader代码段 -> GPU来调用

    • 渲染过程中,必须存储两种着色器,分别是顶点着色器和片元着色器。顶点着色器是第一个着色器,片元着色器是对最后一个。顶点着色器处理顶点,片元着色器处理其他像素点的颜色。

    • 顶点着色器:用来处理顶点相关的代码:1.确定位置 2.缩放、平移、旋转等位置换算 3.手机端显示3D屏幕实际是2D,3D图形数据 -> 2D(投影换算) -> OpenGL ES

    • 片元着色器:是处理一个一个像素点的,GPU并行运算,比如图片进行饱和度调整,那么就是片元着色器进行一个一个像素点的修改 ,因为GPU是并发运算,所以效率会很高。

    • 固定着色器:苹果提供的固定API,固定代码片段,调用参数生成,OpenGL来提供

    • 自定义着色器:进行自定义(基于GLSL语法来进行编写的代码段)

  • GLSL 是一种语言,自定义着色器的语言(代码),OpenGL标准调用GPU

  • 光栅化(Rasterization): 是把顶点数据转换为片元的过程,片元中的每一个元素对应帧缓冲区中的一个像素,分为两个过程,都不可控制也不可编程

    • 第一个过程:确定图形的像素范围(决定窗口坐标中哪些整形栅格区域被基本图元占用)
    • 第二个过程:颜色附着上去(分配一个颜色值和一个深度值到各个区域)
    • 光栅化过程是产生片元的过程
  • 纹理: 纹理其实就是位图,也可以理解为图片,大家在渲染图形的时候需要在其编码填充图片,为了使得场景更加逼真,而这里使用的图片就是常说的纹理,但是在OpenGL,我们更加习惯叫纹理而不是图片。

  • 混合(Blending): 在测试阶段之后,如果像素依然没有被剔除,那么像素的颜色将会和帧缓冲区中颜色附着上的颜色进行混合,混合的算法可以通过OpenGL的函数进行制定,但是OpenGL提供的缓和算法是有限的,如果需要更加复杂的缓和算法,一般可以通过像素着色器进行实现,当然性能会比原生的混合算法差一些。

  • 变换矩阵(Transformation): 图形想发生平移、缩放、旋转变换等,就需要使用变换矩阵

  • 投影矩阵(Projection): 用于将3D坐标转换为二维屏幕坐标,实际线条也将在二维坐标下进行绘制。

  • 渲染上屏: 如果将图像直接渲染到窗口对应的渲染缓冲区,则可以将图像显示到屏幕上。值得注意的是,如果每个窗口只有一个缓冲区,那么在绘制的过程中屏幕进行了刷新,窗口可能显示出不完整的图像,为了解决这个问题,常规的OpengGL程序至少都会有两个缓冲区。显示在屏幕上的称为屏幕缓冲区,没有显示的称为离屏缓冲区,在一个缓冲区渲染完成之后,通过将屏幕缓冲区和离屏缓冲区交换,实现图像在屏幕上的显示。

    • 由于显示器的刷新是逐行进行的,因此为了防止交换缓冲区的时候屏幕上下区域的图像分属于两个不同的帧信号,因此交换一般会等待显示器刷新完成的信号,在显示器两次刷新的间隔中进行交换,这个信号被称为垂直同步信号,这个技术被称为垂直同步。这个就是双缓冲区技术。
    • 在双缓冲区和垂直同步技术之后,由于总是要等待缓冲区交换之后再进行下一帧的渲染,使得帧率无法完全达到硬件允许的最高水平。为了解决这个问题,引入了三缓冲区技术,在等待垂直同步的同时来回交替两个离屏的缓冲区,而垂直同步发生时,屏幕缓冲区和最近渲染完成的离屏缓冲区交换,实现充分利用硬件性能的目的。

MAC环境和项目搭建

准备资源

创建工程

创建macos工程

删除部分类

创建main.cpp文件

此处不勾选

将准备资源拖入到工程中

将 LibGLTool.a文件拖到framework文件夹下

导入必要的库 OpenGI.framework 和 GLUT.framework

复制以下代码到main文件中:

#include "GLShaderManager.h" #include "GLTools.h" #include <GLUT/GLUT.h> //定义一个,着色管理器 GLShaderManager shaderManager; //简单的批次容器,是GLTools的一个简单的容器类。 GLBatch triangleBatch; /*

在窗口大小改变时,接收新的宽度&高度。

*/ void changeSize(int w,int h) {

    glViewport(00, w, h);

} void RenderScene(void) {

    //1.清除一个或者一组特定的缓存区     glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT|GL_STENCIL_BUFFER_BIT);

    //2.设置一组浮点数来表示红色     GLfloat vRed[] = {1.0,0.5,0.0,1.0f};

    //传递到存储着色器,即GLT_SHADER_IDENTITY着色器,这个着色器只是使用指定颜色以默认笛卡尔坐标第在屏幕上渲染几何图形     shaderManager.UseStockShader(GLT_SHADER_IDENTITY,vRed);

    //提交着色器     triangleBatch.Draw();

    //将后台缓冲区进行渲染,然后结束后交换给前台     glutSwapBuffers();

} void setupRC() {

    //设置清屏颜色(背景颜色)     glClearColor(0.98f0.90f0.3f1);

    //没有着色器,在OpenGL 核心框架中是无法进行任何渲染的。初始化一个渲染管理器。     //在前面的课程,我们会采用固管线渲染,后面会学着用OpenGL着色语言来写着色器     shaderManager.InitializeStockShaders();

    //指定顶点     //在OpenGL中,三角形是一种基本的3D图元绘图原素。     GLfloat vVerts[] = {

        -0.5f,0.0f,0.0f,

        0.5f,0.0f,0.0f,

        0.0f,0.5f,0.0f     };

    triangleBatch.Begin(GL_TRIANGLES, 3);

    triangleBatch.CopyVertexData3f(vVerts);

    triangleBatch.End();

} int main(int argc,char *argv[]) {

    //初始化GLUT库,这个函数只是传说命令参数并且初始化glut库     glutInit(&argc, argv);

    /*

    初始化双缓冲窗口,

    */     glutInitDisplayMode(GLUT_DOUBLE|GLUT_RGBA|GLUT_DEPTH|GLUT_STENCIL);

    //GLUT窗口大小、窗口标题     glutInitWindowSize(800600);

    glutCreateWindow("Triangle");

    /*

    GLUT 内部运行一个本地消息循环,拦截适当的消息。然后调用我们不同时间注册的回调函数。

    */     //注册重塑函数     glutReshapeFunc(changeSize);

    //注册显示函数     glutDisplayFunc(RenderScene);

    /*

    初始化一个GLEW库,确保OpenGL API对程序完全可用。

    在试图做任何渲染之前,要检查确定驱动程序的初始化过程中没有任何问题

    */     GLenum status = glewInit();

    if (GLEW_OK != status) {

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

        return 1;

    }

    //设置我们的渲染环境     setupRC();

    glutMainLoop();

    return  0;

}

运行即可看到macos的app显示出一个三角形:


推荐

视频学习:

OpenGL ES