基于OpenGLES的Android相机预览
前言
随着AR效果越来越普及,摄像头在Android中的应用越来越重要。通常摄像头的预览方案,通常使用SurfaceView的方案。
SurfaceView使用非常方便,但是我们没法对SurfaceView显示的视频数据进行处理。这样的架构灵活性很差。因此,Android还提供了Texture的方式。摄像头将采集的数据保存成纹理,然后使用Opengles去显示。
Opengles基础
OpenGL- ES 是免授权费的,跨平台和3D图形应用程序接口API。
GLSL
OpenGL着色语言(OpenGL Shading Language)是用来在OpenGL中着色编程的语言,也即开发人员写的短小的自定义程序,他们是在图形卡的GPU (Graphic Processor Unit图形处理单元)上执行的,代替了固定的渲染管线的一部分,使渲染管线中不同层次具有可编程性。
我们通过编写GLSL来决定顶点数据,片段数据以怎样的方式进行组合。
private final String vertexShaderCode = "uniform mat4 textureTransform;n" +
"attribute vec2 inputTextureCoordinate;n" +
"attribute vec4 position; n" +//NDK坐标点
"varying vec2 textureCoordinate; n" +//纹理坐标点变换后输出
"n" +
" void main() {n" +
" gl_Position = vec4(position.x,-position.y,position.z,position.w);n" +
" textureCoordinate = vec2(inputTextureCoordinate.x,inputTextureCoordinate.y);n" +
" }";
private final String fragmentShaderCode = "#extension GL_OES_EGL_image_external : requiren" +
"precision mediump float;n" +
"uniform samplerExternalOES videoTex;n" +
"varying vec2 textureCoordinate;n" +
"n" +
"void main() {n" +
" vec4 tc = texture2D(videoTex, textureCoordinate);n" +
// " float color = tc.r * 0.3 + tc.g * 0.59 + tc.b * 0.11;n" + //所有视图修改成黑白
// " gl_FragColor = vec4(color,color,color,1.0);n" +
" gl_FragColor = vec4(tc.r,tc.g,tc.b,1.0);n" +
"}";
上面的代码中,position是输入变量,表示顶点坐标。** gl_Position**是最终的坐标。 例如:
gl_Position = vec4(position.x,-position.y,position.z,position.w);
表示显示图像与源数据上下颠倒。
Program
上面介绍了GLSL(着色器语言)的编写,但我们如何将GLSL写入GPU,让它为我们工作呢?这就需要Program。我们可以将GLSL编写的Shader绑定到特定的Program,然后将Program链接到OpenGL中。
private int loadShader(int type, String shaderCode) {
int shader = GLES20.glCreateShader(type);
// 添加上面编写的着色器代码并编译它
GLES20.glShaderSource(shader, shaderCode);
GLES20.glCompileShader(shader);
return shader;
}
private void creatProgram() {
int vertexShader = loadShader(GLES20.GL_VERTEX_SHADER, vertexShaderCode);
int fragmentShader = loadShader(GLES20.GL_FRAGMENT_SHADER, fragmentShaderCode);
// 创建空的OpenGL ES程序
mProgram = GLES20.glCreateProgram();
// 添加顶点着色器到程序中
GLES20.glAttachShader(mProgram, vertexShader);
// 添加片段着色器到程序中
GLES20.glAttachShader(mProgram, fragmentShader);
// 创建OpenGL ES程序可执行文件
GLES20.glLinkProgram(mProgram);
// 释放shader资源
GLES20.glDeleteShader(vertexShader);
GLES20.glDeleteShader(fragmentShader);
}
GLSurfaceView.Renderer
GLSurfaceView.Renderer是Android SDK提供的一个接口。需要实现三个方法
- onSurfaceCreated是画面创建时调用,用于创建Program,初始化纹理等一些初始化工作
- onSurfaceChanged是画面尺寸变化时调用,通常用于设置尺寸,设置视点
- onDrawFrame在GPU准备绘制时调用,用于具体的绘制过程
具体过程
创建Render
public static Camera camera;
GLSurfaceView mCameraGlsurfaceView;
public CameraRender mRenderer;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.gl_preview_fragment_layout);
mCameraGlsurfaceView = findViewById(R.id.glsv_effect_preview);
mCameraGlsurfaceView.setEGLContextClientVersion(2);//在setRenderer()方法前调用此方法
mRenderer = new CameraRender(camera , this);
mCameraGlsurfaceView.setRenderer(mRenderer);
mCameraGlsurfaceView.setRenderMode(RENDERMODE_WHEN_DIRTY);
if (camera != null) {
camera.stopPreview();
camera.release();
}
mRenderer.mBoolean = true;
}
@Override
public void onFrameAvailable(SurfaceTexture surfaceTexture) {
mCameraGlsurfaceView.requestRender();
}
Render
private int camera_status = 0;
private final String vertexShaderCode = "uniform mat4 textureTransform;n" +
"attribute vec2 inputTextureCoordinate;n" +
"attribute vec4 position; n" +//NDK坐标点
"varying vec2 textureCoordinate; n" +//纹理坐标点变换后输出
"n" +
" void main() {n" +
" gl_Position = vec4(position.x,-position.y,position.z,position.w);n" +
" textureCoordinate = vec2(inputTextureCoordinate.x,inputTextureCoordinate.y);n" +
" }";
private final String fragmentShaderCode = "#extension GL_OES_EGL_image_external : requiren" +
"precision mediump float;n" +
"uniform samplerExternalOES videoTex;n" +
"varying vec2 textureCoordinate;n" +
"n" +
"void main() {n" +
" vec4 tc = texture2D(videoTex, textureCoordinate);n" +
// " float color = tc.r * 0.3 + tc.g * 0.59 + tc.b * 0.11;n" + //所有视图修改成黑白
// " gl_FragColor = vec4(color,color,color,1.0);n" +
" gl_FragColor = vec4(tc.r,tc.g,tc.b,1.0);n" +
"}";
private float[] mPosCoordinate = {-1, -1, -1, 1, 1, -1, 1, 1};
private float[] mTexCoordinateBackRight = {1, 1, 0, 1, 1, 0, 0, 0};//顺时针转90并沿Y轴翻转 后摄像头正确,前摄像头上下颠倒
private float[] mTexCoordinateForntRight = {0, 1, 1, 1, 0, 0, 1, 0};//顺时针旋转90 后摄像头上下颠倒了,前摄像头正确
private SurfaceTexture mSurfaceTexture;
private Camera mCamera;
private SurfaceTexture.OnFrameAvailableListener mOnFrameAvailableListener;
public int mProgram;
public boolean mBoolean = false;
public CameraRender( Camera camera , SurfaceTexture.OnFrameAvailableListener listener) {
mCamera = camera;
mOnFrameAvailableListener = listener;
Matrix.setIdentityM(mProjectMatrix, 0);
Matrix.setIdentityM(mCameraMatrix, 0);
Matrix.setIdentityM(mMVPMatrix, 0);
}
onSurfaceCreated
/**
* 加载着色器
* @param type 着色器类型
* @param shaderCode 着色器源码
* @return
*/
private int loadShader(int type, String shaderCode) {
int shader = GLES20.glCreateShader(type);
// 添加上面编写的着色器代码并编译它
GLES20.glShaderSource(shader, shaderCode);
GLES20.glCompileShader(shader);
return shader;
}
private void creatProgram() {
int vertexShader = loadShader(GLES20.GL_VERTEX_SHADER, vertexShaderCode);
int fragmentShader = loadShader(GLES20.GL_FRAGMENT_SHADER, fragmentShaderCode);
// 创建空的OpenGL ES程序
mProgram = GLES20.glCreateProgram();
// 添加顶点着色器到程序中
GLES20.glAttachShader(mProgram, vertexShader);
// 添加片段着色器到程序中
GLES20.glAttachShader(mProgram, fragmentShader);
// 创建OpenGL ES程序可执行文件
GLES20.glLinkProgram(mProgram);
// 释放shader资源
GLES20.glDeleteShader(vertexShader);
GLES20.glDeleteShader(fragmentShader);
}
@Override
public void onSurfaceCreated(GL10 gl, EGLConfig config) {
GLES20.glClearColor(0.0f, 0.0f, 0.0f, 0.0f);
mSurfaceTexture = new SurfaceTexture(createOESTextureObject());
creatProgram();
mCamera = Camera.open(1);
try {
mCamera.setPreviewTexture(mSurfaceTexture);
mCamera.startPreview();
} catch (IOException e) {
e.printStackTrace();
}
}
在onSurfaceCreated中,我们不仅创建了Program,还初始化了SurfaceTexture和Camera。其中,SurfaceTexture通过createOESTextureObject获取。
onSurfaceChanged
@Override
public void onSurfaceChanged(GL10 gl, int width, int height) {
GLES20.glViewport(0, 0, width, height);
Matrix.scaleM(mMVPMatrix,0,1,-1,1);
float ratio = (float) width / height;
Matrix.orthoM(mProjectMatrix, 0, -1, 1, -ratio, ratio, 1, 7);// 3和7代表远近视点与眼睛的距离,非坐标点
Matrix.setLookAtM(mCameraMatrix, 0, 0, 0, 3, 0f, 0f, 0f, 0f, 1.0f, 0.0f);// 3代表眼睛的坐标点
Matrix.multiplyMM(mMVPMatrix, 0, mProjectMatrix, 0, mCameraMatrix, 0);
}
onDrawFrame
//添加程序到ES环境中
private void activeProgram() {
// 将程序添加到OpenGL ES环境
GLES20.glUseProgram(mProgram);
mSurfaceTexture.setOnFrameAvailableListener(mOnFrameAvailableListener);
// 获取顶点着色器的位置的句柄
uPosHandle = GLES20.glGetAttribLocation(mProgram, "position");
aTexHandle = GLES20.glGetAttribLocation(mProgram, "inputTextureCoordinate");
FloatBuffer mPosBuffer = convertToFloatBuffer(mPosCoordinate);
FloatBuffer mTexBuffer;
if(camera_status == 0){
mTexBuffer = convertToFloatBuffer(mTexCoordinateBackRight);
}else{
mTexBuffer = convertToFloatBuffer(mTexCoordinateForntRight);
}
GLES20.glVertexAttribPointer(uPosHandle, 2, GLES20.GL_FLOAT, false, 0, mPosBuffer);
GLES20.glVertexAttribPointer(aTexHandle, 2, GLES20.GL_FLOAT, false, 0, mTexBuffer);
// 启用顶点位置的句柄
GLES20.glEnableVertexAttribArray(uPosHandle);
GLES20.glEnableVertexAttribArray(aTexHandle);
}
@Override
public void onDrawFrame(GL10 gl) {
if(mBoolean){
activeProgram();
mBoolean = false;
}
if (mSurfaceTexture != null) {
GLES20.glClear(GLES20.GL_COLOR_BUFFER_BIT | GLES20.GL_DEPTH_BUFFER_BIT);
mSurfaceTexture.updateTexImage();
GLES20.glDrawArrays(GLES20.GL_TRIANGLE_STRIP, 0, mPosCoordinate.length / 2);
}
}
在onDrawFrame中,我们使用Program,并传入对应的position,然后更新SurfaceTexture,并重绘画面。
经过以上的过程,我们可以在Android中显示摄像头的画面。
如有问题,欢迎指正。
- 谈谈 char *num="123";和char num[4]="123";的区别
- 未越狱的iPhone/iPad也中招:走近强大的间谍软件XAgent与MadCap
- 【年末收藏】17个新手常见Python运行时错误
- C++ STL之priority_queue
- 链表的相关操作
- 《笨办法学Python》 第0课手记
- Python黑客学习笔记:从HelloWorld到编写PoC(上)
- java多线程(内附实例:窗口售票问题、人和叉子的问题)
- 数据结构之队列
- 《笨办法学Python》 第20课手记
- 泄露数据中的秘密:中国网民的密码设置习惯
- 微信小程序入门《一》: 简 介、文本、事件、样式
- 《笨办法学Python》 第19课手记
- Redis 4.0新功能介绍
- java教程
- Java快速入门
- Java 开发环境配置
- Java基本语法
- Java 对象和类
- Java 基本数据类型
- Java 变量类型
- Java 修饰符
- Java 运算符
- Java 循环结构
- Java 分支结构
- Java Number类
- Java Character类
- Java String类
- Java StringBuffer和StringBuilder类
- Java 数组
- Java 日期时间
- Java 正则表达式
- Java 方法
- Java 流(Stream)、文件(File)和IO
- Java 异常处理
- Java 继承
- Java 重写(Override)与重载(Overload)
- Java 多态
- Java 抽象类
- Java 封装
- Java 接口
- Java 包(package)
- Java 数据结构
- Java 集合框架
- Java 泛型
- Java 序列化
- Java 网络编程
- Java 发送邮件
- Java 多线程编程
- Java Applet基础
- Java 文档注释
- 深入理解swap交换分区理解及扩存
- client-go 之 Reflector 源码分析
- Vue.js点击按钮弹出隐藏菜单的几种方式
- 【Vue.js】Vue.js组件库Element中的单选框、多选框、输入框和计数器
- 【Vue.js】Vue.js组件库Element的基础用法
- 常见的图像处理技术
- docker浅入深出续
- 【21期】你能说说Java中Comparable和Comparator的区别吗
- 昨天晚上熬夜整理的Java注解相关学习笔记
- 对图标的坐标轴进行调整
- Vue 开发技巧总结
- 35.opengl PBR-光照
- 聊聊claudb的list command
- nginx add_header 仅部分或一次生效的原因与解决办法
- 聊聊claudb的keys command