找回密码
当前位置：Mikel > 开发笔记 > Android > 正文

[转载]玩转Android Camera开发(三):国内首发---使用GLSurfaceView预览Camera 基础拍照demo - chenlinyunyi - 博客园

2015-07-30 分类：Android 阅读(660) 评论(0)

来源： [转载][转载]玩转Android Camera开发(三):国内首发—使用GLSurfaceView预览Camera 基础拍照demo – chenlinyunyi – 博客园

GLSurfaceView 是OpenGL中的一个类，也是可以预览Camera的，而且在预览Camera上有其独到之处。独到之处在哪？当使用Surfaceview无能为力、 痛不欲生时就只有使用GLSurfaceView了，它能够真正做到让Camera的数据和显示分离，所以搞明白了这个，像Camera只开预览不显示这 都是小菜，妥妥的。Android4.0的自带Camera源码是用SurfaceView预览的，但到了4.2就换成了GLSurfaceView来预 览。如今到了4.4又用了自家的TextureView，所以从中可以窥探出新增TextureView的用意。

虽 说Android4.2的Camera源码是用GLSurfaceView预览的，但是进行了大量的封装又封装的，由于是OpenGL小白，真是看的不知 所云。俺滴要求不高，只想弄个可拍照的摸清GLSurfaceView在预览Camera上的使用流程。经过一番百度一无所获，后来翻出去Google一 大圈也没发现可用的。倒是很多人都在用GLSurfaceView和Surfaceview同时预览Camera，Surfaceview用来预览数据， 在上面又铺了一层GLSurfaceView绘制一些信息。无奈自己摸索，整出来的是能拍照也能得到数据，但是界面上不是一块白板就是一块黑板啥都不显 示。后来在stackoverflow终于找到了一个可用的链接，哈哈，苍天啊，终于柳暗花明了！参考此链接，自己又改改摸索了一天才彻底搞定。之所以费这么多时间是不明白OpenGL ES2.0的绘制基本流程，跟简单的OpenGL的绘制还是稍有区别。下面上源码:

