Android OpenGLES2.0开发（八）：Camera预览

🕗 发布于 2024-11-16 13:26 android Camera OpenGL ES GLSurfaceView

严以律己，宽以待人

引言

终于到该章节了，还记得Android OpenGLES2.0开发（一）：艰难的开始章节说的吗？写这个系列的初衷就是因为每次用到GLSurfaceView+Camera预览时，总是Ctrl+C、Ctrl+V从来没有研究过里面的代码，也不知道如何修改。经过前面章节的铺垫，现在可以自信的说Camera+OpenGL ES轻松拿捏。

外部纹理

上一篇中我们已经讲过如何显示一张图片，而Camera预览其实也是显示一张一张的图片。我们将Camera的预览帧数据转化为Bitmap传给OpenGL ES就可以了。但是这种方式就失去了使用OpenGL ES效率高的优势，NV21转Bitmap是CPU操作极其耗性能。

那么有没有更好的方式？答案是有的，我们可以将NV21数据直接传给OpenGL ES进行处理预览，这样操作就快了很多。我们知道OpenGL ES显示的是RGBA的数据，相当于OpenGL ES要将NV21转为RGBA，效率肯定比上面的情况好很多，但是操作略微复杂，这也不是最终方案，有没有更简单的方式呢？

Android的Camera及Camera2都可以使用SurfaceTexture作为预览载体，但是它们所使用的SurfaceTexture传入的OpenGL ES texture object name必须为GLES11Ext.GL_TEXTURE_EXTERNAL_OES。GL_TEXTURE_EXTERNAL_OES是一种特殊的纹理类型，只用于处理外部图像或视频数据，如从摄像头捕捉的实时图像和外部视频流。

GL_TEXTURE_EXTERNAL_OES的特点：

需采用特殊的采样器类型和纹理着色器扩展
使用二维纹理坐标进行操作，与GL_TEXTURE_2D相似
专门用于处理外部图像或视频数据，可直接从BufferQueue中接收的数据渲染纹理多边形，从而提供更高效的视频处理和渲染性能

纹理渲染

Android Camera系列（三）：GLSurfaceView+Camera这篇文章我们详细介绍了Camera使用GLSurfaceView进行预览操作，但唯独缺失了使用OpenGL ES绘制部分，而本篇是时候填坑了。

开始编写代码前，我们需要将上一篇的Image类拷贝一份命名为CameraFilter

1. 修改纹理着色器

首先，我们需要修改我们的着色器，将顶点着色器修改为：

// 顶点着色器代码
private final String vertexShaderCode =
        "uniform mat4 uMVPMatrix;\n" +
        // 顶点坐标
                "attribute vec4 vPosition;\n" +
                "uniform mat4 uTexPMatrix;\n" +
                // 纹理坐标
                "attribute vec4 vTexCoordinate;\n" +
                
                "varying vec2 aTexCoordinate;\n" +
                
                "void main() {\n" +
                "  gl_Position = uMVPMatrix * vPosition;\n" +
                "  aTexCoordinate = (uTexPMatrix * vTexCoordinate).xy;\n" +
                "}";

顶点着色器中的代码和渲染图片顶点着色器代码基本一致，增加了一个uTexPMatrix变量，这个是用来对纹理坐标进行变换的矩阵

uTexPMatrix纹理顶点变换的矩阵其实可以不用，我们只用顶点变换矩阵也是可以的，但是我们就需要对Camera前后置旋转变换要做一个处理。而SurfaceTexture中会自带一个变换矩阵，我们拿来直接用就不用处理Camera的前后置及旋转方向的问题了。

// 片段着色器代码
private final String fragmentShaderCode =
        "#extension GL_OES_EGL_image_external : require\n" +
                "precision mediump float;\n" +
                "uniform samplerExternalOES vTexture;\n" +
                "varying vec2 aTexCoordinate;\n" +
                "void main() {\n" +
                "  gl_FragColor = texture2D(vTexture, aTexCoordinate);\n" +
                "}\n";

片段着色器中我们不再使用sampler2D采样，而是使用samplerExternalOES纹理采样器，并且要在头部增加使用扩展纹理的声明#extension GL_OES_EGL_image_external : require。

2. 设置顶点坐标和纹理坐标

上一篇中我们已经正确设置了坐标，所以这两个顶点坐标保持不变

3. 初始化

初始化我们不再需要传入Bitmap

public CameraFilter() {
...
}

4. 创建外部纹理

我们需要在surfaceCreated中创建外部纹理，相机预览使用EXTERNAL_OES纹理，创建方式与2D纹理创建基本相同

public void surfaceCreated() {
    // 加载顶点着色器程序

...
    // 创建纹理句柄
    textureId = createTexture();
}

