专栏首页小黑娃HenryOpenGL(七)- 渲染技巧:颜色混合OpenGL(七)- 渲染技巧:颜色混合

OpenGL(七)- 渲染技巧:颜色混合OpenGL(七)- 渲染技巧:颜色混合

OpenGL(七)- 渲染技巧:颜色混合

我们都知道颜色缓存区和深度缓冲区原理一致,在同一个位置上只能保存一个值。那么我们常见的透明图层相互之间的影响又是为什么呢?

  • 首先通过之前的知识来接单解读一下两个不透明的图层相互重叠时系统做了什么?
  • 如果其中一块为50%透明

如果这种情况出现,我们依旧是进行深度测试,丢弃蓝色部分就不合理了。现在要做的就是需要将两个颜色进行混合才为更为合理,但计算机并没有那么智能需要开发者来进行混合后颜色的计算。

当然OpenGL也考虑到了这一点:

void RenderScene(void){
    //1.清空颜色缓存区
    glClear(GL_COLOR_BUFFER_BIT)
    //2.开启混合
    glEnable(GL_BLEND);
    //3.指定组合函数,有系统来计算混合结果
    glBlandFunc(GL_SRC_ALPHA,GL_ONE_MINUS_SRC_ALPHA);
    //4.指定混合方程函数,一般不需要设置
    glBlendEquation(GL_FUNC_ADD);
    //4.关闭
    glDisable(GL_BLAND);
}
glBlendEquation(GLenum mode)

一般不需要设置,系统默认使用 GL_FUNC_ADD

glBlandFunc(GLenum sfactor, GLenum dfactor)

其他API相信已经见过很多次了,只有glBlandFunc以及参数需要解释一下。

API中进行计算时根据公式:

Cf = (Cs * S) + (Cd * D) Cf表示: 计算后的最终颜色 Cs表示: 源颜色,也就是渲染命令中后传入的颜色 S表示: 源混合因子 Cd表示: 目标颜色,也就是已经保存在颜色混合区中的颜色。要注意这个位置的颜色和图层的前后并无关系。之和渲染的先后有关。 D表示: 目标混合因子

  • 对应上方公式开发者能操作的其实只有S、D这两个混合因子,下图是API中两个参数的参数表。

R、G、B、A表示: 红、绿、蓝、透明度 S、D表示: 源、目标 C 代表常量(一般为黑色)

几种参数尝试
//使用默认参数的情况
glBlendFunc(GL_SRC_ALPHA, GL_ONE_MINUS_SRC_ALPHA);
//使用其他参数的情况
glBlendFunc(GL_CONSTANT_ALPHA, GL_CONSTANT_ALPHA);

情况很多就不一一实验,一般使用的默认值 glBlandFunc(GL_SRC_ALPHA,GL_ONE_MINUS_SRC_ALPHA);

枚举值套入公式