一、CameraGLSurfaceView.java 此类继承GLSurfaceView，并实现了两个接口

  1. <span style=“font-family:Comic Sans MS;font-size:18px;”>package org.yanzi.camera.preview;  
  3. import javax.microedition.khronos.egl.EGLConfig;  
  4. import javax.microedition.khronos.opengles.GL10;  
  6. import org.yanzi.camera.CameraInterface;  
  8. import Android.content.Context;  
  9. import android.graphics.SurfaceTexture;  
  10. import android.opengl.GLES11Ext;  
  11. import android.opengl.GLES20;  
  12. import android.opengl.GLSurfaceView;  
  13. import android.opengl.GLSurfaceView.Renderer;  
  14. import android.util.AttributeSet;  
  15. import android.util.Log;  
  17. public class CameraGLSurfaceView extends GLSurfaceView implements Renderer, SurfaceTexture.OnFrameAvailableListener {  
  18.     private static final String TAG = “yanzi”;  
  19.     Context mContext;
  20.     SurfaceTexture mSurface;
  21.     int mTextureID = –1;  
  22.     DirectDrawer mDirectDrawer;
  23.     public CameraGLSurfaceView(Context context, AttributeSet attrs) {  
  24.         super(context, attrs);  
  25.         // TODO Auto-generated constructor stub  
  26.         mContext = context;
  27.         setEGLContextClientVersion(2);  
  28.         setRenderer(this);  
  29.         setRenderMode(RENDERMODE_WHEN_DIRTY);
  30.     }
  31.     @Override  
  32.     public void onSurfaceCreated(GL10 gl, EGLConfig config) {  
  33.         // TODO Auto-generated method stub  
  34.         Log.i(TAG, “onSurfaceCreated…”);  
  35.         mTextureID = createTextureID();
  36.         mSurface = new SurfaceTexture(mTextureID);  
  37.         mSurface.setOnFrameAvailableListener(this);  
  38.         mDirectDrawer = new DirectDrawer(mTextureID);  
  39.         CameraInterface.getInstance().doOpenCamera(null);  
  41.     }
  42.     @Override  
  43.     public void onSurfaceChanged(GL10 gl, int width, int height) {  
  44.         // TODO Auto-generated method stub  
  45.         Log.i(TAG, “onSurfaceChanged…”);  
  46.         GLES20.glViewport(0, 0, width, height);  
  47.         if(!CameraInterface.getInstance().isPreviewing()){  
  48.             CameraInterface.getInstance().doStartPreview(mSurface, 1.33f);  
  49.         }
  52.     }
  53.     @Override  
  54.     public void onDrawFrame(GL10 gl) {  
  55.         // TODO Auto-generated method stub  
  56.         Log.i(TAG, “onDrawFrame…”);  
  57.         GLES20.glClearColor(1.0f, 1.0f, 1.0f, 1.0f);  
  58.         GLES20.glClear(GLES20.GL_COLOR_BUFFER_BIT | GLES20.GL_DEPTH_BUFFER_BIT);
  59.         mSurface.updateTexImage();
  60.         float[] mtx = new float[16];  
  61.         mSurface.getTransformMatrix(mtx);
  62.         mDirectDrawer.draw(mtx);
  63.     }
  65.     @Override  
  66.     public void onPause() {  
  67.         // TODO Auto-generated method stub  
  68.         super.onPause();  
  69.         CameraInterface.getInstance().doStopCamera();
  70.     }
  71.     private int createTextureID()  
  72.     {
  73.         int[] texture = new int[1];  
  75.         GLES20.glGenTextures(1, texture, 0);  
  76.         GLES20.glBindTexture(GLES11Ext.GL_TEXTURE_EXTERNAL_OES, texture[0]);  
  77.         GLES20.glTexParameterf(GLES11Ext.GL_TEXTURE_EXTERNAL_OES,
  78.                 GL10.GL_TEXTURE_MIN_FILTER,GL10.GL_LINEAR);
  79.         GLES20.glTexParameterf(GLES11Ext.GL_TEXTURE_EXTERNAL_OES,
  80.                 GL10.GL_TEXTURE_MAG_FILTER, GL10.GL_LINEAR);
  81.         GLES20.glTexParameteri(GLES11Ext.GL_TEXTURE_EXTERNAL_OES,
  82.                 GL10.GL_TEXTURE_WRAP_S, GL10.GL_CLAMP_TO_EDGE);
  83.         GLES20.glTexParameteri(GLES11Ext.GL_TEXTURE_EXTERNAL_OES,
  84.                 GL10.GL_TEXTURE_WRAP_T, GL10.GL_CLAMP_TO_EDGE);
  86.         return texture[0];  
  87.     }
  88.     public SurfaceTexture _getSurfaceTexture(){  
  89.         return mSurface;  
  90.     }
  91.     @Override  
  92.     public void onFrameAvailable(SurfaceTexture surfaceTexture) {  
  93.         // TODO Auto-generated method stub  
  94.         Log.i(TAG, “onFrameAvailable…”);  
  95.         this.requestRender();  
  96.     }
  98. }
  99. </span>

关于这个类进行简单说明:

1、 Renderer这个接口里有三个回调: onSurfaceCreated() onSurfaceChanged() onDrawFrame(), 在onSurfaceCreated里设置了GLSurfaceView的版本: setEGLContextClientVersion(2); 如果没这个设置是啥都画不出来了，因为Android支持OpenGL ES1.1和2.0及最新的3.0，而且版本间差别很大。不告诉他版本他不知道用哪个版本的api渲染。在设置setRenderer(this);后， 再设置它的模式为RENDERMODE_WHEN_DIRTY。这个也很关键，看api：

When renderMode is RENDERMODE_CONTINUOUSLY, the renderer is called repeatedly to re-render the scene. When renderMode is RENDERMODE_WHEN_DIRTY, the renderer only rendered when the surface is created, or when requestRender is called. Defaults to RENDERMODE_CONTINUOUSLY.

Using RENDERMODE_WHEN_DIRTY can improve battery life and overall system performance by allowing the GPU and CPU to idle when the view does not need to be updated.

大 意是RENDERMODE_CONTINUOUSLY模式就会一直Render，如果设置成RENDERMODE_WHEN_DIRTY，就是当有数据时 才rendered或者主动调用了GLSurfaceView的requestRender.默认是连续模式，很显然Camera适合脏模式，一秒30 帧，当有数据来时再渲染。

2、 正因是RENDERMODE_WHEN_DIRTY所以就要告诉GLSurfaceView什么时候Render，也就是啥时候进到 onDrawFrame()这个函数里。SurfaceTexture.OnFrameAvailableListener这个接口就干了这么一件事，当 有数据上来后会进到