public int createTexture() {
    int[] texture = new int[1];
    GLES20.glGenTextures(1, texture, 0);
    GLES20.glBindTexture(GLES11Ext.GL_TEXTURE_EXTERNAL_OES, texture[0]);
    GLES20.glTexParameterf(GLES11Ext.GL_TEXTURE_EXTERNAL_OES,
            GL10.GL_TEXTURE_MIN_FILTER, GL10.GL_LINEAR);
    GLES20.glTexParameterf(GLES11Ext.GL_TEXTURE_EXTERNAL_OES,
            GL10.GL_TEXTURE_MAG_FILTER, GL10.GL_LINEAR);
    GLES20.glTexParameteri(GLES11Ext.GL_TEXTURE_EXTERNAL_OES,
            GL10.GL_TEXTURE_WRAP_S, GL10.GL_CLAMP_TO_EDGE);
    GLES20.glTexParameteri(GLES11Ext.GL_TEXTURE_EXTERNAL_OES,
            GL10.GL_TEXTURE_WRAP_T, GL10.GL_CLAMP_TO_EDGE);
    // 取消绑定纹理
    GLES20.glBindTexture(GLES11Ext.GL_TEXTURE_EXTERNAL_OES, 0);
    return texture[0];
}

由于我们创建的是扩展纹理，所以绑定的时候我们也需要绑定到扩展纹理上才可以正常使用，GLES20.glBindTexture(GLES11Ext.GL_TEXTURE_EXTERNAL_OES,texture[0])

5. 计算变换矩阵

在surfaceChanged中计算变换矩阵，由于视图的变换现在交给了纹理顶点坐标，所以我们顶点坐标矩阵使用原始矩阵即可。

public void surfaceChanged(int width, int height) {
    GLES20.glViewport(0, 0, width, height);

    // 获取原始矩阵，与原始矩阵相乘坐标不变
    Matrix.setIdentityM(mMVPMatrix, 0);
}

现在出现了两个矩阵，一个是顶点变换矩阵，一个是纹理变换矩阵。只要有顶点坐标都可以进行变换，但是我们最好控制变量，不要两个同时变换。如果还想继续使用顶点坐标矩阵变换，那么可以删除纹理矩阵参数。

5. 渲染

我们修改draw方法中的部分代码

将纹理变换矩阵传入给顶点着色器
glBindTexture改为GLES11Ext.GL_TEXTURE_EXTERNAL_OES

public void draw(float[] texMatrix) {
...

    // 将纹理坐标变换矩阵传递给顶点着色器
    GLES20.glUniformMatrix4fv(vTexPMatrixHandle, 1, false, texMatrix, 0);
    ...

    // 激活纹理编号0
    GLES20.glActiveTexture(GLES20.GL_TEXTURE0);
    // 绑定纹理
    GLES20.glBindTexture(GLES11Ext.GL_TEXTURE_EXTERNAL_OES, textureId);
    // 设置纹理采样器编号，该编号和glActiveTexture中设置的编号相同
    GLES20.glUniform1i(texHandle, 0);

    // 绘制
    GLES20.glDrawArrays(GLES20.GL_TRIANGLE_STRIP, 0, 4);

    // 取消绑定纹理
    GLES20.glBindTexture(GLES11Ext.GL_TEXTURE_EXTERNAL_OES, 0);

...
}

Camera预览

GLSurfaceView的模板代码我就不再这里列了，我这里只把Renderer中的代码再贴出来，看下他是如何使用CameraFilter进行渲染的

static class MyRenderer implements Renderer {

    private CameraFilter mCameraFilter;
    private int mTextureId;
    private SurfaceTexture mSurfaceTexture;
    private CameraGLSurfaceView mView;
    private final float[] mDisplayProjectionMatrix = new float[16];

    public MyRenderer(CameraGLSurfaceView glSurfaceView) {
        mView = glSurfaceView;
        mCameraFilter = new CameraFilter();
    }

    @Override
    public void onSurfaceCreated(GL10 gl, EGLConfig config) {
        mCameraFilter.surfaceCreated();
        mTextureId = mCameraFilter.getTextureId();
        mSurfaceTexture = new SurfaceTexture(mTextureId);
        mView.mMainHandler.post(() -> mView.surfaceTextureCreated(mSurfaceTexture));
    }

    @Override
    public void onSurfaceChanged(GL10 gl, int width, int height) {
        mCameraFilter.surfaceChanged(width, height);
    }