使用默认参数,举例: 源颜色(CS)为: (1.0f,0.5f,0.0f, 0.6f) 目标颜色(CD)为:(0f,1.0f,0.5f, 1.0f) S(源因子)为: 0.6f D(目标因子)为: 1-0.6f(源透明度) = 0.4f 结果 = (源颜色 * 0.6f) + (目标颜色 * 0.4f)

  • 通过计算可知:
  1. 源因子的Alpha越大,则目标颜色保留成分越少
  2. 若果源因子的Alpha为1,则目标颜色设置无效,也就是被覆盖。开启混合后这种情况依旧会进行混合计算。所以颜色混合一般用在:一个半透明/不透明的物体前面绘制一个半透明的物体。

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • OpenGLES(七)-GLSL案例:纹理颜色混合OpenGLES(七)-GLSL案例:纹理颜色混合

    用户8893176
  • 终端图像处理系列 - OpenGL混合模式的使用

    OpenGL一次渲染过程包含了多个阶段,包括顶点着色器、图元组装、栅格化、片元着色器、测试和混合等,最后将结果输出的FrameBuffer上。

    天天P图攻城狮
  • Metal入门教程(八)Metal与OpenGL ES交互

    UIImage是我们常用的图像类,可以转成CVPixelBufferRef,表示存储在内存的图像数据; id<MTLTexture> 是Metal的纹理,表示...

    落影
  • 【iOS】OpenGL入门资料整理

    在应用程序调用任何OpenGL执行之前,首先需要创建一个OpenGL的上下文。这个上下文是一个非常庞大的状态机,保存了OpenGL中的各种状态,这也是OpenG...

    MapleYe
  • 20分钟让你了解OpenGL ——OpenGL全流程详细解读

    | 导语 对于开发者来说,学习OpenGL或者其他图形API都不是一件容易的事情。即使是一些对OpenGL有一些经验的开发者,往往也未必对OpenGL有完整、...

    腾讯Bugly
  • 视频直播与虚拟现实的渲染 - OpenGL ES

    这是一篇OpenGL ES的学习笔记,介绍图像绘制里面用到的概念,学习OpenGL ES的基础知识备忘录。 教程 OpenGLES入门教程1-Tutorial0...

    落影
  • 音视频技术基础(四)-- OpenGL

    既然是学习音视频技术,那必然少不了渲染这个环节,OpenGL就是进行图形渲染的一个重要角色。

    黑眼圈云豆
  • OpenGL与OpenGL在移动端的应用

    OpenGL首先我们从字面意思来理解:Open Graphics Library,开放的图形库,图形库自然是处理图形的,所以简单来说OpenGL就是用来处理图形...

    清墨
  • OpenGL ES实践教程(八)blend混合与shader混合

    教程 OpenGL ES实践教程1-Demo01-AVPlayer OpenGL ES实践教程2-Demo02-摄像头采集数据和渲染 OpenGL ES实践...

    落影
  • iOS界面渲染流程分析

    在最近的面试中,我发现一道面试题,其考点是:围绕iOS App中一个视图从添加到完全渲染,在这个过程中,iOS系统都做了什么?

    筑梦师winston
  • OpenGL ES 2.0 Using Modern Mobile Graphics Hardware

    四. 问题:CPU 和 GPU 的 Memory 是有数据交换的,这种交换不会出问题吗?CPU 和 GPU 的计算速度一样吗?

    半纸渊
  • OpenGL ES初探:渲染流程及GLKit简介

    OpenGL是一套多功能开放标准库,用于处理可视化2D和3D数据。OpenGL可以将调用函数转换成图形处理命令并传送给底层图形硬件,因此OpenGL的绘制效率非...

    CC老师
  • iOS开发-OpenGLES进阶教程4

    教程 OpenGLES入门教程1-Tutorial01-GLKit OpenGLES入门教程2-Tutorial02-shader入门 OpenGLES入门...

    落影
  • OpenGL ES实践教程(三)镜子效果

    教程 OpenGLES实践教程1-Demo01-AVPlayer OpenGL ES实践教程2-Demo02-摄像头采集数据和渲染 其他教程请移步OpenG...

    落影
  • OpenGL(六)-- 渲染技巧:正背面剔除、深度测试、多边形偏移OpenGL(六)-- 渲染技巧:正背面剔除、深度测试、多边形偏移

    通过一个基础案例来了解这些渲染技巧:正背面剔除、深度测试、多边形偏移。应该更容易理解。

    用户8893176
  • 日迹中视频编辑滤镜效果实现方法

    导语 本文简要分析,日迹视频解码流程以及视频滤镜的实现原理 需求背景:日迹需要的编辑滤镜效果预览图 图1:日迹滤镜效果 要实现产品想要的...

    MelonTeam
  • Android图像处理系列:OpenGL深度测试的应用

    什么是深度测试? 深度测试是指检测从某个方向看过去时,两个点A和B谁在谁的前面,以便知道谁挡住了谁,被挡住的点一般不会进行绘制,以达到和真实世界一样的遮挡效...

    天天P图攻城狮
  • 【Android 音视频开发打怪升级:OpenGL渲染视频画面篇】五、OpenGL FBO数据缓冲区

    上一篇文章,讲解了如何使用EGL,并且提到EGL可以建立一个离屏渲染的缓冲区,这种离屏渲染的方式通常用于模拟整个渲染窗口,比如可以用于FFmpeg软编码,将显示...

    开发的猫
  • OpenGL 系列---基础绘制流程

    OpenGL 是一种应用程序编程接口,它是一种可以对图形硬件设备特性进行访问的软件库。

    音视频开发进阶

扫码关注云+社区

领取腾讯云代金券