public void onFrameAvailable(SurfaceTexture surfaceTexture) {
// TODO Auto-generated method stub
Log.i(TAG, “onFrameAvailable…”);
this.requestRender();
}

这里，然后执行requestRender()。

3、网上有一些OpenGL ES的示例是在Activity里实现了SurfaceTexture.OnFrameAvailableListener此接口，其实这个无所谓。无论是被谁实现，关键看在回调里干了什么事。

4、与TextureView里对比可知，TextureView预览时因为实现了SurfaceTextureListener会自动创建SurfaceTexture。但在GLSurfaceView里则要手动创建同时绑定一个纹理ID。

5、 本文在onSurfaceCreated()里打开Camera，在onSurfaceChanged()里开启预览，默认1.33的比例。原因是相比前 两种预览，此处SurfaceTexture创建需要一定时间。如果想要开预览时由Activity发起，则要GLSurfaceView利用 Handler将创建的SurfaceTexture传递给Activity。

 

二、DirectDrawer.java 此类非常关键，负责将SurfaceTexture内容绘制到屏幕上

  1. <span style=“font-family:Comic Sans MS;font-size:18px;”>package org.yanzi.camera.preview;  
  3. import java.nio.ByteBuffer;  
  4. import java.nio.ByteOrder;  
  5. import java.nio.FloatBuffer;  
  6. import java.nio.ShortBuffer;  
  8. import android.opengl.GLES11Ext;  
  9. import android.opengl.GLES20;  
  10. import android.opengl.Matrix;  
  12. public class DirectDrawer {  
  13.     private final String vertexShaderCode =  
  14.             “attribute vec4 vPosition;” +  
  15.             “attribute vec2 inputTextureCoordinate;” +  
  16.             “varying vec2 textureCoordinate;” +  
  17.             “void main()” +  
  18.             “{“+  
  19.                 “gl_Position = vPosition;”+  
  20.                 “textureCoordinate = inputTextureCoordinate;” +  
  21.             “}”;  
  23.     private final String fragmentShaderCode =  
  24.             “#extension GL_OES_EGL_image_external : require\n”+  
  25.             “precision mediump float;” +  
  26.             “varying vec2 textureCoordinate;\n” +  
  27.             “uniform samplerExternalOES s_texture;\n” +  
  28.             “void main() {” +  
  29.             ”  gl_FragColor = texture2D( s_texture, textureCoordinate );\n” +  
  30.             “}”;  
  32.     private FloatBuffer vertexBuffer, textureVerticesBuffer;  
  33.     private ShortBuffer drawListBuffer;  
  34.     private final int mProgram;  
  35.     private int mPositionHandle;  
  36.     private int mTextureCoordHandle;  
  38.     private short drawOrder[] = { 0, 1, 2, 0, 2, 3 }; // order to draw vertices  
  40.     // number of coordinates per vertex in this array  
  41.     private static final int COORDS_PER_VERTEX = 2;  
  43.     private final int vertexStride = COORDS_PER_VERTEX * 4; // 4 bytes per vertex  
  45.     static float squareCoords[] = {  
  46.        –1.0f,  1.0f,  
  47.        –1.0f, -1.0f,  
  48.         1.0f, -1.0f,  
  49.         1.0f,  1.0f,  
  50.     };
  52.     static float textureVertices[] = {  
  53.         0.0f, 1.0f,  
  54.         1.0f, 1.0f,  
  55.         1.0f, 0.0f,  
  56.         0.0f, 0.0f,  
  57.     };
  59.     private int texture;  
  61.     public DirectDrawer(int texture)  
  62.     {
  63.         this.texture = texture;  
  64.         // initialize vertex byte buffer for shape coordinates  
  65.         ByteBuffer bb = ByteBuffer.allocateDirect(squareCoords.length * 4);  
  66.         bb.order(ByteOrder.nativeOrder());
  67.         vertexBuffer = bb.asFloatBuffer();
  68.         vertexBuffer.put(squareCoords);
  69.         vertexBuffer.position(0);  
  71.         // initialize byte buffer for the draw list  
  72.         ByteBuffer dlb = ByteBuffer.allocateDirect(drawOrder.length * 2);  
  73.         dlb.order(ByteOrder.nativeOrder());
  74.         drawListBuffer = dlb.asShortBuffer();
  75.         drawListBuffer.put(drawOrder);
  76.         drawListBuffer.position(0);  
  78.         ByteBuffer bb2 = ByteBuffer.allocateDirect(textureVertices.length * 4);  
  79.         bb2.order(ByteOrder.nativeOrder());
  80.         textureVerticesBuffer = bb2.asFloatBuffer();
  81.         textureVerticesBuffer.put(textureVertices);
  82.         textureVerticesBuffer.position(0);  
  84.         int vertexShader    = loadShader(GLES20.GL_VERTEX_SHADER, vertexShaderCode);  
  85.         int fragmentShader  = loadShader(GLES20.GL_FRAGMENT_SHADER, fragmentShaderCode);  
  87.         mProgram = GLES20.glCreateProgram();             // create empty OpenGL ES Program  
  88.         GLES20.glAttachShader(mProgram, vertexShader);   // add the vertex shader to program  
  89.         GLES20.glAttachShader(mProgram, fragmentShader); // add the fragment shader to program  
  90.         GLES20.glLinkProgram(mProgram);                  // creates OpenGL ES program executables  
  91.     }
  93.     public void draw(float[] mtx)  
  94.     {
  95.         GLES20.glUseProgram(mProgram);
  97.         GLES20.glActiveTexture(GLES20.GL_TEXTURE0);
  98.         GLES20.glBindTexture(GLES11Ext.GL_TEXTURE_EXTERNAL_OES, texture);
  100.         // get handle to vertex shader’s vPosition member  
  101.         mPositionHandle = GLES20.glGetAttribLocation(mProgram, “vPosition”);  
  103.         // Enable a handle to the triangle vertices  
  104.         GLES20.glEnableVertexAttribArray(mPositionHandle);
  106.         // Prepare the <insert shape here> coordinate data  
  107.         GLES20.glVertexAttribPointer(mPositionHandle, COORDS_PER_VERTEX, GLES20.GL_FLOAT, false, vertexStride, vertexBuffer);  
  109.         mTextureCoordHandle = GLES20.glGetAttribLocation(mProgram, “inputTextureCoordinate”);  
  110.         GLES20.glEnableVertexAttribArray(mTextureCoordHandle);
  112. //        textureVerticesBuffer.clear();  
  113. //        textureVerticesBuffer.put( transformTextureCoordinates( textureVertices, mtx ));  
  114. //        textureVerticesBuffer.position(0);  
  115.         GLES20.glVertexAttribPointer(mTextureCoordHandle, COORDS_PER_VERTEX, GLES20.GL_FLOAT, false, vertexStride, textureVerticesBuffer);  
  117.         GLES20.glDrawElements(GLES20.GL_TRIANGLES, drawOrder.length, GLES20.GL_UNSIGNED_SHORT, drawListBuffer);
  119.         // Disable vertex array  
  120.         GLES20.glDisableVertexAttribArray(mPositionHandle);
  121.         GLES20.glDisableVertexAttribArray(mTextureCoordHandle);
  122.     }
  124.     private  int loadShader(int type, String shaderCode){  
  126.         // create a vertex shader type (GLES20.GL_VERTEX_SHADER)  
  127.         // or a fragment shader type (GLES20.GL_FRAGMENT_SHADER)  
  128.         int shader = GLES20.glCreateShader(type);  
  130.         // add the source code to the shader and compile it  
  131.         GLES20.glShaderSource(shader, shaderCode);
  132.         GLES20.glCompileShader(shader);
  134.         return shader;  
  135.     }
  136.     private float[] transformTextureCoordinates( float[] coords, float[] matrix)  
  137.     {
  138.        float[] result = new float[ coords.length ];          
  139.        float[] vt = new float[4];        
  141.        for ( int i = 0 ; i < coords.length ; i += 2 ) {  
  142.            float[] v = { coords[i], coords[i+1], 0 , 1  };  
  143.            Matrix.multiplyMV(vt, 0, matrix, 0, v, 0);  
  144.            result[i] = vt[0];  
  145.            result[i+1] = vt[1];  
  146.        }
  147.        return result;  
  148.     }
  149. }
  150. </span>

