Custom Shader Support

Storyboard supports custom OpenGL ES shaders written in GLSL. Shader programs can be attached to controls by creating a vertex and fragment shader program. These programs are then compiled at runtime and used by the Storyboard Engine. When creating a shader the uniforms can be manipulated in Storyboard Designer through variables. The naming of the shader uniform determines how it's variable is resolved. All shader variables must be float type variables. The uniform naming can be prefixed in order to tell Storyboard which context to resolve the variable:

grd_aThis variable is resolved at the Application level
grd_lThis variable is resolved at the Layer level (layer where the control is)
grd_gThis variable is resolved at the Group level (group where the control is)
grd_cThis variable is resolved at the control level (control where the shader is connected). This is the default if no prefix is used.

Fragment shader Example:

All variables can be created at the application level. The variables would be:


The program would be:

uniform float grd_a_r;
uniform float grd_a_g;
uniform float grd_a_b;
uniform float grd_a_a;

void main (void)
    gl_FragColor = vec4(grd_a_r, grd_a_g, grd_a_b, grd_a_a);

Vertex shader Example:

attribute vec4 myVertex;
attribute vec4 myUV;

varying vec2 myTexCoord;

uniform mat4 projMatrix;
uniform mat4 mvMatrix;

void main(void)
    gl_Position = projMatrix * mvMatrix * myVertex;
    myTexCoord =;