带有 OpenGL ES 和 Kotlin 的 Android 图像编辑器 - 第 1 部分

几十年来,OpenGL 是使用最广泛的图形API之一。在本文中,我们将学习如何在 Android 应用程序中使用 OpenGL ES。

在开始之前,我想区分OpenGL和OpenGL ES之间的不同。为什么 Android 使用OpenGL ES 而不是 OpenGL?ES是什么意思?

OpenGL 代表开放图形库,而ES意味着嵌入式系统。所以 OpenGL ES 意味着嵌入式系统的 OpenGL。Android 是一个非常紧凑并是最小的操作系统,它不能像计算机(或游戏计算机)那样进行计算或处理繁重的计算。

更多的版本,OpenGL ES比OpenGL的功能少,所以一些在OpenGL上运行的功能可能无法在ES版本上工作。不过别担心,它具备创建一个完整的 3D 游戏的一切功能,且非常酷。

安卓兼容性

OpenGL ES 1.0 从 Android 1.0 开始添加,OpenGL ES 2.0 也包含在 Android 2.2 中。你可以在此处找到文档。

在本教程中,我们将选择OpenGL ES 2.0,因为它看起来很稳定。

我们接下来要做什么?

在本博客中,我将指导你完成制作一个照片编辑器应用程序的整个过程,该应用程序具有一些基本功能,例如过滤器、文本叠加,并向你展示如何将其保存为位图,即可以将其保存到文件中或做任何我们想做的事情。

如果你是从 Google OpenGL 文档来的,感到不知所措,别着急,虽然这些文档对于初学者来说太旧且难以理解,但这并不意味着它没有用。

谁适合阅读这篇文章?

在向下阅读这篇文章之前,我希望你掌握一些OpenGL的工作原理,但如果你想偷懒,那问题也不大。

当然,如果你不擅长 Kotlin/Java 和 Android,那你务必得对 Kotlin/Java 和 Android 有一些基本的了解。

什么是 Android 上的 OpenGL?

需要明确的是,OpenGL不是一个库或我们可以看到类似其源代码的东西。它只是一个规范,其代码已由 Nvidia 或 AMD 等制造商在 GPU 中实现,开放这个词并不等同于开源。

为了创建 OpenGL,我们需要 EGL 和一个线程。那么上下文和 EGL是什么?

OpenGL 上下文是我们可以调用 OpenGL 函数的地方。OpenGL 上下文绑定到一个线程中,因此如果你有一个具有该上下文的线程,但是你像主线程一样在不同的线程中调用 OpenGL 函数,那它根本无法工作。

在Android中,我们使用EGL来创建和配置OpenGL上下文;然而,在像 C/C++ 这样的不同平台上,我们还有别的东西。由Khronos Group维护的EGL 和 OpenGL 。

但为什么是 OpenGL?

它是使用最广泛的图形 API 之一,因此它有丰富的文档和教程,几乎所有设备都使用它。

为什么我们需要在 GPU 上进行图像处理?答案是 GPU 非常擅长计算图形相关的东西。它经过高度优化和创建,可以完成诸如颜色处理之类的 CPU 难以实现的任务。

关键词

  • 着色器— 一个 OpenGL 程序。
  • 顶点着色器——用于绘制每个顶点的代码。如果我们有 5 个顶点,它将运行 5 次。
  • 片段着色器- 又名Pixel Shader— 是运行形状内每个像素的代码。我们用它进行多种操作,比如处理图像的颜色。
  • GLSL(着色语言)——OpenGL使用的一种编程语言。
  • 纹理—可以将 2D 纹理发送到着色器以显示在屏幕上,它可以是图像。
  • SurfaceTexture — 这是一种纹理!但它是一个对象,而纹理只是一个Integer。
  • 表面— OpenGL 绘制的对象。它就像一张纸,而 OpenGL 是一支笔。
  • ByteBuffer — 用于将字节数组从 JVM 内存传输到 CPU 内存。
  • FloatBuffer — 用于将浮点数组从 JVM 内存传输到 CPU 内存。
  • EGLSurface — OpenGL 绘制的表面,但它已在屏幕外完成,然后将其发送到表面。
  • EGLContext — 包含 OpenGL 配置的上下文
  • SwapBuffers — 将数据从 GPU 传输到屏幕或Surface 的过程。
  • 帧缓冲区— OpenGL 渲染并交换到屏幕或表面的地方。这可以用来在屏幕外绘制一些东西。

创建一个 OpenGL 窗口

我们有两个选项可以创建一个OpenGL窗口来显示屏幕上绘制的内容。第一个简单的选择是使用从SurfaceView扩展的GLSurfaceView。然而,SurfaceView不是像TextureView这样的简单视图,所以我们不能在SurfaceView之上覆盖其他视图,这使得它有弊端。因此,我们将使用TextureView,但我们没有在 Android 框架中内置GLTextureView,因此我们必须自己制作。通过这样做,你将更多地了解如何从头开始使用 OpenGL。

在创建GLTextureView之前,我们需要一个叫做 EGLContext 的东西,它将我们的 TextureView 连接到 GPU,那就开始吧。

  1. 创建 EGL 上下文
  2. 创建 EGLSurface
  3. 将我们的 SurfaceTexture 附加到 EGLContext
  4. MakeCurrent () EGLSurface
  5. 创建 EGL 线程
  6. 准备在屏幕上画一些图案

OpenGL ES 中的着色器

OpenGL ES 中有很多着色器,但在这种情况下,我们只能使用两个着色器,即顶点着色器和片段着色器(像素着色器)。

让我们通过画几个形状来清楚它的作用。

坐标系

它的坐标系是从-1.0 到 1.0,因此不会绘制大于此值的内容。

1__XeTiriTb9-08JqFi0O59A
OpenGL坐标系

请记住,OpenGL 只能绘制三角形,因此当我们想要绘制其他东西时,我们必须将一堆三角形组合在一起以获得我们想要的形状。我来给你解释一下!

1__3zFtwDgOEflI4E4NEYQMQ
一个三角形

因此,为了绘制一个矩形,我们必须将两个相同的三角形组合在一起,如下图所示。

1_gAwpVqbe6e8yiLNb7ZwKfA
两个三角形组成一个长方形

我们得到了一个矩形。希望我的解释对你有所帮助。请注意,每个三角形上的颜色只是一种视觉表示。在实际应用中,我们可以按照我们想要的方式设置它的颜色。(那是片段着色器的工作)

原文作者 Seanghay

原文链接 https://seanghay.com/image-editor-in-android-with-opengl-es-and-kotlin-part-1-fcd3cc03da44

推荐阅读
相关专栏
音视频杂谈
161 文章
本专栏仅用于分享音视频相关的技术文章,与其他开发者和声网 研发团队交流、分享行业前沿技术、资讯。发帖前,请参考「社区发帖指南」,方便您更好的展示所发表的文章和内容。