三、有了上面两个类就完成95%的工作，可以将GLSurfaceView看成是有生命周期的。在onPause里进行关闭Camera，在Activity里复写两个方法:

  1. <span style=“font-family:Comic Sans MS;font-size:18px;”>    @Override  
  2.     protected void onResume() {  
  3.         // TODO Auto-generated method stub  
  4.         super.onResume();  
  5.         glSurfaceView.bringToFront();
  6.     }
  8.     @Override  
  9.     protected void onPause() {  
  10.         // TODO Auto-generated method stub  
  11.         super.onPause();  
  12.         glSurfaceView.onPause();
  13.     }</span>

这个glSurfaceView.bringToFront();其实不写也中。在布局里写入自定义的GLSurfaceView就ok了:

  1. <span style=“font-family:Comic Sans MS;font-size:18px;”>    <FrameLayout  
  2.         android:layout_width=“wrap_content”  
  3.         android:layout_height=“wrap_content” >  
  4.         <org.yanzi.camera.preview.CameraGLSurfaceView  
  5.             android:id=“@+id/camera_textureview”  
  6.             android:layout_width=“0dip”  
  7.             android:layout_height=“0dip” />  
  8.     </FrameLayout></span>  

CameraActivity里只负责UI部分，CameraGLSurfaceView负责开Camera、预览，并调用DirectDrawer里的draw()进行绘制。其他代码就不上了。

