openGL ES实战——初识openGL ES

今日名言

如果认为一个人是这样的，那么就会想尽一切办法证明这是对的 ——关于猜疑与不信任

一、简介

OpenGL（英语：Open Graphics Library，译名：开放图形库或者“开放式图形库”）是用于渲染2D、3D矢量图形的跨语言、跨平台的应用程序编程接口（API）

OpenGL ES (全称：OpenGL for Embedded Systems，是OpenGL 的子集) 是针对手机 PAD等小型设备设计的，删减了不必须的方法、数据类型、功能，减少了体积，优化了效率

1. OpenGL ES版本

目前主要版本有1.0/1.1/2.0/3.0/3.1

• 1.0：Ａndroid 1.0和更高的版本支持这个API规范

• 2.0：不兼容 OpenGL ES 1.x。Android 2.2(API 8)和更高的版本支持这个API规范

• 3.0：向下兼容 OpenGL ES 2.x。Android 4.3(API 18)及更高的版本支持这个API规范

• 3.1：向下兼容 OpenGL ES3.0/2.0。Android 5.0（API 21）和更高的版本支持这个API规范

​ 2.0 版本是 Android 目前支持最广泛的版本，后续主要以该版本为主，进行介绍和代码编写。

2. 术语解释

Open Graphics Library

​ 图形领域的工业标准，是一套跨编程语言、跨平台的、专业的图形编程(软件)接口。它用于二维、三维图像，是一个功能强大，调用方便的底层图形库。
​ 与硬件无关。可以在不同的平台如Windows、Linux、Mac、Android、IOS之间进行移植。因此，支持OpenGL的软件具有很好的移植性，可以获得非常广泛的应用。

GLSurfaceView
继承至SurfaceView，它内嵌的surface专门负责OpenGL渲染。

• 管理Surface与EGL
• 允许自定义渲染器(render)。
• 让渲染器在独立的线程里运作，和UI线程分离。
• 支持按需渲染(on-demand)和连续渲染(continuous)。

二、OpenGL的绘制流程

一句话概括就是将几何信息转换成一个个的栅格组成的图像的过程。

1. 获取顶点数据，然后将顶点数据传递给顶点着色器，确定图元顶点位置
2. 进行图元装配
3. 光栅化
4. 片元着色器处理光、阴影等对图像的影响，从而进行颜色填充，然后对每个片元进行处理，最后帧缓存。

三、OpenGL的坐标系

• OpenGL ES世界坐标
  通过名字就可以知道，这是OpenGL自己世界的坐标，是一个标准化坐标系，范围是 -1 ～ 1，原点在中间。

• OpenGL ES纹理坐标
  纹理坐标，其实就是屏幕坐标，标准的纹理坐标原点是在屏幕的左下方，而Android系统坐标系的原点是在左上方的。这是Android使用OpenGL需要注意的一个地方。
  纹理坐标的范围是 0 ～ 1。

两者的关系

世界坐标，是用于显示的坐标，即像素点应该显示在哪个位置由世界坐标决定。

纹理坐标，表示世界坐标指定的位置点想要显示的颜色，应该在纹理上的哪个位置获取。即颜色所在的位置由纹理坐标决定。

两者之间需要做正确的映射，才能正常的显示一张画面。

四、Shader着色器

• 着色器（Shader）是运行在GPU上的小程序
• 顶点着色器
  - 如何处理顶点、法线等数据的小程序
• 片元着色器
  - 如何处理光、阴影、遮挡、环境等等对物体表面的影响，最终生成一副图像的小程序

简单理解：其实就是对应了以上两个坐标系：顶点着色器对应世界坐标，片元着色器对应纹理坐标。

五、OpenGL 着色器语言 GLSL

OpenGL着色语言（OpenGL Shading Language）

1. 数据类型

float 浮点型
vec2 含有两个浮点型数据的向量
vec4 含有四个浮点型数据的向量
sampler2D 2D纹理采样器（代表一层纹理）

2. 修饰符

attribute 属性变量。只能用于顶点着色器中。 一般用该变量来表示一些顶点数据，如：顶点坐标、纹理坐标、颜色等。
uniforms 一致变量。在着色器执行期间一致变量的值是不变的。与const常量不同的是，这个值在编译时期是未知的是由着色器外部初始化的。
varying 易变变量。是从顶点着色器传递到片元着色器的数据变量。

3. 内建函数

texture2D (采样器 坐标) 采样指定位置的纹理
texture2D(采样器，采样点的坐标)

4. 内建变量

顶点着色器
gl_Position vec4 顶点位置
gl_PointSize：点的大小，没有赋值则为默认值1

片元着色器
gl_FragColor vec4 颜色

5. 其他

precision lowp 低精度
precision mediump 中精度
precision highp 高精度

例子：

// 把顶点坐标给这个变量， 确定要画画的形状
attribute vec4 vPosition;
//接收纹理坐标，接收采样器采样图片的坐标
attribute vec4 vCoord;
//变换矩阵， 需要将原本的vCoord（01,11,00,10） 与矩阵相乘 才能够得到 surfacetexure(特殊)的正确的采样坐标
uniform mat4 vMatrix;
//传给片元着色器 像素点
varying vec2 aCoord;
void main(){
    //内置变量 gl_Position ,我们把顶点数据赋值给这个变量 opengl就知道它要画什么形状了
    gl_Position = vPosition;
    // 进过测试 和设备有关
    aCoord = (vMatrix * vCoord).xy;
    //aCoord =  vec2((vCoord*vMatrix).x,(vCoord*vMatrix).y);
}

#extension GL_OES_EGL_image_external : require
//SurfaceTexture比较特殊
//float数据是什么精度的
precision mediump float;
//采样点的坐标
varying vec2 aCoord;
//采样器
uniform samplerExternalOES vTexture;
void main(){
    //变量 接收像素值
    // texture2D：采样器 采集 aCoord的像素
    //赋值给 gl_FragColor 就可以了
    gl_FragColor = texture2D(vTexture,aCoord);
}