AR实现透明视频的播放

你想使用透明的视频在你的增强现实的应用程序，使用OpenGL。 先去官网下载Demo吧：https://developer.vuforia.com/downloads/samples

提供一个背景颜色单一的视频先 http://download.csdn.net/detail/u012847940/9293245

Replace original videos in assets with your own video. (If you want to have matching video preview, you will have to replace also the .png files) If you changed the file name, make sure to update it correspondingly in the VideoPlayback Activity.Now the important part!  Android ： Open VideoPlaybackShaders and replace VIDEO_PLAYBACK_FRAGMENT_SHADER with this code:  iOS: Open  Simple.fragsh

修改代码：

public static final String VIDEO_PLAYBACK_FRAGMENT_SHADER ="#extension GL_OES_EGL_image_external : require \n" +"precision mediump float; \n" +"uniform samplerExternalOES texSamplerOES; \n" +" varying vec2 texCoord;\n" +" varying vec2 texdim0;\n" +" void main()\n\n" +" {\n" +" vec3 keying_color = vec3(0.647, 0.941, 0.29);\n" +" float thresh = 0.45; // [0, 1.732]\n" +" float slope = 0.1; // [0, 1]\n" +" vec3 input_color = texture2D(texSamplerOES, texCoord).rgb;\n" +" float d = abs(length(abs(keying_color.rgb - input_color.rgb)));\n" +" float edge0 = thresh * (1.0 - slope);\n" +" float alpha = smoothstep(edge0, thresh, d);\n" +" gl_FragColor = vec4(input_color,alpha);\n" +" }";

所以呢需要一个背景单一颜色的视频，且该单一颜色不能是视频中其它颜色一种，否则背景颜色被抠掉的同时其它颜色的一种也会抠掉。

In the keying_color variable is stored the actual color we want to replace. It is using classic RGB model, but intensity is not expressed as 0-255 integer. It is a float value in range 0-1. (So 0 = 0, 255 = 0, 122 = 0.478…) In our case, the green color has value (0.647, 0.941, 0.29), but if you are using different video, measure the color yourself.Note: Make sure you have the right color. Some color measurement software automatically converts colors to slightly different formats, such as AdobeRGB.So where’s the magic?We load current pixel color in the input_color, then calculate difference between input and keying color. Based on this difference, alpha value is calculated and used for specific pixel.You can control how strict the comparison is using the slope and threshold values. It is a bit more complicated, but the most basic rule is: The more threshold you have, the bigger tolerance.So, we are done, right? Nope.

Blending

添加代码：

To enable transparency, you need to also enable blending. Without blending, every time you write a new pixel color value, transparent or not, the old one gets deleted. So you get nice video playback, but you destroy the camera image behind it.To enable blending, insert following two lines of code into VideoPlaybackRenderer class, renderFrame method, before each of these two glUseProgram calls:GLES20.glUseProgram(keyframeShaderID);GLES20.glUseProgram(videoPlaybackShaderID);Code to insert:GLES20.glEnable(GLES20.GL_BLEND);GLES20.glBlendFunc(GLES20.GL_SRC_ALPHA, GLES20.GL_ONE_MINUS_SRC_ALPHA);First glUseProgram call is responsible for rendering png video previews. So if you don’t use transparency in you png files, you can skip that. Second call is used when rendering actual video.Regarding those two lines you have to insert: They enable blending and set it to blend pixels based on their alpha values. So the colors of pixels are not affected and only alpha values matter.Done?Not exactly. On most devices, this will do. But on some, you will still get black background instead of camera image. That’s because we turned the blending on, but we never turned it off.To turn blending off, you have to add this line after all glUseProgram(0) calls:GLES20.glDisable(GLES20.GL_BLEND);There should be three glUseProgram(0) calls, the last one is already followed by such line, so that one shouldn’t concern you.ok