    @Override
    public void onDrawFrame(GL10 gl) {
        // 更新最新纹理
        mSurfaceTexture.updateTexImage();
        // 获取SurfaceTexture变换矩阵
        mSurfaceTexture.getTransformMatrix(mDisplayProjectionMatrix);
        // 将SurfaceTexture绘制到GLSurfaceView上
        mCameraFilter.draw(mDisplayProjectionMatrix);
    }
}

Renderer的代码比较简单，在对应的生命周期中调用CameraFilter的生命周期方法即可。我们需要注意的就是onDrawFrame方法中的功能：

mSurfaceTexture.updateTexImage:
从OpenGL上下文线程，即当前渲染线程中更新图像数据流最近的一帧纹理图像。调用该方法我们可以获取一帧新的图像用来渲染。
mSurfaceTexture.getTransformMatrix:
获取刚那一帧纹理数据的变换矩阵，我们只需将该矩阵传入着色器就可以获取一个方向正确的预览视图。

为什么getTransformMatrix获取到的矩阵可以获取到正确的预览方向？原因在于Camera在初始化时设置了正确的预览方向，他会把正确的方向映射给SurfaceTexture。所以我们不需要再写复杂的投影变化了，直接用getTransformMatrix获取的变换矩阵即可。

请添加图片描述
预览效果如上，搞定手工！

最后

该篇章主要讲解了OpenGL ES对外部纹理Camera预览数据如何进行渲染，因为有了前面的基础，在对外部纹理渲染时我们只修改了部分代码即可实现。Camera的相关操作我们在Android Camera系列中有详细的讲解，这里没有在重复说明，回顾前面的篇章本篇享用更佳。

OpenGL ES系列：https://github.com/xiaozhi003/OpenGLDemo.git
Camera系列：https://github.com/xiaozhi003/AndroidCamera.git

原文地址：https://blog.csdn.net/xiaozhiwz/article/details/143239446

免责声明：本站文章内容转载自网络资源，如本站内容侵犯了原著者的合法权益，可联系本站删除。更多内容请关注自学内容网（zxcms.com）！

上一篇：视频智能分析平台LiteAIServer视频智能分析软件噪声监测算法：检测视频画面噪声的新利器
下一篇：webpack案例----pdd（anti-content)

MoneyPrinterTurbo - AI自动生成高清短视频
MoneyPrinterTurbo是一款基于AI大模型的开源软件，旨在通过一键操作帮助用户自动生成高清短视频。只需提供一个视频主题或 **关键词** ，就可以全自动生成视频文案、视频素材、视频字幕、
阅读更多2024-11-18
跨平台WPF框架Avalonia教程五
在 Avalonia 11 之前，控件主题是使用标准样式创建的。然而，这种方法存在一个根本性的问题：一旦样式被应用到控件上，就没有办法移除它。因此，如果你想为特定的控件实例或用户界面（UI）部分更改
阅读更多2024-11-18
Linux 下网络套接字(Socket) 与udp和tcp 相关接口
Linux下套接字的介绍与使用
阅读更多2024-11-18
react 中 useReducer Hook 作用
useState`是最基本的状态管理钩子。`useReducer`提供了一种更可预测的状态管理方式。
阅读更多2024-11-18
【自学笔记】推荐系统
（Retrieval）步骤的目的是从庞大的候选集合中快速筛选出一小部分最有可能满足用户需求的项目。这样做可以简化梯度计算，更显著的变化是，如果人没有为任何样本打分，那代入TA的初始参数。我们需要做的是
阅读更多2024-11-18
【jvm】方法区是否存在GC
6.在Hotspot虚拟机中，方法区对应的是持久代（PermGen space，在JDK 8及之后被元空间Metaspace取代），尽管持久代上的GC较少，但并不代表完全没有。2.在JVM（Java虚
阅读更多2024-11-18
2411rust,异步函数
2411rust,异步函数
阅读更多2024-11-18
用 Python 从零开始创建神经网络（八）：梯度、偏导数和链式法则
在我们继续编写我们的神经网络代码之前，最后两个需要解决的难题是梯度和偏导数的相关概念。我们到目前为止解决的导数案例都是函数中只有一个独立变量的情况——也就是说，结果完全依赖于xx（在我们的案例中）。然
阅读更多2024-11-18
深度学习之One Stage目标检测算法2
YOLO（You Only Look Once: Unified, Real-Time Object Detection）是one-stage detection的开山之作。之前的物体检测方法首先需要
阅读更多2024-11-18
TCP协议的代理IP是什么？
对于需要大量数据传输和高效通信的场景，代理IP技术提供了至关重要的支持。TCP协议作为互联网通信中最基础和最常用的协议之一，与代理IP技术的结合成为了许多企业和开发者进行网络操作时不可或缺的一部分。那
阅读更多2024-11-18