两个简单滤镜切换
通过上两个章节的实现，我们实现了相机预览，因为是通过opengl实现，因此，可以通过改变不同的着色器程序，
实现不同的预览效果，也就是不同的滤镜效果
正常预览的片元着色器程序：
uniform sampler2D inputImageTexture;
varying vec2 textureCoordinate;
void main()
{
#从对应纹理位置取颜色值
gl_FragColor = texture2D(inputImageTexture, textureCoordinate);
}
黑白滤镜效果片元着色器程序:
uniform sampler2D inputImageTexture;
varying vec2 textureCoordinate;
const highp vec3 W = vec3(0.2125, 0.7154, 0.0721);
void main() {
//从对应纹理位置取颜色值
lowp vec4 textureColor = texture2D(inputImageTexture, textureCoordinate);
float luminance = dot(textureColor.rgb, W);
gl_FragColor = vec4(vec3(luminance), textureColor.w);
}
因此通过动态切换着色器程序，我们可以实现不同的滤镜效果
预览滤镜切换核心代码：
- 首先，基于基类JImageOESFilter，只需要替换成黑白片元着色器(gray_oes_fragment_shader)即可
public class JImageOESGrayFilter extends JImageOESFilter{
public JImageOESGrayFilter(Context context) {
super(context);
vertexShader = Utils.readShaderFromResource(context, R.raw.base_oes_vertex_shader);
fragmentShader = Utils.readShaderFromResource(context, R.raw.gray_oes_fragment_shader);
}
}
- 然后，在点击事件中，改变Render中filter的对象赋值
findViewById(R.id.switch_filter).setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
glSurfaceView.setFilter(new JImageOESGrayFilter(JCamera2OESActivity.this));
}
});
public void setFilter(JImageOESFilter filte){
render.setFilter(filte);
}
public void setFilter(final JImageOESFilter filter) {
runOnDraw(new Runnable() {
@Override
public void run() {
final JImageOESFilter oldFilter = mFilterEngine;
mFilterEngine = filter;
if (oldFilter != null) {
oldFilter.destroy();
}
JLog.d("jiadongfeng4","oldfilter:"+oldFilter+" newFilter:"+mFilterEngine);
mFilterEngine.ifNeedInit();
GLES20.glUseProgram(mFilterEngine.getProgram());
mFilterEngine.onOutputSizeChanged(outputWidth, outputHeight);
}
});
}
以上代码，创建一个队列任务，当Render的onDrawFrme被调用时，会poll 出并执行这个任务，完成Opengel程序对象，也就是滤镜对象的切换
@Override
public void onDrawFrame(GL10 gl) {
...
//执行滤镜切换任务
runAll(runOnDraw);
mFilterEngine.onDraw(transformMatrix, mOESTextureId,glCubeBuffer,glTextureBuffer);
}
以上两个简单滤镜切换过程只需要，替换对应的滤镜对象即可；是简单的滤镜A-滤镜B切换的场景
代码具体实现参考 QCCamera中的JCamera2OESActivity和JImageOESGrayFilter,JImageOESRender
FBO
以上单个滤镜场景的效果，渲染操作等都是在默认的帧缓冲进行操作的，这个默认的帧缓冲是在我们创建Surface的时候自动创建和配置好的，这个OpenGL ES默认的帧缓冲是由窗口系统提供的，是默认显示到屏幕上的，也就是GlSurfaceView中的
实际应用场景中，会将几个滤镜效果叠加起来，效果叠加后，然后将最终的结果显示到屏幕上。叠加处理过程，是放到FrameBuffer中进行处理的，处理完成后，才显示到屏幕上。
这个场景是需要解决的问题是：滤镜A+B+C+D的场景，也就是滤镜组的场景 A处理-->B处理-->C处理-->显示到屏幕上
首先，定义和创建FBO
- JImageOESFilter滤镜类
//FBO对象引用
private int[] frameBuffers = new int[1];
//与FBO对象绑定的纹理id
public int[] frameBufferTextures = new int[1];
public void onOutputSizeChanged(final int width, final int height) {
outputWidth = width;
outputHeight = height;
//当surface有变化时，重新生成FBO
if (frameBuffers != null) {
destroyFramebuffers();
}
OpenGlUtils.createFrameBuffer(frameBuffers, frameBufferTextures, width, height);
}
- OpenGlUtils
public static void createFrameBuffer(int[] frameBuffer, int[] frameBufferTexture,
int width, int height) {
//产生FBO ID
GLES20.glGenFramebuffers(frameBuffer.length, frameBuffer, 0);
//产生纹理ID
GLES20.glGenTextures(frameBufferTexture.length, frameBufferTexture, 0);
for (int i = 0; i < frameBufferTexture.length; i++) {
//绑定纹理
GLES20.glBindTexture(GLES20.GL_TEXTURE_2D, frameBufferTexture[i]);
//加载图像数据, 并上传纹理
//pixels 可能是一个空指针。在这种情况下，会分配纹理内存以适应宽度width和高度的纹理height
GLES20.glTexImage2D(GLES20.GL_TEXTURE_2D, 0, GLES20.GL_RGBA, width, height, 0, GLES20.GL_RGBA, GLES20.GL_UNSIGNED_BYTE, null);
GLES20.glTexParameterf(GLES20.GL_TEXTURE_2D, GLES20.GL_TEXTURE_MAG_FILTER, GLES20.GL_LINEAR);
GLES20.glTexParameterf(GLES20.GL_TEXTURE_2D, GLES20.GL_TEXTURE_MIN_FILTER, GLES20.GL_LINEAR);
GLES20.glTexParameterf(GLES20.GL_TEXTURE_2D, GLES20.GL_TEXTURE_WRAP_S, GLES20.GL_CLAMP_TO_EDGE);
GLES20.glTexParameterf(GLES20.GL_TEXTURE_2D, GLES20.GL_TEXTURE_WRAP_T, GLES20.GL_CLAMP_TO_EDGE);
//绑定
GLES20.glBindFramebuffer(GLES20.GL_FRAMEBUFFER, frameBuffer[i]);
//将texture和level指定的纹理图像附加为当前绑定的帧缓冲区对象的逻辑缓冲区之一
GLES20.glFramebufferTexture2D(GLES20.GL_FRAMEBUFFER, GLES20.GL_COLOR_ATTACHMENT0, GLES20.GL_TEXTURE_2D, frameBufferTexture[i], 0);
//解绑纹理
GLES20.glBindTexture(GLES20.GL_TEXTURE_2D, 0);
//解绑FBO
GLES20.glBindFramebuffer(GLES20.GL_FRAMEBUFFER, 0);
}
checkGlError("createFrameBuffer");
}
GLES20.glGenFramebuffers(frameBuffer.length, frameBuffer, 0)：
第一个是要创建的帧缓存的数目；
第二个是指向存储一个或者多个ID的变量或数组的指针，它返回未使用的FBO的ID，ID为0表示默认帧缓存，即window系统提供的帧缓存
第三个参数表示framebuffer数组赋值时的偏移量，为0表示，即为frameBuffer分配frameBuffer.length个长度
GLES20.glGenTextures(frameBufferTexture.length, frameBufferTexture, 0)：
同上，产生n个纹理id
GLES20.glBindTexture(GLES20.GL_TEXTURE_2D, frameBufferTexture[i])：
绑定frameBufferTexture[i]纹理，后续所有操作都针对此纹理生效，直到调用 * GLES20.glBindTexture(GLES20.GL_TEXTURE_2D, 0)*解绑
GLES20.glTexImage2D(GLES20.GL_TEXTURE_2D, 0, GLES20.GL_RGBA, width, height, 0, GLES20.GL_RGBA, GLES20.GL_UNSIGNED_BYTE, null);
设置当前对应纹理id的纹理宽高，内容格式等，因为当前还没有内容，因此最后一个参数为null
glTexParameterf：
设置纹理的采样参数
GLES20.glBindFramebuffer(GLES20.GL_FRAMEBUFFER, frameBuffer[i])：
一旦一个FBO被创建，在使用它之前必须绑定；一旦FBO被绑定，之后的所有的OpenGL操作都会对当前所绑定的FBO造成影响；
ID号为0表示缺省帧缓存，即默认的window提供的帧缓存。因此，在glBindFramebufferEXT()中将ID号设置为0可以解绑定当前FBO；
GLES20.glFramebufferTexture2D(GLES20.GL_FRAMEBUFFER, GLES20.GL_COLOR_ATTACHMENT0, GLES20.GL_TEXTURE_2D, frameBufferTexture[i], 0)：
第一个参数一定是GL_FRAMEBUFFER
第二个参数是关联纹理图像的关联点
第三个参数textureTarget在图像情况下是GL_TEXTURE_2D
第四个参数是纹理对象的ID号
最后一个参数是要被关联的纹理的mipmap等级
通过以上操作，将把一幅纹理图像frameBufferTexture[i]关联到一个FBO frameBuffer[i]
GLES20.glBindTexture(GLES20.GL_TEXTURE_2D, 0)：
GLES20.glBindFramebuffer(GLES20.GL_FRAMEBUFFER, 0)：
解绑操作，表示接下来的opengl操作，对frameBufferTexture[i]和frameBuffer[i]再无影响
注意：跟FBO绑定的纹理ID类型为GL_TEXTURE_2D，不是GL_TEXTURE_EXTERNAL_OES类型，因此经过FBO缓存处理后的数据纹理id：frameBufferTexture,必须由OPENGL当成GL_TEXTURE_2D类型进行处理
使用FBO
JImageOESFilter
public int onDrawFBO(float[] transformMatrix, int textureId, FloatBuffer cubeBuffer, FloatBuffer textureBuffer) {
//
GLES20.glBindFramebuffer(GLES20.GL_FRAMEBUFFER, frameBuffers[0]);
//根据纹理textureId类型的不同，执行不同的逻辑
onDraw(transformMatrix, textureId, cubeBuffer, textureBuffer);
glBindFramebuffer(GL_FRAMEBUFFER, 0);
return frameBufferTextures[0];
}
GLES20.glBindFramebuffer:
绑定FBO,后续opengl所有的数据操作都在改FBO中进行
onDraw：
这里使用的纹理id类型为GL_TEXTURE_EXTERNAL_OES的例子，GL_TEXTURE_2D的处理方式大同小异，在
Camera2 教程 5：两种预览方式比较章节，我们已经讲解了两者的差异
glBindFramebuffer(GL_FRAMEBUFFER, 0)：
解绑FBO,后续opengl的操作，就跟这个没有关系了
最后返回frameBufferTextures[0]，给下一个流程或者滤镜处理
用一张图表示下FBO过程：
注意以上流程中，FBO滤镜处理后的数据是存储在FBO中的，是显示不到屏幕上的;最后一个FBO数据处理后将对应的纹理id放到Opengl中渲染才能显示到默认屏幕上
代码工程
完整的FBO例子请参考以下工程的JCamera2OESFboActivity
