简介
视频的渲染源是 YUV 或者 RGBA 格式的数据,这种数据是描述画面最基础的格式,其中 YUV 常用在视频的原始格式中,RGBA 常用在一些图像的原始格式上。
目前各个平台最终渲染到屏幕上的都是 RGBA 格式的,因为硬件对屏幕上的设计就是按照每个像素点分为四个子像素来实现的,所以 YUV 和 RGBA 之间是可以互相转换的。
平台上层的 API
Android 平台在 SDK 层提供了 Canvas 和 Paint 的 API 接口,便于开发者将位图(Bitmap)绘制到系统的屏幕上,常用于一些复杂的自定义 View 的实现,也可以再结合 SurfaceView 或者 TexureView,将绘制线程从主线程中独立出来进行渲染,满足基本的绘图实现。
iOS 平台的 SDK 层也提供了 Quartz 2D 把位图(Bitmap)绘制到屏幕上,在一些自定义 View 以及获取 snapshot 的场景下使用。这种方式的优点是各自平台的开发者使用起来非常简单,无需了解更深层次的绘图原理就能做一些简单的图形图像处理,也可以利用系统提供的一些 API 进行各种变换、阴影以及渐变的处理。缺点也比较明显,需要各个平台独立书写自己平台代的码进行渲染绘制,并且当需要一些高级处理和更高性能的时候,就会捉襟见肘,比如视频的美颜、跟脸贴纸以及一些视频编辑的处理等。
跨平台的 OpenGL ES
在移动设备上,各个平台提供了更加底层的图形绘制接口,就是众所周知的 OpenGL ES。它天生就是为了跨平台而设计的,在跨平台方面具有独特的优势,由于是最底层的图形绘制接口,所以在性能以及图形的高级处理方面也都没有任何问题。缺点其实也很明显,就是掌握这项技术的学习成本是比较高的,不单单要了解 OpenGL ES 的各种概念,并且还要为不同平台创建自己的上下文环境,同时还得掌握 OpenGL 自己的编程语言 GLSL 的语法和运行机制。
平台提供的最新技术
Android 在 10.0 系统之后开始支持 Vulkan,Vulkan 是用于高性能 3D 渲染的渲染方法,是 Khronos Group 组织开发的新一代 API,用于替换掉 OpenGL,所以天生也是跨平台的,支持 Windows、Linux、Android,还有 iOS 和 Mac 平台,只不过在 iOS 平台上底层是 MoltenVK 来实现的。
由于这项渲染技术是 OpenGL 的下一代,所以渲染性能方面是非常好的,并且在模块化角度也更好一些。但是有两个缺点,一是对现有的渲染系统做大规模的迁移,没有特别友好的方案;另外一个就是对于普通的开发人员来讲,上手难度比较高。但总的来说,未来它将成为用于专业图形图像渲染引擎的底层技术。
同样 iOS 平台提供了 Metal 来作为 OpenGL 的替代者,在 iOS12 系统之后弃用 OpenGL ES,系统的一些框架全面改成默认 Metal 支持。由于 Metal 的设计和 OpenGL 比较类似,开发者上手难度并不大,绘制性能也有比较明显的提升,主要缺点是跨平台性比较差。
OpenGL ES
OpenGL 的全称是 Open Graphics Library,它用于二维或三维图像的处理与渲染,是一个功能强大、调用方便的底层图形库。它定义了一套跨编程语言、跨平台编程的专业图形程序接口。而 OpenGL ES(OpenGL for Embedded Systems)是它在嵌入式设备上的版本,这个版本是针对智能手机等嵌入式设备设计的,可以理解为是 Open GL 的一个子集。
目前,OpenGL 的最新版本已经达到了 3.0 以上,由于兼容性以及现存渲染系统的架构,目前 OpenGL ES 2.0 还是使用最广泛的版本。所以我们就在 2.0 版本的基础上进行编程,来实现图像的处理与渲染。
上下文环境
由于 OpenGL 是基于跨平台设计的,所以每个平台需要自己提供渲染的基础实现,用来抹平各个系统本身的差异。就像我们常说 Java 语言是跨平台的,实际上是 JVM 抹平了各个平台的差异一样。每个平台提供渲染的基础实现,我们称之为 OpenGL 的上下文环境。另外在 OpenGL 的设计中,OpenGL 是不负责管理窗口的,窗口的管理也交由每个平台自己来完成。与上下文环境一样,窗口管理在每个平台也都有自己的实现。
具体来讲,作为 OpenGL ES 的上下文环境,iOS 平台为开发者提供了 EAGL,而 Android 平台(Linux 平台)为开发者提供了 EGL。所以如果想要让 OpenGL 程序运行在多个平台上,也要学会利用各个平台提供的 API 接口,为 OpenGL ES 创建出上下文环境。
除了了解 OpenGL ES 的各种上下文环境,这里我们还需要知道一个开源的跨平台多媒体开发库——SDL,它给开发人员提供了面向 SDL 的 API 编程,能够通过交叉编译这个库解决多平台下需要手动构建 OpenGL 上下文环境以及窗口管理的问题。但在移动端,这样的实现会让我们失去一部分更加灵活的控制,导致一些场景下的功能不能实现。因此我们这里不使用 SDL,而是通过裸用各个平台的 API 来构建 OpenGL 的上下文环境。
OpenGL(ES)的用途
要想了解 OpenGL ES 能做什么,就不得不提到一个开源项目——GPUImage。它的实现非常优雅、完备,尤其是在 iOS 平台,提供了视频录制、视频编辑、离线保存这些场景。
其中很重要的一部分就是内部滤镜的实现,在里面我们可以找到大部分图形图像处理 Shader 的实现,包括:
- 基础的图像处理算法:饱和度、对比度、亮度、色调曲线、灰度、白平衡等;
- 图像像素处理的实现:锐化、高斯模糊等;
- 视觉效果的实现:素描、卡通、浮雕效果等;
- 各种混合模式的实现。
除此之外,开发者也可以自己去实现美颜滤镜效果、瘦脸效果以及粒子效果等等。
GPUImage 框架是使用 OpenGL ES 中的 GLSL 书写出了上述的各种 Shader。GLSL(OpenGL Shading Language)是 OpenGL 的着色器语言,也是 2.0 版本中最出色的功能。开发人员可以使用这种语言编写程序运行在 GPU 上来进行图像处理或渲染。使用 GLSL 写的代码最终可以编译、链接成为一个 GLProgram。
一个 GLProgram 分为两部分,一是顶点着色器(Vertex Shader),二是片元着色器(Fragment Shader),这两部分分别完成各自在 OpenGL 渲染管线中的功能。
OpenGL 渲染管线
我们平时说的点、直线、三角形都是几何图元,是在顶点着色器中指定的,用这些几何图元创建的物体叫做模型,而根据这些模型创建并显示图像的过程就是我们所说的渲染。在渲染过程结束之后,图像就会以像素点的形式绘制到屏幕上了。
一张 RGBA 格式的图像在内存中是这样描述的:每四个 Byte 表示一个像素点的 RGBA 的数据,这些像素点可以被组织成一个大的一维数组,用来在内存中表述这张图片。那在显存中如何描述呢?
在显存中,这些像素点被组织成帧缓冲区(framebuffer),帧缓冲区保存了显卡为了控制屏幕上所有像素的颜色以及强度所需要的全部信息。