注意事项:

1、在onDrawFrame()里，如果不调用mDirectDrawer.draw(mtx);是啥都显示不出来的！！！这是GLSurfaceView的特别之处。为啥呢？因为GLSurfaceView不是Android亲生的，而Surfaceview和TextureView是。所以得自己按照OpenGL ES的流程画。

2、 究竟mDirectDrawer.draw(mtx)里在哪获取的Buffer目前杂家还么看太明白，貌似么有请求buffer，而是根据 GLSurfaceView里创建的SurfaceTexture之前，生成的有个纹理ID。这个纹理ID一方面跟SurfaceTexture是绑定在 一起的，另一方面跟DirectDrawer绑定，而SurfaceTexture作渲染载体。

3、参考链接里有,有人为了解决问题，给出了下面三段代码:

@Override
public void onDrawFrame(GL10 gl)
{
    float[] mtx = new float[16];
    mSurface.updateTexImage();
    mSurface.getTransformMatrix(mtx);    

    mDirectVideo.draw(mtx);
}
 private float[] transformTextureCoordinates( float[] coords, float[] matrix)
 {          
    float[] result = new float[ coords.length ];        
    float[] vt = new float[4];      

    for ( int i = 0 ; i < coords.length ; i += 2 ) {
        float[] v = { coords[i], coords[i+1], 0 , 1  };
        Matrix.multiplyMV(vt, 0, matrix, 0, v, 0);
        result[i] = vt[0];
        result[i+1] = vt[1];
    }
    return result;
 }
textureVerticesBuffer.clear();
textureVerticesBuffer.put( transformTextureCoordinates( textureVertices, mtx ));
textureVerticesBuffer.position(0);

我已经把代码都融入到了此demo，只不过在draw()方法里么有使用。原因是使用之后，得到的预览画面反而是变形的，而不用的话是ok的。上面的代码是得到SurfaceTexture的变换矩阵：mSurface.getTransformMatrix

然后将此矩阵传递给draw()，在draw的时候对textureVerticesBuffer作一个变化，然后再画。

下图是未加这个矩阵变换效果时:

下图为使用了变换矩阵，划片扭曲的还真说不上来咋扭曲的，但足以说明OpenGL ES在渲染效果上的强大，就是设置了个矩阵，不用一帧帧处理，就能得到不一样显示效果。

 

 

 

—————————–本文系原创，转载请注明作者yanzi1225627

版本号:PlayCamera_V3.0.0[2014-6-22].zip

CSDN下载链接:http://download.csdn.net/detail/yanzi1225627/7547263

百度云盘:

附个OpenGL ES简明教程：http://www.apkbus.com/android-20427-1-1.html

赞(0) 打赏
分享到： 更多 (0)
标签：

相关推荐

热门标签

C# (813)ASP.NET MVC (619)Android (587)ASP.NET (447)数据库 (299)JavaScript (285)JQuery (221)PHP (210)SQLServer (197)程序开发 (156)架构设计 (155)源价值 (155)SQL (128)Java (111)EasyUi (85)教程 (76)网站 (67)Debug (63)互联网 (63)MySQL (60)Flash (56)搜索优化 (54)创意 (53)SEO (51)ASP.NET MVC3 (51)电子商务 (50)建站经验 (49)实例代码 (49)源码下载 (47)原创 (45)

分类

链接表

<figure class="wp-block-image size-full"><a href="https://act.walk-live.com/acts/invite/registration?inviteid=hkXrmnvL" target="_blank"><img src="https://www.mikel.cn/wp-content/uploads/2024/11/wangxinyun.jpg"></a></figure>

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