相关目录:

1. OpenGL--图形API简介
2. OpenGL--相关名词解释
3. OpenGL--环境配置
4. OpenGL--案例1-绘制一个三角形
5. OpenGL--案例2-绘制正方形
6. OpenGL--图像撕裂
7. OpenGL--3D数学相关(向量和矩阵)
8. OpenGL--矩阵变换和矩阵堆栈

本次内容我们一起来看一下 图像撕裂 产生的原因, 以及为了降低发生概率是采用何种方案来进行优化的。

相关概念

在开始进行探讨之前, 先来了解一下 CPU 和 GPU 到底是什么, 都是用来做什么的, 还有 GPU 和 显卡 是同一个东西吗。

CPU

• CPU (中央处理器) , 是电子计算机的主要设备之一, 电脑中的核心配件。
• 在计算机体系结构中, CPU 是对计算机所有硬件资源 (存储器、输入输出单元等) 进行控制调配、执行通用运算的核心硬件。 计算机系统中的所有软件层的操作, 最终都会通过指令集映射为 CPU 的操作。
• CPU 的位数一般为 32位 或者 64位, 位数就是处理器能够一次性计算的浮点数的位数。通常情况下位数越高, 运算的速度也就会越快。
• CPU主要是负责多任务管理、调度，它是领导者，负责指挥。

GPU 与 显卡

• GPU (图像处理芯片), 外表与 CPU 相似。
• GPU 是显卡的核心, GPU、显存、电路板 和 BIOS 固件一起组成了 显卡, 所以 GPU 并不等同于 显卡。
• GPU主要是用于大量的重复计算，它是计算专家，但协议、管理不是它的专长。它的计算执行能力很强。
• 显卡 也叫显示适配器, 分为 独立显卡 和 集成显卡。独立显卡主要由 GPU、显存和接口电路组成, 而集成显卡没有独立显存(使用主板上的内存)。
• 独立显卡 和 集成显卡 都是有 GPU 的。

图像撕裂

图像撕裂

帧

帧--相当于电影胶片上的每一格镜头, 一帧就是一幅静止的画面, 连续的帧一起就形成了动画等。我们通常说的 帧数 就是在 1 秒钟 内传输的图片的帧数, 也可以理解为GPU(图形处理器) 每秒钟能够刷新几次, 通常用 FPS (Frames Per Second) 来表示。

每一帧都是一个静止的图像, 这些图像快速的连续显示变形成了运动的假象 (类似于小时候玩的那个翻页的小人书) 。高帧率 (个人理解, 实现一个动画需要的帧数) 可以得到更流畅、更逼真的动画。每秒的帧数 (FPS) 越多, 显示的动作就会越流畅。

屏幕显示图像的原理

屏幕显示图像原理(图片源自网络)

为了更容易理解, 这里以 CRT 显示器进行说明。为了显示图像, CRT 显示器的电子枪按照上图的方式, 从上到下进行逐行扫描, 全部扫描完成后显示器就会呈现出 1 帧画面, 随后电子枪会回到初始位置继续下一次扫描。

为了把显示器的显示过程和系统的视频控制器进行同步，显示器（或者其他硬件）会用硬件时钟产生一系列的定时信号。当电子枪换到新的一行，准备进行扫描时，显示器会发出一个水平同步信号（horizonal synchronization），简称 HSync；而当一帧画面绘制完成后，电子枪回复到原位，准备画下一帧前，显示器会发出一个垂直同步信号（vertical synchronization），简称 VSync。

显示器通常以固定频率进行刷新，这个刷新率就是 VSync 信号产生的频率。尽管现在的设备大都是液晶显示屏了，但原理仍然没有变。

CRT 显示器, 学名为“阴极射线显像管”，是一种使用阴极射线管（Cathode Ray Tube）的显示器。CRT显示器是靠电子束激发屏幕内表面的荧光粉来显示图像的，由于荧光粉被点亮后很快会熄灭，所以电子枪必须循环地不断激发这些点。跟兴趣的可以去网上搜一下, 就是老式的大头显示器。

图像显示过程

图像显示过程 (图片源自网络.)

1. CPU 计算好要显示的内容然后提交到 GPU
2. 经过 GPU 渲染完成后, 渲染的结果会放入到 帧缓冲区 (FrameBuffer)
3. 视屏控制器逐行读取帧缓冲区的数据, 经过可能的 数模转换 传递给显示器进行显示

撕裂原因 和 垂直同步

在最初的时候, 帧缓冲区只有一个, 这种情况下帧缓冲区的 读取 和 刷新 都会有比较大的效率问题。

1. 双缓冲区

为了解决效率问题, 显示系统后来引入两个缓冲区, 也就是 双缓冲机制 。这种情况下, GPU 会首先渲染好一阵放入到一个缓冲区内让视频控制器去读取, 当下一帧渲染好之后, GPU 会直接把 视频控制器 的指针指向 第二个缓冲区。这样一来效率得到了很大的提升。

2. 画面撕裂

双缓冲区解决了之前单缓冲区的效率问题, 但是又引入了一个新的问题。当视频控制器还没有读取完成时, 也就是屏幕内容还没有显示完成 1 帧画面时, GPU 又将新的一帧内容提交到 帧缓冲区 并且把两个缓冲区进行交换。这时候视频控制器就会把新的 1帧 画面的后半段读取显示到屏幕上, 这就造成了我们开头的图片上的 撕裂现象。

3. 垂直同步

为了解决双缓冲区造成的撕裂问题, GPU 又引入了一个新的机制 垂直同步 (简写 V-Sync) 。当开启垂直同步后, GPU 会等待显示器的 垂直信号(VSync) 发出后, 再去进行新的一帧的渲染和缓冲区更新。这样就解决了 画面撕裂现象, 也增加了画面的流畅度。但是需要消耗更多的计算资源, 也会带来部分延迟。

总结

以上就是关于画面撕裂的全部内容, 如果有不对的地方或者不懂的地方欢迎在下方留言。 说到画面撕裂很多人可能还会想到 界面卡顿 和 离屏渲染问题, 关于这两个问题将会在以后再进行探讨, 感谢~

和谐学习, 不急不躁~