【源码解读】Android Opengl OES 纹理怎么渲染到 GL_TEXTURE_2D?

背景

在客户端中存在一种应用场景:需要将 MediaCodec 或者 Camera 产生的图像,通过 OpenGL 交给算法做特效,由于算法可能是基于普通的 Texture2D 纹理实现的,而 Android 上更常用的则是 GL_TEXTURE_EXTERNAL_OES 纹理,算法一般都是基于 OpenGL 而不是 OpenGLES 环境实现的,所以就需要客户端这边做一个转换工作。

这个转换工作当然最好是在 GPU 中能完成的,因为如果通过 CPU 从 OES 纹理中读出图像数据,再提交到 2D 纹理中,这一来一回,即浪费 CPU 页占有了内存,很不划算。所以就出现了这篇文章,如何利用 OpenGL 将 OES 纹理渲染到普通 2D 纹理上。

GL_TEXTURE_EXTERNAL_OES 纹理

外部 GLES 纹理 (GL_TEXTURE_EXTERNAL_OES) 与传统 GLES 纹理 (GL_TEXTURE_2D) 的区别如下:

  • 外部纹理直接在从 BufferQueue 接收的数据中渲染纹理多边形。
  • 外部纹理渲染程序的配置与传统的 GLES 纹理渲染程序不同。
  • 外部纹理不一定可以执行所有传统的 GLES 纹理活动。

外部纹理的主要优势是它们能够直接从 BufferQueue 数据进行渲染。在 Android 平台上,BufferQueue 是连接图形数据生产方和消费方的队列,也就表示 OES 纹理能直接拿到某些生产方产生的图形数据进行渲染。

OES Texture 渲染到 TEXTURE_2D

比如现在有个需求:使用 MediaCodec 解码视频,最终需要将解码的每一帧渲染到外部设置的一个 TEXTURE_2D 纹理上。

实现方案:MediaCodec 支持将解码结果输出到 Surface 中,我们可以通过构造一个绑定了 OES 纹理的 SurfaceTexture 来为 MediaCodec 构造一个输出 Surface。当解码结果写入到 Surface 的 BufferQueue 之后,再利用 SurfaceTexture 将结果从 BufferQueue 渲染到 OES 纹理上,然后再通过 OpegGL 管道流水线操作将 OES 纹理上的内容渲染到 TEXTURE_2D 纹理:

MediaCodec 解码到 Surface 伪代码如下:

oesTextureId = x
sTexture = SurfaceTexture(oesTextureId)
outputSurface = Surface(sTexture)
decoder.setOutputSurface(outputSurface)
复制代码

这里可以借鉴 grafika 中 Buffer 的生成和消费流程:

然后在参考了 grafika 的流程后设计的流程:

正如上图所示,从 TextureOES 到 Texture2D 的关键是利用 FBO(帧缓冲)。在执行 OpenGL 渲染之前,开始 FBO,渲染完成之后关闭 FBO。

帧缓冲实现

如果我们不额外设置 OpenGL 的帧缓冲,OpenGL 所有操作都将在默认帧缓冲的渲染缓冲上进行;如果我们激活了自己的帧缓冲,也就是在绑定到 GL_FRAMEBUFFER 目标之后,所有的读取和写入帧缓冲的操作将会影响当前绑定的帧缓冲。

所以这里的操作是:创建一个帧缓冲,将 Texture2D 纹理作为它的颜色缓冲,然后在利用 Shader 从 TextureOES 纹理上采样之前将这个帧缓冲设置为 OpenGL 上下文当前激活的帧缓冲。这样设置之后就相当于,将 TextureOES 采样到帧缓冲中,而帧缓冲背后又是 Texture2D,就间接的将 TextureOES 采样到了 Texture2D 上。


class DecodeFBO {

    private var mFrameBuffer = -1

    init {
        val tmp = IntArray(1)
        GLES30.glGenFramebuffers(1, tmp, 0)
        SLGLUtils.checkGlError("glGenFrameBuffer")
        mFrameBuffer = tmp[0]
    }

    /**
     * 绑定 FBO 到 Texture2D 纹理
     */
    fun begin(texture2D: Int) {
        GLES30.glBindFramebuffer(GLES30.GL_FRAMEBUFFER, mFrameBuffer)
        SLGLUtils.checkGlError("glBindFrameBuffer")

        //将纹理作为帧缓冲对象的颜色缓冲
        GLES30.glFramebufferTexture2D(
            GLES30.GL_FRAMEBUFFER,
            GLES30.GL_COLOR_ATTACHMENT0,
            GLES30.GL_TEXTURE_2D,
            texture2D,
            0
        )
        checkGlError("glFramebufferTexture2D")
        val status = GLES30.glCheckFramebufferStatus(GLES30.GL_FRAMEBUFFER)
        if (status != GLES30.GL_FRAMEBUFFER_COMPLETE) {
            Log.e(TAG, "bind FBO failed!")
            return
        }
    }

    fun end() {
        GLES30.glFramebufferTexture2D(
            GLES30.GL_FRAMEBUFFER,
            GLES30.GL_COLOR_ATTACHMENT0,
            GLES30.GL_TEXTURE_2D,
            0,
            0
        )
        checkGlError("detach texture from FBO")
        GLES30.glBindFramebuffer(GLES30.GL_FRAMEBUFFER, 0)
        checkGlError("deactivate FBO")
    }

    fun release() {
        GLES30.glDeleteFramebuffers(1, IntArray(1) { mFrameBuffer }, 0)
        checkGlError("glDeleteFramebuffers")
    }
}
复制代码

着色器实现

这里的着色器就不复杂了,就是从一个纹理上采样,然后设置给 gl_FragColor

顶点着色器:

private static final String VERTEX_SHADER =
        "uniform mat4 uMVPMatrix;\n" +
                "attribute vec4 aPosition;\n" +
                "attribute vec4 aTextureCoord;\n" +
                "varying vec2 vTextureCoord;\n" +
                "void main() {\n" +
                "  gl_Position = uMVPMatrix * aPosition;\n" +
                "  vTextureCoord = aTextureCoord.xy;\n" +
                "}\n";
复制代码

片段着色器:

private static final String FRAGMENT_SHADER =
        "#extension GL_OES_EGL_image_external : require\n" +
                "precision mediump float;\n" +
                "varying vec2 vTextureCoord;\n" +
                "uniform sampler2D sTexture;\n" +
                "void main() {\n" +
                "  gl_FragColor = texture2D(sTexture, vTextureCoord);\n" +
                "}\n";

作者:StefanJi
链接:https://juejin.cn/post/7012517274768179236
来源:稀土掘金
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。

更多Android技术分享可以关注@我,也可以加入QQ群号:Android进阶学习群:345659112,一起学习交流。

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 215,539评论 6 497
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 91,911评论 3 391
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 161,337评论 0 351
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 57,723评论 1 290
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 66,795评论 6 388
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 50,762评论 1 294
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 39,742评论 3 416
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 38,508评论 0 271
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 44,954评论 1 308
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 37,247评论 2 331
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 39,404评论 1 345
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 35,104评论 5 340
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 40,736评论 3 324
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 31,352评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,557评论 1 268
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 47,371评论 2 368
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 44,292评论 2 352

推荐阅读更多精彩内容