目录
正文
实现绿幕抠图,其实想法很简单。 这里简单粗暴的使用着色器替换。
oes filter
直接实现在相机预览上的shader
#extension gl_oes_egl_image_external : require precision mediump float; varying vec2 vtexturecoordinate; uniform samplerexternaloes utexture; const float pixel = 30.0; void main() { vec4 tc = texture2d(utexture, vtexturecoordinate); float r = tc.x * 255.0; float g = tc.y * 255.0; float b = tc.z * 255.0; if(g>140.0 && r<128.0 && b<128.0){ tc.x =1.0; tc.y =1.0; tc.z =1.0; tc.w =0.0; }else{ tc.w =1.0; } gl_fragcolor = tc, 1.0; }
这里的关键是,判断颜色的范围。这里简单的认定 g>140.0 && r<128.0 && b<128.0 时为绿色。当是绿色的时候,就将其颜色换成白色。同时alpha值设置为0.0
blendshader filter
这个shader是将背景的纹理,进行贴图,贴到我们扣的这部分图上。
precision mediump float; varying vec2 vtexturecoord; varying vec2 vextratexturecoord; uniform sampler2d utexture; uniform sampler2d uextratexture; void main() { vec4 base = texture2d(utexture, vtexturecoord); vec4 overlay = texture2d(uextratexture, vextratexturecoord); vec4 outputcolor; if(base.r==1.0 && base.g==1.0 && base.b==1.0 && base.a==0.0){ outputcolor.r = base.a*base.r overlay.r * (1.0 - base.a); outputcolor.g = base.a*base.g overlay.g * (1.0 - base.a); outputcolor.b = base.a*base.b overlay.b * (1.0 - base.a); outputcolor.a = base.a; }else{ outputcolor.r = base.r; outputcolor.g = base.g; outputcolor.b = base.b; outputcolor.a = base.a; } gl_fragcolor = outputcolor; }
这个shader就是加载了两个贴图。一个是来自上面相机的fbo的offscreentextureid,一个是来自我们另外的背景贴图。 这段代码就算,如果是辨认到之前我们处理的区域的话,就将两个图片贴加到一起,如果是范围内,就用原来的图片。
简单的绿幕抠图很简单,只是判断到对应的颜色,然后将对应的贴图贴到这个部分上,就可以了。
最后的效果
- 屏幕中的原图
最后的效果
缺陷
边缘情况比较明显。显示比较突兀。 我们可以做的更好吗?
更多关于android opengl es绿幕抠图的资料请关注其它相关文章!