openframeworks 使用glslsandbox里面的shader

</pre>glslsandbox里面有很多很炫酷的shader，把它用在程序中有一个很简单的方法。<p></p><p>利用openframeworks的addon：ofxGLSLSandbox。</p><p>glsl官网：http://glslsandbox.com/。</p><p>插件地址：http://www.ofxaddons.com/。</p><p>首先把glslsandbox网站上你喜欢的效果的代码复制到shader文件中：</p><p><pre name="code" class="cpp">#ifdef GL_ES
precision mediump float;
#endif

//Mode7 test

uniform float time;
uniform vec2 mouse;
uniform vec2 resolution;
void main( void ) {

	vec2 position = ( gl_FragCoord.xy / resolution.xy );
	//x' = (a*x-x0)+(b*y-y0)+x0
	//y' = (c*x-x0)+(d*y-y0)+y0
	vec2 origin = vec2(0.5,0);
	vec2 delta = position - origin;
	vec4 transMat = vec4(4.0,0.0,0.0,1.0);
	
	vec2 transform = vec2(
		transMat.x * delta.x + transMat.y * delta.y + origin.x,
		transMat.z * delta.x + transMat.w * delta.y + origin.y);
	vec2 persp = vec2(
		(0.5-transform.x)/(1.0-transform.y),
		1.0/(1.0-transform.y));
	mat2 rot = mat2(
		cos(time),-sin(time),
		sin(time),cos(time)
		);
	vec2 post = persp * rot; //+ vec2(sin(time),time*2.0) +
	
	if(position.y < persp.y)
		gl_FragColor = vec4(vec3(sin(post.x * 15.0),sin(post.y * 15.0),0.0),1.0);
	else
		gl_FragColor = vec4(0.7,0.7,1.0,1.0);
}

在openframeworks的项目中：

一：初始化glslsandbox

    width = _width;
    height = _height;
    fbo.allocate(width, height);

shader画在fbo里面，先定义fbo的大小。

二：载入shader：

shader.load(shaderfile);
string command = "open ../../../data/" + shaderfile;
    system(command.c_str());

三：把为shader里面的变量复制并绘制：

    float resolution[] = {width, height};
    float mousePoint[] = {mouse.x, mouse.y};
    float time = ofGetElapsedTimef();
    
    fbo.begin();
    shader.begin();
    shader.setUniform1f("time", time);
    shader.setUniform2fv("resolution", resolution);
    shader.setUniform2fv("mouse", mousePoint);
    ofRect(0, 0, ofGetWidth(), ofGetHeight());
    shader.end();
    fbo.end();
    
    fbo.draw(0, ofGetHeight(), ofGetWidth(), -ofGetHeight());

我们可以通过控制shader的参数来改变shader的效果，openframeworks中update（）优化了参数的运算，所以最好是在update（）中去改变传值，draw（）方法优化绘制，然后在draw中去绘制shader。

by：zxy