美文网首页OpenGL
四、iOS中图形图像渲染技术栈及流水线

四、iOS中图形图像渲染技术栈及流水线

作者: 小山93 | 来源:发表于2020-07-06 00:14 被阅读0次

    1. 图形渲染框架

    下图为 iOS APP 图形渲染框架, APP 在显示可视化的图形时,使用到了 Core AnimationCore GraphicsCore Image 等框架,这些框架在渲染图形时,都需要通过 OpenGL ES / Metal 来驱动 GPU 进行渲染与绘制。

    iOS图形渲染框架.png

    1.1. UIKit

    UIKitiOS开发者最常用的框架,里面提供了UIView
    UIView供开发者用来:

    • 显示界面(借助于CALayer)
    • 布局子视图
    • 处理用户交互事件(继承自 UIResponder)。

    1.2. Core Animation

    Core Animation源自于 Layer Kit, 是一个复合引擎,主要职责包含渲染(CALayer)、构建和实现动画。CALayer是用户所能在屏幕上看到一切的基础。

    1.3. Core Graphics

    Core Graphics是基于Quartz 的高级绘图引擎,主要用于运行时绘制图像。其功能有绘制路径、颜色管理、渐变、阴影、创建图像、图像遮罩、PDF文档创建显示及分析。

    1.4. Core Image

    Core Image 拥有一系列现成的图像过滤器,可以对已存在的图片进行高效处理。大部分情况下,``Core Image ``` 是在GPU中完成工作,如果GPU忙,会使用CPU进行处理。

    2. 三个框架间的依赖关系

    Core AnimationCore GraphicsCore Image这个三个框架间也存在着依赖关系。

    上面提到CALayer是用户所能在屏幕上看到一切的基础。所以Core GraphicsCore Image是需要依赖于CALayer来显示界面的。由于CALayer又是Core Animation 框架提供的,所以说Core GraphicsCore Image是依赖于``Core Animation ```的。

    上文还提到每一个 UIView 内部都关联一个 CALayer图层,即backing layer,每一个 CALayer都包含一个content属性指向一块缓存区,即backing store, 里面存放位图(Bitmap)。iOS中将该缓存区保存的图片称为寄宿图
    这个寄宿图有两个设置方式:

    • 直接向content设置CGImage图片,这需要依赖Core Image来提供图片。
    • 通过实现UIViewdrawRect方法自定义绘图,这需要借助 Core Graphics来绘制图形,再由CALayer生成图片。
      框架间的依赖关系.png

    3. Core Animation 流水线

    CALayer 是如何调用 GPU 并显示可视化内容的呢?下面我们就需要介绍一下 Core Animation 流水线的工作原理。

    渲染流水线

    事实上,app 本身并不负责渲染,渲染则是由一个独立的进程负责,即 Render Server 进程。

    App 通过 IPC 将渲染任务及相关数据提交给 Render ServerRender Server 处理完数据后,再传递至 GPU。最后由 GPU 调用 iOS 的图像设备进行显示。

    Core Animation 流水线的详细过程如下:

    • 首先,由 app 处理事件(Handle Events),如:用户的点击操作,在此过程中 app 可能需要更新 视图树,相应地,图层树 也会被更新。
    • 其次,app 通过 CPU 完成对显示内容的计算,如:视图的创建、布局计算、图片解码、文本绘制等。在完成对显示内容的计算之后,app 对图层进行打包,并在下一次 RunLoop 时将其发送至 Render Server,即完成了一次 Commit Transaction 操作。
    • Render Server 主要执行 Open GL、Core Graphics 相关程序,并调用 GPU
    • GPU 则在物理层上完成了对图像的渲染。
    • 最终,GPU 通过 Frame Buffer、视频控制器等相关部件,将图像显示在屏幕上。

    对上述步骤进行串联,它们执行所消耗的时间远远超过 16.67 ms,因此为了满足对屏幕的 60 FPS 刷新率的支持,需要将这些步骤进行分解,通过流水线的方式进行并行执行,如下图所示。

    渲染流水线并行执行.png

    Commit Transaction

    在 Core Animation 流水线中,app 调用 Render Server 前的最后一步 Commit Transaction 其实可以细分为 4 个步骤:

    • Layout:主要进行视图构建,包括:LayoutSubviews 方法的重载,addSubview: 方法填充子视图等。
    • Display:视图绘制,这里仅仅是绘制寄宿图,该过程使用CPU和内存
    • Prepare:阶段属于附加步骤,一般处理图像的解码和转换等操作
    • Commit:主要将图层进行打包,并将它们发送至 Render Server。该过程会递归执行,因为图层和视图都是以树形结构存在。

    参考文章:iOS 图像渲染原理

    相关文章

      网友评论

        本文标题:四、iOS中图形图像渲染技术栈及流水线

        本文链接:https://www.haomeiwen.com/subject/iznvqktx.html