教程
OpenGL ES實踐教程1-Demo01-AVPlayer
OpenGL ES實踐教程2-Demo02-攝像頭采集數(shù)據(jù)和渲染
OpenGL ES實踐教程3-Demo03-Mirror
OpenGL ES實踐教程4-Demo04-VR全景視頻播放
OpenGL ES實踐教程5-Demo05-多重紋理實現(xiàn)圖像混合
OpenGL ES實踐教程6-Demo06-全景視頻獲取焦點
OpenGL ES實踐教程7-Demo07-多濾鏡疊加處理
其他教程請移步OpenGL ES文集。
在OpenGL ES實踐教程5-Demo05-多重紋理實現(xiàn)圖像混合嘗試把兩個圖像用多重紋理的方式進行混合,這次補充介紹其他混合方式--blend混合與shader混合。
不同于多重紋理用一個shader讀取兩個紋理單元的圖像數(shù)據(jù)寒跳;
不同于濾鏡鏈,第一個濾鏡以紋理單元0為輸入屠橄,輸出到紋理單元1骤视,第二個再以紋理單元1為輸出莱没;
blend混合與shader混合是在原來的繪制基礎上扛吞,接著繪制圖形呻惕。
核心思路
- blend混合,先繪制圖形1滥比,開啟blend混合亚脆,再繪制圖形2;
- shader混合盲泛,先繪制圖形1濒持,在繪制圖形2的時候讀取圖形1的顏色值,圖形2的顏色值乘以(1 - 圖形2alpha)再加到圖形2上寺滚;
效果展示
具體細節(jié)
1柑营、blend混合
blend混合是在繪制圖形時,把要繪制的顏色與當前緩沖區(qū)里面的顏色按照特定的混合方式進行疊加村视。blend混合常用在繪制透明的圖形官套,會用到RGBA顏色空間中的alpha值。
混合過程中可以通過glBlendFunc設定對應的混合方式,常見的混合模式如下:
/* BlendingFactorDest */
#define GL_ZERO 0
#define GL_ONE 1
#define GL_SRC_COLOR 0x0300
#define GL_ONE_MINUS_SRC_COLOR 0x0301
#define GL_SRC_ALPHA 0x0302
#define GL_ONE_MINUS_SRC_ALPHA 0x0303
#define GL_DST_ALPHA 0x0304
#define GL_ONE_MINUS_DST_ALPHA 0x0305
```
其核心函數(shù)glBlendFunc的原型是
```
void glBlendFunc(GLenum sfactor,
GLenum dfactor);
```
[glBlendFunc](http://www.khronos.org/registry/OpenGL-Refpages/es2.0/xhtml/glBlendFunc.xml)的第兩個參數(shù)分別是src因子和dst因子虏杰;
src顏色指的是當前繪制顏色;
dst顏色指的是當前已有顏色勒虾;
使用glBlendFunc纺阔,需要通過`glEnable`開啟blend功能。
demo中使用的是
```
glEnable(GL_BLEND);
glBlendFunc(GL_SRC_ALPHA, GL_ONE_MINUS_SRC_ALPHA);
```
混合方式用數(shù)學公式來描述就是:**src \* src.a + dst \* (1.0 - dst.a)**
src的alpha值表示的是src顏色的不透明度修然。
####2笛钝、shader混合
shader的混合,需要用到蘋果的非標準擴展`EXT_shader_framebuffer_fetch`愕宋。
`EXT_shader_framebuffer_fetch `支持在fragment shader繪制時讀取framebuffer中的已有顏色玻靡;
非常適合做圖像混合或者其他需要以shader輸出作為輸入的圖像組合操作;
但是**不試用于多通道渲染和渲染到紋理操作**中贝。
使用時需要在fragment shader中添加
`#extension GL_EXT_shader_framebuffer_fetch : require`
引入非標準擴展`EXT_shader_framebuffer_fetch`囤捻。
通過讀取`gl_LastFragData`自建變量,可以讀取到framebuffer中的顏色值邻寿,整個fragment shader的內容如下:
```
#extension GL_EXT_shader_framebuffer_fetch : require
varying lowp vec2 varyTextCoord;
varying lowp vec2 varyOtherPostion;
uniform sampler2D myTexture1;
void main()
{
lowp vec4 text = texture2D(myTexture1, 1.0 - varyTextCoord);
text.a = 0.8;
lowp vec4 test = gl_LastFragData[0];
gl_FragColor = (1.0 - text.a) * test + text * text.a;
}
```
###總結
blend混合的優(yōu)勢在于OpenGL標準支持蝎土,但是無法支持特定的alpha值;
shader混合的優(yōu)勢在于可以任意操作顏色值绣否,比如demo就是通過讀取gl_LastFragData誊涯,然后把之前的alpha值修改為0.8,缺點在于非正式標準蒜撮,且不試用于多通道渲染和渲染到紋理操作暴构。
其他內容見demo,地址在[這里](https://github.com/loyinglin/LearnOpenGLES/tree/master/Demo08-blend%E6%B7%B7%E5%90%88%E4%B8%8Eshader%E6%B7%B7%E5%90%88)段磨。