Android OpenGL ES实现简单绿幕抠图

目录
  • 正文
    • OES Filter
    • BlendShader Filter
    • 最后的效果
    • 缺陷

正文

实现绿幕抠图，其实想法很简单。 这里简单粗暴的使用着色器替换。

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绿幕抠图的资料请关注我们其它相关文章！

赞 (0)

相关推荐

  • Android OpenGLES如何给相机添加滤镜详解

    Android OpenGLES如何给相机添加滤镜详解

    滤镜介绍 目前市面上的滤镜有很多,但整体归类也就几样,都是在fragment shader中进行处理.目前滤镜最常用的就是 lut滤镜以及调整RGB曲线的滤镜了.其他的类型变更大同小异. 动态滤镜的构建 为了实现动态下载的滤镜,我们接下来实现一套滤镜的json参数,主要包括滤镜类型.滤镜名称.vertex shader.fragment shader 文件.统一变量列表.与统一变量绑定的纹理图片.默认滤镜强度.是否带纹理宽高偏移量.音乐路径.音乐是否循环播放等参数. json 以及各个字段的介绍

  • Opengl ES之纹理贴图使用示例

    Opengl ES之纹理贴图使用示例

    目录 正文 纹理坐标 纹理环绕 纹理过滤 纹理单元 Opengl中纹理的使用 纹理坐标映射关系 正文 纹理可以理解为一个二维数组,它可以存储大量的数据,这些数据可以发送到着色器上.一般情况下我们所说的纹理是表示一副2D图,此时纹理存储的数据就是这个图的像素数据. 所谓的纹理贴图,就是使用Opengl将这个纹理数据渲染出来,这个过程有点像装修工人给墙体贴瓷砖,而瓷砖好比作纹理. 纹理坐标 如果为了将一副纹理图贴到Opengl绘制的一个矩形上,那么就需要解决一个问题,如何知道矩形的具体某个点对应纹理

  • Android OpenGL ES 实现抖音传送带特效(原理解析)

    Android OpenGL ES 实现抖音传送带特效(原理解析)

    目录 抖音传送带特效原理 抖音传送带特效实现 抖音 APP 真是个好东西,不过也容易上瘾,老实说你的抖音是不是反复卸载又反复安装了,后来我也发现我的几个 leader 都不刷抖音,这令我挺吃惊的. 我刷抖音主要是为了看新闻,听一些大 V 讲历史,研究抖音的一些算法特效,最重要的是抖音提供了一个年轻人的视角去观察世界.另外,自己感兴趣的内容看多了,反而训练抖音推送更多类似的优质内容,大家可以反向利用抖音的这一特点. 至于我的 leader 老是强调刷抖音不好,对此我并不完全认同. 抖音传送带特效原

  • 在iOS中使用OpenGL ES实现绘画板的方法

    今天我们使用 OpenGL ES 来实现一个绘画板,主要介绍在 OpenGL ES 中绘制平滑曲线的实现方案. 首先看一下最终效果: 在 iOS 中,有很多种方式可以实现一个绘画板,比如我的另外一个项目 MFPaintView 就是基于 CoreGraphics 实现的. 然而,使用 OpenGL ES 来实现可以获得更多的灵活性,比如我们可以自定义笔触的形状,这是其他实现方式做不到的. 我们知道,OpenGL ES 中只有 点.直线.三角形 这三种图元.因此, 怎么在 OpenGL ES 中绘

  • OpenGL中点Bresenham绘制直线算法

    本文实例为大家分享了OpenGL中点Bresenham绘制直线算法,供大家参考,具体内容如下 环境 macos xcode编译器 代码 #include <GLUT/GLUT.h> #include <iostream> #include<iostream> #include<cstdlib> #include<ctime> using namespace std; float wid = 400; //设置窗口的大小,约定窗口必须为正方形 fl

  • 一文详解 OpenGL ES 纹理颜色混合的方法

    一文详解 OpenGL ES 纹理颜色混合的方法

    目录 一.混合API 二.参数含义 2.1 举个栗子 2.2 参数含义 三. 几种常用混合方式效果 3.1 混合(GL_ONE, GL_ZERO) 3.2 混合(GL_ONE, GL_ONE) 3.3 混合(GL_ONE, GL_ONE_MINUS_DST_ALPHA) 3.4 混合 (GL_SRC_ALPHA, GL_ONE) 3.5 混合 (GL_SRC_ALPHA, GL_ONE_MINUS_SRC_ALPHA) 在OpenGL中绘制的时候,有时候想使新画的颜色和已经有的颜色按照一定的方式

  • Android OpenGL ES实现简单绿幕抠图

    Android OpenGL ES实现简单绿幕抠图

    目录 正文 OES Filter BlendShader Filter 最后的效果 缺陷 正文 实现绿幕抠图,其实想法很简单. 这里简单粗暴的使用着色器替换. OES Filter 直接实现在相机预览上的Shader #extension GL_OES_EGL_image_external : require precision mediump float; varying vec2 vTextureCoordinate; uniform samplerExternalOES uTexture;

  • OpenCV去除绿幕抠图源码

    OpenCV去除绿幕抠图源码

    绿布原图 抠图后的图片 源码 #include <opencv2/opencv.hpp> #include <iostream> #include <vector> #include <cstdio> #include <cstring> using namespace cv; using namespace std; int main() { //1.设置需要去除的颜色 //2.颜色比对 //3.展示效果 //只有png有透明度空间,jpg是没

  • Android openGl 绘制简单图形的实现示例

    学习五部曲,弄清楚5个W一个H(when(什么时候使用).where(在哪个地方使用?).who(对谁使用).what(是个什么东西).why(为什么要这么用?).一个H即:how(到底该怎么用?)),基本的概念篇主要围绕这几个方面进行分析 1. What? openGl是什么?openGl ES又是什么? 相信很多人从事开发的都或多或少听到过有关OpenGl这个东西,但是平时用的少,只知道有这么个东西,而且学起来不简单,所以大多数人都不能讲出个个所以然来. 官方对OpenGl的描述为: Ope

  • android使用OPENGL ES绘制圆柱体

    android使用OPENGL ES绘制圆柱体

    本文实例为大家分享了android使用OPENGL ES绘制圆柱体的具体代码,供大家参考,具体内容如下 效果图: 编写jiem.java *指定屏幕所要显示的假面,并对见.界面进行相关设置     *为Activity设置恢复处理,当Acitvity恢复设置时显示界面同样应该恢复     *当Activity暂停设置时,显示界面同样应该暂停 package com.scout.eeeeeee; import android.app.Activity; import android.os.Bund

  • Android开发 OpenGL ES绘制3D 图形实例详解

    Android开发 OpenGL ES绘制3D 图形实例详解

    OpenGL ES是 OpenGL三维图形API 的子集,针对手机.PDA和游戏主机等嵌入式设备而设计. Ophone目前支持OpenGL ES 1.0 ,OpenGL ES 1.0 是以 OpenGL 1.3 规范为基础的,OpenGL ES 1.1 是以 OpenGL 1.5 规范为基础的.本文主要介绍利用OpenGL ES绘制图形方面的基本步骤. 本文内容由三部分构成.首先通过EGL获得OpenGL ES的编程接口;其次介绍构建3D程序的基本概念;最后是一个应用程序示例. OpenGL E

  • 通过OpenGL ES混合模式缩放视频缓冲区来适应显示尺寸

    通过OpenGL ES混合模式缩放视频缓冲区来适应显示尺寸

    当开发基于软件模式的游戏时,通过缩放视频缓冲区来适应显示尺寸是最棘手的问题之一.当面对众多不同的分辨率时(比如开放环境下的Android),该问题会变得更加麻烦,作为开发人员,我们必须尝试在性能与显示质量之间找到最佳平衡点.正如我们在第2章中看到的,缩放视频缓冲区从最慢到最快共有3种类型. 软件模拟:3中类型中最慢,但最容易实现,是没有GPU的老款设备上的最佳选择.但是现在大部分智能手机都支持硬件加速. 混合模式:这种方式混合使用软件模拟(创建图像缓冲区)和硬件渲染(向显示屏绘制)两种模式.这种

  • OpenGL ES纹理详解

    OpenGL ES纹理详解

    使用前面学过的技术已经可以利用OpenGL ES构建立体图形,并通过顶点着色器和片元着色器对其进行各种变化呢和光照等效果使得三维效果更加真实,实际上我看看到很多的3D游戏漂亮多了,那是因为有各种各样的漂亮的图像带给人很多视觉盛宴,这篇文章在前面的基础上,增加物体的表面贴图,使得物体更加好看. 纹理概念 纹理用来表示图像照片或者说一系列的数据,使用纹理可以使物体用用更多的细节.OpenGL ES 2.0 中有两种贴图:二维纹理和立方体纹理. 每个二维纹理都由许多小的纹理元素组成,类似与片元和像素,

  • java基于OpenGL ES实现渲染实例

    本文实例讲述了java基于OpenGL ES实现渲染的方法.分享给大家供大家参考.具体如下: 1. Run.java文件: package net.obviam.opengl; import android.app.Activity; import android.opengl.GLSurfaceView; import android.os.Bundle; import android.view.Window; import android.view.WindowManager; public

  • java实现OpenGL ES纹理映射的方法

    本文实例讲述了java实现OpenGL ES纹理映射的方法.分享给大家供大家参考.具体如下: 1. GlRenderer.java文件: package net.obviam.opengl; import javax.microedition.khronos.egl.EGLConfig; import javax.microedition.khronos.opengles.GL10; import android.content.Context; import android.opengl.GL

随机推荐