# Shader Usage in Candera

#### <a class="anchor" id="bkmrk--7"></a>Description

This chapter demonstrates how customized shader programs can be used with <span style="color: rgb(230,126,35);">[Candera](http://dev.doc.cgistudio.at/APILINK/namespace_candera.html "[DataBinding_RefTypeSample]")</span>. Subject of this chapter depicts how to use the <span style="color: rgb(230,126,35);">[Candera](http://dev.doc.cgistudio.at/APILINK/namespace_candera.html "[DataBinding_RefTypeSample]")</span> classes to set custom shaders for each node, and how to apply shader parameters. Further, it shows how to realize different classes of effects, namely single pass-, local multi pass- and global multi pass effects.

#### **Shader Related Class Usage**

This section is about on how the already introduced <span style="color: rgb(230,126,35);">[Candera::Appearance](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_appearance.html "The class Appearance groups following render attributes: Material, Textures, RenderMode, and Shader. Render attributes define the distinctive visualization of a geometry like Mesh, Billboard, and PointSprite. Further, render attributes can be shared across multiple objects, which conserves memory and enables sharing of appearance characteristics. An Appearance object is mandatory for any object in order to get rendered. Per default all render attributes are initialized to null, which is a valid setting. If the Appearance is activated, all render attributes that are set become activated. If no RenderMode is defined (null), then the default RenderMode is used instead;.")</span> class and its members can be used to realize customized shader effects.

##### <a class="anchor" id="bkmrk--9"></a>Loading shader programs

First step to realize shader programs is to actually write them. See the <span style="color: rgb(230,126,35);">[GLSL chapter](https://doc316en.candera.eu/books/candera/page/the-opengl-es-shading-language)</span> for details on that. For a developer it is recommended to develop using SceneComposer, where the effects can be seen immediately in the Scene Editor window.

This tutorial further focuses on programming with <span style="color: rgb(230,126,35);">[Candera](http://dev.doc.cgistudio.at/APILINK/namespace_candera.html "[DataBinding_RefTypeSample]")</span>, but the concepts are supported as well in collaboration with SceneComposer. Beside of SceneComposer's shader editor, shader authoring tools like <span style="color: rgb(230,126,35);">[AMD's RenderMonkey](#bkmrk-references)</span> can also be used. Benefits from using either SceneComposer or shader authoring tools are syntax highlighting, seeing compiler and linker errors and having a preview scene where the effect can be examined. One unique advantage of using SceneComposer is the support for device dependent shader compilers.

After having finished your shader program you need to load it in your application based on <span style="color: rgb(230,126,35);">[Candera](http://dev.doc.cgistudio.at/APILINK/namespace_candera.html "[DataBinding_RefTypeSample]")</span>. Use your favorite file I/O libraries among the available ones. It depends on the platform if the underlying OpenGL ES implementation needs the shader source or pre-compiled shader objects. On host you typically load the source of your shader program directly, it will be compiled and linked at runtime by the OpenGL driver invoked by Candera's Upload mechanisms. On targets you might need to provide pre-compiled shader objects, where pre-compiling is done using dedicated shader compile tools. Please refer to the device manufacturers manual.

##### <a class="anchor" id="bkmrk--10"></a>Using Candera::Shader

[Candera::Shader](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_shader.html "The class Shader is an Appearance component representing a graphical processing unit (GPU) program...") is the class that abstracts from OpenGL ES shader interfaces and manages the shaders handle after creation. For a small description see <span style="color: rgb(230,126,35);">[the tutorial on the Appearance class](https://doc316en.candera.eu/link/448#bkmrk-appearance%3A-shader%C2%A0)</span>. See below how to use the class.

First you need to create an instance of the <span style="color: rgb(230,126,35);">[Candera::Shader](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_shader.html "The class Shader is an Appearance component representing a graphical processing unit (GPU) program...")</span> class using its <span style="color: rgb(230,126,35);">[Create()](http://dev.doc.cgistudio.at/APILINK/group___c_o_u_r_i_e_r___v_i_s_u_a_l_i_z_a_t_i_o_n.html#ggaf0e93dc4242f607c3c8d13dafd036af9aaabfa5309af24986d3111a092449f857)</span> method.

```
static MemoryManagement::SharedPointer<Shader> <a class="code" href="http://dev.doc.cgistudio.at/APILINK/group___c_o_u_r_i_e_r___v_i_s_u_a_l_i_z_a_t_i_o_n.html#ggaf0e93dc4242f607c3c8d13dafd036af9aaabfa5309af24986d3111a092449f857">Create</a>();
```

Next step is to provide the loaded shader sources or objects to the class using the according setters:

```
bool SetVertexShader(const void* vertexShader, DisposerFn disposerFn);
bool SetFragmentShader(const void* fragmentShader, DisposerFn disposerFn);
```

<div class="contents" id="bkmrk-the-shaders-are-pass"><div class="contents"><div class="textblock"><div class="fragment">  
</div></div><div class="textblock"><dl class="note"><dt></dt><dd><p class="callout info">The shaders are passed as *void\** to ensure that platform dependent representations of the shader program can be passed. The parameter DisposerFn hands over lifetime responsibility of shader passed: If it's set to 0 you'll have to take care of the provided *void\** by yourself.</p>

</dd></dl></div></div></div>Finally, the shader needs to be associated to a node's appearance in order to leave the remaining steps (like Uploading and further Activating) to <span style="color: rgb(230,126,35);">[Candera](http://dev.doc.cgistudio.at/APILINK/namespace_candera.html "[DataBinding_RefTypeSample]")</span>. Upload takes care of compiling, linking, and retrieving the shaders handle. Vertex attribute binding is done in the appearances activation method, automatically.

The following code snippet demonstrates how a Billboard node with a custom shader can be created.

```
void Initialize() {
    Char* vertexShader = "";
    Char* fragmentShader = "";
    // Do File I/O here, filling vertexShader and fragmentShader with the read data.

    Scene* scene = <a class="code" href="http://dev.doc.cgistudio.at/APILINK/group___c_o_u_r_i_e_r___v_i_s_u_a_l_i_z_a_t_i_o_n.html#ggaf0e93dc4242f607c3c8d13dafd036af9aaabfa5309af24986d3111a092449f857">Scene::Create</a>();
    //Do camera setup here, add it to scene graph.

    SharedPointer<Shader> shader = <a class="code" href="http://dev.doc.cgistudio.at/APILINK/group___c_o_u_r_i_e_r___v_i_s_u_a_l_i_z_a_t_i_o_n.html#ggaf0e93dc4242f607c3c8d13dafd036af9aaabfa5309af24986d3111a092449f857">Shader::Create</a>();
    shader->SetVertexShader(vertexShader, 0); //vertexShader needs to be disposed manually.
    shader->SetFragmentShader(fragmentShader, 0); //fragmentShader needs to be disposed manually.

    Billboard* billboard = <a class="code" href="http://dev.doc.cgistudio.at/APILINK/group___c_o_u_r_i_e_r___v_i_s_u_a_l_i_z_a_t_i_o_n.html#ggaf0e93dc4242f607c3c8d13dafd036af9aaabfa5309af24986d3111a092449f857">Billboard::Create</a>(2.0f, 2.0f);
    billboard->SetAppearance(<a class="code" href="http://dev.doc.cgistudio.at/APILINK/group___c_o_u_r_i_e_r___v_i_s_u_a_l_i_z_a_t_i_o_n.html#ggaf0e93dc4242f607c3c8d13dafd036af9aaabfa5309af24986d3111a092449f857">Appearance::Create</a>());
    billboard->GetAppearance()->SetShader(shader); //Here the previously instantiated and configured shader is added.
    //Set and configure remaining appearance members.

    scene->AddChild(billboard);

    scene->UploadAll(); //All nodes, all their Appearance objects and therefore all set shader objects get uploaded.

}

void Render() {
    Renderer::RenderAllCameras(); //Here the scene graph gets traversed, for every node the shaders get activated, and the vertex buffers attribute get bound
                                  //to the shaders attributes.
}
```

##### <a class="anchor" id="bkmrk--11"></a>Auto Uniforms

<span style="color: rgb(230,126,35);">[Candera::ShaderParamSetter](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_shader_param_setter.html "ShaderParamSetter maintains a list of uniform parameters that are passed to a Shader.")</span> and derived classes are used to set uniform parameters of shaders, they abstract from OpenGL ES's glUniform\_ interfaces. They are part of a node's appearance, how to use them is already described in the <span style="color: rgb(230,126,35);">[Appearance Tutorial](https://doc316en.candera.eu/link/448#bkmrk-appearance%3A-shader-p)</span>.

As described the derived class <span style="color: rgb(230,126,35);">[Candera::GenericShaderParamSetter](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_generic_shader_param_setter.html "GenericShaderParamSetter bundles uniform shader parameters that are calculated by Candera...")</span> offers to automatically compute and set shader parameters from the configured scene graph. The following table shows which uniforms are reserved for this purpose, what <span style="color: rgb(230,126,35);">[Candera](http://dev.doc.cgistudio.at/APILINK/namespace_candera.html "[DataBinding_RefTypeSample]")</span> classes they affect and what their semantics are.

<div class="contents" id="bkmrk-note%3A-the-values-of-"><div class="contents"><div class="textblock"><dl class="note"><dt>**Note:**</dt><dd>The values of reserved variables cannot be edited in SceneComposer, here the <span style="color: rgb(230,126,35);">[Candera::GenericShaderParamSetter](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_generic_shader_param_setter.html "GenericShaderParamSetter bundles uniform shader parameters that are calculated by Candera...")</span> has to be used.</dd></dl></div></div></div>The table is structured as follows:

<div class="contents" id="bkmrk-column-uniform-varia"><div class="contents"><div class="textblock">- Column **Uniform Variable** is the name of the reserved variable.
- Column **Data Type** describes its data type.
- Column **GenericShaderParamSetter Flag** describes which properties have to be enabled in <span style="color: rgb(230,126,35);">[Candera::GenericShaderParamSetter](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_generic_shader_param_setter.html "GenericShaderParamSetter bundles uniform shader parameters that are calculated by Candera...")</span> in order to compute and set the variable.
- Column **Affected Classes** describes which classes are used to compute the parameters.
- The last parameter **Semantic** describes for what purpose this parameter is needed.

</div></div></div><div class="contents" id="bkmrk-if-no-instance-of-th"><div class="contents"><div class="textblock"><dl class="note"><dt></dt><dd><p class="callout info">If no instance of the affected classes exist, the corresponding shader parameters will not be set, even if they are enabled in <span style="color: rgb(230,126,35);">[Candera::GenericShaderParamSetter](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_generic_shader_param_setter.html "GenericShaderParamSetter bundles uniform shader parameters that are calculated by Candera...")</span>.</p>

</dd></dl></div></div></div><div class="contents" id="bkmrk-uniform-variable-dat"><div class="contents"><div class="textblock"><table style="width: 100%; height: 2587.34px;"><tbody><tr style="background-color: #d4d4d4; height: 63.3906px;"><th style="width: 13.23%; height: 63.3906px;">Uniform Variable</th><th style="width: 10.4887%; height: 63.3906px;">Data Type</th><th style="width: 11.7998%; height: 63.3906px;">GenericShaderParamSetter Flag</th><th style="width: 19.6663%; height: 63.3906px;">Affected Classes</th><th style="width: 44.9344%; height: 63.3906px;">Semantic</th></tr><tr style="height: 66.3906px;"><td style="width: 13.23%; height: 66.3906px;">u\_MMatrix3</td><td style="width: 10.4887%; height: 66.3906px;">Matrix3</td><td style="width: 11.7998%; height: 66.3906px;">ModelMatrix3Enabled</td><td style="width: 19.6663%;"><span style="color: rgb(230,126,35);">[Candera::Node](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_node.html "The class Node is an abstract base class for all scene graph nodes. Each Node defines a local coordin...")</span></td><td style="width: 44.9344%; height: 66.3906px;">Computes the ModelMatrix3 from the Node's transformation data, used to transform 3-component vectors from model to world space.</td></tr><tr style="height: 83.1875px;"><td style="width: 13.23%; height: 83.1875px;">u\_MVMatrix3</td><td style="width: 10.4887%; height: 83.1875px;">Matrix3</td><td style="width: 11.7998%; height: 83.1875px;">ModelViewMatrix3Enabled</td><td style="width: 19.6663%;"><span style="color: rgb(230,126,35);">[Candera::Node](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_node.html "The class Node is an abstract base class for all scene graph nodes. Each Node defines a local coordin...")</span>, <span style="color: rgb(230,126,35);">[Candera::Camera](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_camera.html "A Camera provides Modelview and Projection matrices. Camera is a Transformable.* The eye point is set...")</span></td><td style="width: 44.9344%; height: 83.1875px;">Computes the ModelViewMatrix3 from the Node's transformation data and the currently rendered Camera's ViewMatrix. Used to transform 3-component vectors from model to view space.</td></tr><tr style="height: 83.1875px;"><td style="width: 13.23%; height: 83.1875px;">u\_NormalMMatrix3</td><td style="width: 10.4887%; height: 83.1875px;">Matrix3</td><td style="width: 11.7998%; height: 83.1875px;">NormalModelMatrix3Enabled</td><td style="width: 19.6663%;"><span style="color: rgb(230,126,35);">[Candera::Node](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_node.html "The class Node is an abstract base class for all scene graph nodes. Each Node defines a local coordin...")</span></td><td style="width: 44.9344%; height: 83.1875px;">Computes the NormalModelMatrix3 from the Node's transformation data, used to transform 3-component directional vectors (especially normals) from model to world space.</td></tr><tr><td style="width: 13.23%; border-width: 1px;">u\_NormalMMatrix4</td><td style="width: 10.4887%; border-width: 1px;">Matrix4</td><td style="width: 11.7998%; border-width: 1px;">NormalModelMatrix4Enabled</td><td style="width: 19.6663%; border-width: 1px;"><span style="color: rgb(230,126,35);">[Candera::Node](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_node.html "The class Node is an abstract base class for all scene graph nodes. Each Node defines a local coordin...")</span></td><td style="width: 44.9344%; border-width: 1px;"><span style="vertical-align: inherit;"><span style="vertical-align: inherit;">Computes the NormalModelMatrix4 (4×4 normal-transform matrix) from the node’s transform and passes it to the shader.</span></span></td></tr><tr style="height: 99.9844px;"><td style="width: 13.23%; height: 99.9844px;">u\_NormalMVMatrix3</td><td style="width: 10.4887%; height: 99.9844px;">Matrix3</td><td style="width: 11.7998%; height: 99.9844px;">NormalModelViewMatrix3Enabled</td><td style="width: 19.6663%;"><span style="color: rgb(230,126,35);">[Candera::Node](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_node.html "The class Node is an abstract base class for all scene graph nodes. Each Node defines a local coordin...")</span>, <span style="color: rgb(230,126,35);">[Candera::Camera](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_camera.html "A Camera provides Modelview and Projection matrices. Camera is a Transformable.* The eye point is set...")</span></td><td style="width: 44.9344%; height: 99.9844px;">Computes the NormalModelViewMatrix3 from the Node's transformation data and the currently rendered Camera's ViewMatrix. Used to transform 3-component directional vectors (especially normals) from model to view space.</td></tr><tr style="height: 66.3906px;"><td style="width: 13.23%; height: 66.3906px;">u\_MMatrix</td><td style="width: 10.4887%; height: 66.3906px;">Matrix4</td><td style="width: 11.7998%; height: 66.3906px;">ModelMatrix4Enabled</td><td style="width: 19.6663%;"><span style="color: rgb(230,126,35);">[Candera::Node](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_node.html "The class Node is an abstract base class for all scene graph nodes. Each Node defines a local coordin...")</span></td><td style="width: 44.9344%; height: 66.3906px;">Computes the ModelMatrix from the Node's transformation data, used to transform 4-component vectors from model to world space.</td></tr><tr style="height: 83.1875px;"><td style="width: 13.23%; height: 83.1875px;">u\_MVMatrix</td><td style="width: 10.4887%; height: 83.1875px;">Matrix4</td><td style="width: 11.7998%; height: 83.1875px;">ModelViewMatrix4Enabled</td><td style="width: 19.6663%;"><span style="color: rgb(230,126,35);">[Candera::Node](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_node.html "The class Node is an abstract base class for all scene graph nodes. Each Node defines a local coordin...")</span>, <span style="color: rgb(230,126,35);">[Candera::Camera](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_camera.html "A Camera provides Modelview and Projection matrices. Camera is a Transformable.* The eye point is set...")</span></td><td style="width: 44.9344%; height: 83.1875px;">Computes the ModelViewMatrix4 from the Node's transformation data and the currently rendered Camera's ViewMatrix. Used to transform 4-component vectors from model to view space.</td></tr><tr style="height: 66.3906px;"><td style="width: 13.23%; height: 66.3906px;">u\_PMatrix</td><td style="width: 10.4887%; height: 66.3906px;">Matrix4</td><td style="width: 11.7998%; height: 66.3906px;">ProjectionMatrix4Enabled</td><td style="width: 19.6663%;">[Candera::Camera](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_camera.html "A Camera provides Modelview and Projection matrices. Camera is a Transformable.* The eye point is set...")</td><td style="width: 44.9344%; height: 66.3906px;">Passes the ProjectionMatrix4 from the active camera to the shader.</td></tr><tr><td style="width: 13.23%; border-width: 1px;">u\_VPMatrix</td><td style="width: 10.4887%; border-width: 1px;">Matrix4</td><td style="width: 11.7998%; border-width: 1px;">ViewProjectionMatrix4Enabled</td><td style="width: 19.6663%; border-width: 1px;">[Candera::Camera](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_camera.html "A Camera provides Modelview and Projection matrices. Camera is a Transformable.* The eye point is set...")</td><td style="width: 44.9344%; border-width: 1px;"><span style="vertical-align: inherit;"><span style="vertical-align: inherit;">Passes the active camera’s the ViewProjectionMatrix4 (View × Projection) to the shader.</span></span></td></tr><tr style="height: 99.9844px;"><td style="width: 13.23%; height: 99.9844px;">u\_MVPMatrix</td><td style="width: 10.4887%; height: 99.9844px;">Matrix4</td><td style="width: 11.7998%; height: 99.9844px;">ModelViewProjectionMatrix4Enabled</td><td style="width: 19.6663%;"><span style="color: rgb(230,126,35);">[Candera::Node](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_node.html "The class Node is an abstract base class for all scene graph nodes. Each Node defines a local coordin...")</span>, <span style="color: rgb(230,126,35);">[Candera::Camera](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_camera.html "A Camera provides Modelview and Projection matrices. Camera is a Transformable.* The eye point is set...")</span></td><td style="width: 44.9344%; height: 99.9844px;">Computes the ModelViewProjectionMatrix4 from the Node's transformation data and the currently rendered Camera's ViewProjectionMatrix. Used to transform 4-component vectors from model to homogeneous screen space.</td></tr><tr style="height: 99.9844px;"><td style="width: 13.23%; height: 99.9844px;">u\_CamDirection</td><td style="width: 10.4887%; height: 99.9844px;">Vector3</td><td style="width: 11.7998%; height: 99.9844px;">CameraLookAtVectorEnabled, LightActivationEnabled</td><td style="width: 19.6663%;"><span style="color: rgb(230,126,35);">[Candera::Camera](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_camera.html "A Camera provides Modelview and Projection matrices. Camera is a Transformable.* The eye point is set...")</span>, <span style="color: rgb(230,126,35);">[Candera::Light](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_light.html "A Node that represents different kinds of light sources. Light sources are used to determine the colo...")</span></td><td style="width: 44.9344%; height: 99.9844px;">Passes the currently rendered Camera's look-at vector in world space to the shader. Transforms it to object space if LightsCoordinateSpace is set to Object. Can be done explicitly, or inside lighting calculations.</td></tr><tr style="height: 49.5938px;"><td style="width: 13.23%; height: 49.5938px;">u\_CamPosition</td><td style="width: 10.4887%; height: 49.5938px;">Vector3</td><td style="width: 11.7998%; height: 49.5938px;">CameraPositionEnabled</td><td style="width: 19.6663%;">[Candera::Camera](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_camera.html "A Camera provides Modelview and Projection matrices. Camera is a Transformable.* The eye point is set...")</td><td style="width: 44.9344%; height: 49.5938px;">Passes the currently rendered Camera's position in world space to the shader.</td></tr><tr style="height: 74.5781px;"><td style="width: 13.23%; height: 74.5781px;">u\_Size</td><td style="width: 10.4887%; height: 74.5781px;">Float</td><td style="width: 11.7998%; height: 74.5781px;">-</td><td style="width: 19.6663%;"><span style="color: rgb(230,126,35);">[Candera::PointSprite](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_point_sprite.html "PointSprite represents a GL point primitive. The size (glPointSize) of the point is calculated by def...")</span></td><td style="width: 44.9344%; height: 74.5781px;">Passes the size of a <span style="color: rgb(230,126,35);">[Candera::PointSprite](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_point_sprite.html "PointSprite represents a GL point primitive. The size (glPointSize) of the point is calculated by def...")</span> node to the shader. This is always done, if node is type of <span style="color: rgb(230,126,35);">[Candera::PointSprite](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_point_sprite.html "PointSprite represents a GL point primitive. The size (glPointSize) of the point is calculated by def...")</span>.</td></tr><tr style="height: 77.5781px;"><td style="width: 13.23%; height: 77.5781px;">u\_Material.ambient</td><td style="width: 10.4887%; height: 77.5781px;">Vector4</td><td style="width: 11.7998%; height: 77.5781px;">MaterialActivationEnabled</td><td style="width: 19.6663%;"><span style="color: rgb(230,126,35);">[Candera::Material](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_material.html "The class Material describes the color attributes of an object's surface and is primarily used for li...")</span></td><td style="width: 44.9344%; height: 77.5781px;">Passes the ambient color component of the node's material (member of Appearance, see <span style="color: rgb(230,126,35);">[the section on material](https://doc316en.candera.eu/link/448#bkmrk-appearance%3A-material-0)</span>.)</td></tr><tr style="height: 77.5781px;"><td style="width: 13.23%; height: 77.5781px;">u\_Material.diffuse</td><td style="width: 10.4887%; height: 77.5781px;">Vector4</td><td style="width: 11.7998%; height: 77.5781px;">MaterialActivationEnabled</td><td style="width: 19.6663%;">[Candera::Material](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_material.html "The class Material describes the color attributes of an object's surface and is primarily used for li...")</td><td style="width: 44.9344%; height: 77.5781px;">Passes the diffuse color component of the node's material (member of Appearance, see <span style="color: rgb(230,126,35);">[the section on material](https://doc316en.candera.eu/link/448#bkmrk-appearance%3A-material-0)</span>.)</td></tr><tr style="height: 77.5781px;"><td style="width: 13.23%; height: 77.5781px;">u\_Material.emissive</td><td style="width: 10.4887%; height: 77.5781px;">Vector4</td><td style="width: 11.7998%; height: 77.5781px;">MaterialActivationEnabled</td><td style="width: 19.6663%;">[Candera::Material](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_material.html "The class Material describes the color attributes of an object's surface and is primarily used for li...")</td><td style="width: 44.9344%; height: 77.5781px;">Passes the emissive color component of the node's material (member of Appearance, see <span style="color: rgb(230,126,35);">[the section on material](https://doc316en.candera.eu/link/448#bkmrk-appearance%3A-material-0)</span>.)</td></tr><tr style="height: 77.5781px;"><td style="width: 13.23%; height: 77.5781px;">u\_Material.specular</td><td style="width: 10.4887%; height: 77.5781px;">Vector4</td><td style="width: 11.7998%; height: 77.5781px;">MaterialActivationEnabled</td><td style="width: 19.6663%;">[Candera::Material](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_material.html "The class Material describes the color attributes of an object's surface and is primarily used for li...")</td><td style="width: 44.9344%; height: 77.5781px;">Passes the specular color component of the node's material (member of Appearance, see <span style="color: rgb(230,126,35);">[the section on material](https://doc316en.candera.eu/link/448#bkmrk-appearance%3A-material-0)</span>.)</td></tr><tr style="height: 66.3906px;"><td style="width: 13.23%; height: 66.3906px;">u\_Material.shininess</td><td style="width: 10.4887%; height: 66.3906px;">Float</td><td style="width: 11.7998%; height: 66.3906px;">MaterialActivationEnabled</td><td style="width: 19.6663%;">[Candera::Material](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_material.html "The class Material describes the color attributes of an object's surface and is primarily used for li...")</td><td style="width: 44.9344%; height: 66.3906px;">Passes the shininess of the node's material (member of Appearance, see <span style="color: rgb(230,126,35);">[the section on material](https://doc316en.candera.eu/link/448#bkmrk-appearance%3A-material-0)</span>.)</td></tr><tr style="height: 127.969px;"><td style="width: 13.23%; height: 127.969px;">u\_Texture\[i\]</td><td style="width: 10.4887%; height: 127.969px;">Integer</td><td style="width: 11.7998%; height: 127.969px;">TextureActivationEnabled</td><td style="width: 19.6663%;"><span style="color: rgb(230,126,35);">[Candera::Texture](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_texture.html "Texture encapsulates a TextureImage and a set of attributes specifying how it is applied to a vertex'...")</span>, <span style="color: rgb(230,126,35);">[Candera::BitmapTextureImage](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_bitmap_texture_image.html "TextureImage encapsulates a VRAM handle which is retrieved when uploading an image to the vram...")</span>, <span style="color: rgb(230,126,35);">[Candera::ProxyTextureImage](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_proxy_texture_image.html "The class ProxyTextureImage provides a TextureImage interface to an externally maintained image sourc...")</span></td><td style="width: 44.9344%; height: 127.969px;">Passes the activated textures handle to the shader if the textures <span style="color: rgb(230,126,35);">[Candera::TextureImage](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_texture_image.html "Abstract base class for Texture images.A texture image mainly encapsulates a texture handle in VRAM a...")</span> is of type <span style="color: rgb(230,126,35);">[Candera::BitmapTextureImage](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_bitmap_texture_image.html "TextureImage encapsulates a VRAM handle which is retrieved when uploading an image to the vram...")</span> or Candera::ProxyTextureImage(with TextureTargetType Texture2D). i can be from 1 to 7 or nothing (e.g u\_Texture, u\_Texture1,..).</td></tr><tr style="height: 127.969px;"><td style="width: 13.23%; height: 127.969px;">u\_CubeMapTexture\[i\]</td><td style="width: 10.4887%; height: 127.969px;">Integer</td><td style="width: 11.7998%; height: 127.969px;">TextureActivationEnabled</td><td style="width: 19.6663%;"><span style="color: rgb(230,126,35);">[Candera::Texture](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_texture.html "Texture encapsulates a TextureImage and a set of attributes specifying how it is applied to a vertex'...")</span>, <span style="color: rgb(230,126,35);">[Candera::CubeMapTextureImage](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_cube_map_texture_image.html "CubeMapTextureImage encapsulates a VRAM handle which is retrieved when uploading a cube mapping textu...")</span>, <span style="color: rgb(230,126,35);">[Candera::ProxyTextureImage](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_proxy_texture_image.html "The class ProxyTextureImage provides a TextureImage interface to an externally maintained image sourc...")</span></td><td style="width: 44.9344%; height: 127.969px;">Passes the activated textures handle to the shader if the textures <span style="color: rgb(230,126,35);">[Candera::TextureImage](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_texture_image.html "Abstract base class for Texture images.A texture image mainly encapsulates a texture handle in VRAM a...")</span> is of type <span style="color: rgb(230,126,35);">[Candera::CubeMapTextureImage](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_cube_map_texture_image.html "CubeMapTextureImage encapsulates a VRAM handle which is retrieved when uploading a cube mapping textu...")</span> or Candera::ProxyTextureImage(with TextureTargetType TextureCubeMap). i can be from 1 to 7 or nothing (e.g u\_CubeMapTexture, u\_CubeMapTexture1,..).</td></tr><tr style="height: 49.5938px;"><td style="width: 13.23%; height: 49.5938px;">u\_Light\[i\].type</td><td style="width: 10.4887%; height: 49.5938px;">Integer</td><td style="width: 11.7998%; height: 49.5938px;">LightActivationEnabled</td><td style="width: 19.6663%;"><span style="color: rgb(230,126,35);">[Candera::Light](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_light.html "A Node that represents different kinds of light sources. Light sources are used to determine the colo...")</span></td><td style="width: 44.9344%; height: 49.5938px;">Passes an integer defining the type of light i to the shader, i can range from 0 to 7.</td></tr><tr style="height: 49.5938px;"><td style="width: 13.23%; height: 49.5938px;">u\_Light\[i\].ambient</td><td style="width: 10.4887%; height: 49.5938px;">Vector4</td><td style="width: 11.7998%; height: 49.5938px;">LightActivationEnabled</td><td style="width: 19.6663%;">[Candera::Light](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_light.html "A Node that represents different kinds of light sources. Light sources are used to determine the colo...")</td><td style="width: 44.9344%; height: 49.5938px;">Passes the ambient color component of light i to the shader, i can range from 0 to 7.</td></tr><tr style="height: 49.5938px;"><td style="width: 13.23%; height: 49.5938px;">u\_Light\[i\].diffuse</td><td style="width: 10.4887%; height: 49.5938px;">Vector4</td><td style="width: 11.7998%; height: 49.5938px;">LightActivationEnabled</td><td style="width: 19.6663%;">[Candera::Light](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_light.html "A Node that represents different kinds of light sources. Light sources are used to determine the colo...")</td><td style="width: 44.9344%; height: 49.5938px;">Passes the diffuse color component of light i to the shader, i can range from 0 to 7.</td></tr><tr><td style="width: 13.23%; border-width: 1px;">u\_Light\[i\].intensity</td><td style="width: 10.4887%; border-width: 1px;">float</td><td style="width: 11.7998%; border-width: 1px;">LightActivationEnabled</td><td style="width: 19.6663%; border-width: 1px;">[Candera::Light](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_light.html "A Node that represents different kinds of light sources. Light sources are used to determine the colo...")</td><td style="width: 44.9344%; border-width: 1px;"><span style="vertical-align: inherit;"><span style="vertical-align: inherit;">Passes the intensity factor applied to the diffuse color of light i to the shader, i can range from 0 to 7. Ignored if the light type is Ambient.</span></span></td></tr><tr style="height: 49.5938px;"><td style="width: 13.23%; height: 49.5938px;">u\_Light\[i\].specular</td><td style="width: 10.4887%; height: 49.5938px;">Vector4</td><td style="width: 11.7998%; height: 49.5938px;">LightActivationEnabled</td><td style="width: 19.6663%;">[Candera::Light](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_light.html "A Node that represents different kinds of light sources. Light sources are used to determine the colo...")</td><td style="width: 44.9344%; height: 49.5938px;">Passes the specular color component of light i to the shader, i can range from 0 to 7.</td></tr><tr style="height: 49.5938px;"><td style="width: 13.23%; height: 49.5938px;">u\_Light\[i\].position</td><td style="width: 10.4887%; height: 49.5938px;">Vector4</td><td style="width: 11.7998%; height: 49.5938px;">LightActivationEnabled</td><td style="width: 19.6663%;">[Candera::Light](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_light.html "A Node that represents different kinds of light sources. Light sources are used to determine the colo...")</td><td style="width: 44.9344%; height: 49.5938px;">Passes the position of a point or spotlight i to the shader, i can range from 0 to 7.</td></tr><tr style="height: 49.5938px;"><td style="width: 13.23%; height: 49.5938px;">u\_Light\[i\].direction</td><td style="width: 10.4887%; height: 49.5938px;">Vector3</td><td style="width: 11.7998%; height: 49.5938px;">LightActivationEnabled</td><td style="width: 19.6663%;">[Candera::Light](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_light.html "A Node that represents different kinds of light sources. Light sources are used to determine the colo...")</td><td style="width: 44.9344%; height: 49.5938px;">Passes the direction vector of a directional or spotlight i to the shader, i can range from 0 to 7.</td></tr><tr style="height: 49.5938px;"><td style="width: 13.23%; height: 49.5938px;">u\_Light\[i\].halfplane</td><td style="width: 10.4887%; height: 49.5938px;">Vector3</td><td style="width: 11.7998%; height: 49.5938px;">LightActivationEnabled</td><td style="width: 19.6663%;">[Candera::Light](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_light.html "A Node that represents different kinds of light sources. Light sources are used to determine the colo...")</td><td style="width: 44.9344%; height: 49.5938px;">Passes the halfplane vector of a directional, point or spotlight i to the shader, i can range from 0 to 7.</td></tr><tr style="height: 49.5938px;"><td style="width: 13.23%; height: 49.5938px;">u\_Light\[i\].attenuation</td><td style="width: 10.4887%; height: 49.5938px;">Vector4</td><td style="width: 11.7998%; height: 49.5938px;">LightActivationEnabled</td><td style="width: 19.6663%;">[Candera::Light](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_light.html "A Node that represents different kinds of light sources. Light sources are used to determine the colo...")</td><td style="width: 44.9344%; height: 49.5938px;">Passes the attenuation weights of a point or spotlight i to the shader, i can range from 0 to 7.</td></tr><tr style="height: 49.5938px;"><td style="width: 13.23%; height: 49.5938px;">u\_Light\[i\].spotCosCutoff</td><td style="width: 10.4887%; height: 49.5938px;">Float</td><td style="width: 11.7998%; height: 49.5938px;">LightActivationEnabled</td><td style="width: 19.6663%;">[Candera::Light](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_light.html "A Node that represents different kinds of light sources. Light sources are used to determine the colo...")</td><td style="width: 44.9344%; height: 49.5938px;">Passes the cut off angle of a spotlight i to the shader, i can range from 0 to 7.</td></tr><tr style="height: 49.5938px;"><td style="width: 13.23%; height: 49.5938px;">u\_Light\[i\].spotExponent</td><td style="width: 10.4887%; height: 49.5938px;">Float</td><td style="width: 11.7998%; height: 49.5938px;">LightActivationEnabled</td><td style="width: 19.6663%;">[Candera::Light](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_light.html "A Node that represents different kinds of light sources. Light sources are used to determine the colo...")</td><td style="width: 44.9344%; height: 49.5938px;">Passes the spot exponent of a directional, point or spotlight i to the shader, i can range from 0 to 7.</td></tr><tr style="height: 49.5938px;"><td style="width: 13.23%; height: 49.5938px;">u\_Light\[i\].range</td><td style="width: 10.4887%; height: 49.5938px;">Float</td><td style="width: 11.7998%; height: 49.5938px;">LightActivationEnabled</td><td style="width: 19.6663%;">[Candera::Light](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_light.html "A Node that represents different kinds of light sources. Light sources are used to determine the colo...")</td><td style="width: 44.9344%; height: 49.5938px;">Passes the range of a point or spotlight i to the shader, i can range from 0 to 7.</td></tr><tr style="height: 49.5938px;"><td style="width: 13.23%; height: 49.5938px;">u\_Light\[i\].enabled</td><td style="width: 10.4887%; height: 49.5938px;">Bool</td><td style="width: 11.7998%; height: 49.5938px;">LightActivationEnabled</td><td style="width: 19.6663%;">[Candera::Light](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_light.html "A Node that represents different kinds of light sources. Light sources are used to determine the colo...")</td><td style="width: 44.9344%; height: 49.5938px;">Passes whether light i is enabled or not to the shader, i can range from 0 to 7.</td></tr><tr style="height: 83.1875px;"><td style="width: 13.23%; height: 83.1875px;">u\_Light\[i\].cameraLookAtVector</td><td style="width: 10.4887%; height: 83.1875px;">Vector3</td><td style="width: 11.7998%; height: 83.1875px;">LightActivationEnabled</td><td style="width: 19.6663%;"><span style="color: rgb(230,126,35);">[Candera::Light](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_light.html "A Node that represents different kinds of light sources. Light sources are used to determine the colo...")</span>, <span style="color: rgb(230,126,35);">[Candera::Camera](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_camera.html "A Camera provides Modelview and Projection matrices. Camera is a Transformable.* The eye point is set...")</span></td><td style="width: 44.9344%; height: 83.1875px;">Computes the look-at vector of the active Camera, and passes it to the shader. Depending on the Light::CoordinateSpace the look-at vector is either in world space or in the object space of the light.</td></tr><tr style="height: 74.5781px;"><td style="width: 13.23%; height: 74.5781px;">u\_MorphWeight</td><td style="width: 10.4887%; height: 74.5781px;">Float Array</td><td style="width: 11.7998%; height: 74.5781px;">-</td><td style="width: 19.6663%;"><span style="color: rgb(230,126,35);">[Candera::MorphingMesh](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_morphing_mesh.html "MorphingMesh is a Mesh that stores weight values for morphing, and activates them as uniforms at rend...")</span></td><td style="width: 44.9344%; height: 74.5781px;">Passes the weights of a <span style="color: rgb(230,126,35);">[Candera::MorphingMesh](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_morphing_mesh.html "MorphingMesh is a Mesh that stores weight values for morphing, and activates them as uniforms at rend...")</span> to the shader. This is always done, if node is type of <span style="color: rgb(230,126,35);">[Candera::MorphingMesh](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_morphing_mesh.html "MorphingMesh is a Mesh that stores weight values for morphing, and activates them as uniforms at rend...")</span>.</td></tr><tr style="height: 66.3906px;"><td style="width: 13.23%; height: 66.3906px;">u\_CanvasPivot</td><td style="width: 10.4887%; height: 66.3906px;">Vector2</td><td style="width: 11.7998%; height: 66.3906px;">CanvasActivationEnabled</td><td style="width: 19.6663%;"><span style="color: rgb(230,126,35);">[Candera::CanvasRenderable](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_canvas_renderable.html "CanvasRenderable is used as base class for renderable canvas objects. The canvas renderable sets up t...")</span></td><td style="width: 44.9344%; height: 66.3906px;">Passes the position of the pivot of a <span style="color: rgb(230,126,35);">[Candera::CanvasRenderable](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_canvas_renderable.html "CanvasRenderable is used as base class for renderable canvas objects. The canvas renderable sets up t...")</span> to the shader.</td></tr><tr style="height: 66.3906px;"><td style="width: 13.23%; height: 66.3906px;">u\_CanvasSize</td><td style="width: 10.4887%; height: 66.3906px;">Vector2</td><td style="width: 11.7998%; height: 66.3906px;">CanvasActivationEnabled</td><td style="width: 19.6663%;">[Candera::CanvasRenderable](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_canvas_renderable.html "CanvasRenderable is used as base class for renderable canvas objects. The canvas renderable sets up t...")</td><td style="width: 44.9344%; height: 66.3906px;">Passes the actual size of a [Candera::CanvasRenderable](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_canvas_renderable.html "CanvasRenderable is used as base class for renderable canvas objects. The canvas renderable sets up t...") to the shader.</td></tr><tr style="height: 66.3906px;"><td style="width: 13.23%; height: 66.3906px;">ub\_Material</td><td style="width: 10.4887%; height: 66.3906px;">Uniform Buffer Object</td><td style="width: 11.7998%; height: 66.3906px;">MaterialActivationEnabled</td><td style="width: 19.6663%;">[Candera::Material](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_material.html "The class Material describes the color attributes of an object's surface and is primarily used for li...")</td><td style="width: 44.9344%; height: 66.3906px;">Passes all of the material parameters from above in a uniform buffer object to the shader.</td></tr><tr style="height: 66.3906px;"><td style="width: 13.23%; height: 66.3906px;">ub\_Lights</td><td style="width: 10.4887%; height: 66.3906px;">Uniform Buffer Object</td><td style="width: 11.7998%; height: 66.3906px;">LightActivationEnabled</td><td style="width: 19.6663%;"><span style="color: rgb(230,126,35);">[Candera::Light](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_light.html "A Node that represents different kinds of light sources. Light sources are used to determine the colo...")</span>, <span style="color: rgb(230,126,35);">[Candera::Camera](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_camera.html "A Camera provides Modelview and Projection matrices. Camera is a Transformable.* The eye point is set...")</span></td><td style="width: 44.9344%; height: 66.3906px;">Passes all of the light parameters from above in a uniform buffer object to the shader.</td></tr><tr><td style="width: 13.23%;">u\_JointMatrices</td><td style="width: 10.4887%;">Matrix4</td><td style="width: 11.7998%;">SkinningMeshActivationEnable</td><td style="width: 19.6663%;"><span style="color: rgb(230,126,35);">[Candera::SkinningMesh](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_skinning_mesh.html)</span></td><td style="width: 44.9344%;">Passes the Inverse Bind Matrix of a Joint to the shader.</td></tr></tbody></table>

</div></div></div>##### <a class="anchor" id="bkmrk--12"></a>Attribute Names

[Candera](http://dev.doc.cgistudio.at/APILINK/namespace_candera.html "[DataBinding_RefTypeSample]") uses pre-defined attribute names to bind a vertex buffers attributes. When writing shader programs the following attribute names shall be used:

<div class="contents" id="bkmrk-attribute-name-seman"><div class="textblock"><table style="width: 100%;"><tbody><tr style="background-color: #d4d4d4;"><th style="width: 21.2493%;">**Attribute Name**</th><th style="width: 78.7095%;">**Semantic**</th></tr><tr><td style="width: 21.2493%;">PositionAttribute\[i\]</td><td style="width: 78.7095%;">Use this attribute for passing vertex positions (local space). i ranges from 1 to 7 or is nothing (e.g. PositionAttribute, PositionAttribute1,...).</td></tr><tr><td style="width: 21.2493%;">PositionTransformedAttribute\[i\]</td><td style="width: 78.7095%;">Use this attribute for passing transformed vertex positions. i ranges from 1 to 7 or is nothing (e.g. PositionTransformedAttribute, PositionTransformedAttribute1,...).</td></tr><tr><td style="width: 21.2493%;">NormalAttribute\[i\]</td><td style="width: 78.7095%;">Use this attribute for passing the vertices normals. i ranges from 1 to 7 or is nothing (e.g. NormalAttribute, NormalAttribute1,...).</td></tr><tr><td style="width: 21.2493%;">TextureCoordinateAttribute\[i\]</td><td style="width: 78.7095%;">Use this attribute for passing the vertices texture coordinates. i ranges from 1 to 7 or is nothing (e.g. TextureCoordinateAttribute, TextureCoordinateAttribute1,...).</td></tr><tr><td style="width: 21.2493%;">ColorAttribute\[i\]</td><td style="width: 78.7095%;">Use this attribute for passing the vertices colors. i ranges from 1 to 7 or is nothing (e.g. ColorAttribute, ColorAttribute1,...).</td></tr><tr><td style="width: 21.2493%;">BlendWeightAttribute\[i\]</td><td style="width: 78.7095%;">Use this attribute for passing the vertices blend weight attributes. i ranges from 1 to 7 or is nothing (e.g. BlendWeightAttribute, BlendWeightAttribute1,...).</td></tr><tr><td style="width: 21.2493%;">BlendIndexAttribute\[i\]</td><td style="width: 78.7095%;">Use this attribute for passing the vertices blend index attributes. i ranges from 1 to 7 or is nothing (e.g. BlendIndexAttribute, BlendIndexAttribute1,...).</td></tr><tr><td style="width: 21.2493%;">PointSizeAttribute\[i\]</td><td style="width: 78.7095%;">Use this attribute for passing the vertices point sizes. i ranges from 1 to 7 or is nothing (e.g. PositionAttribute, PositionAttribute1,...).</td></tr><tr><td style="width: 21.2493%;">TangentAttribute\[i\]</td><td style="width: 78.7095%;">Use this attribute for passing the vertices tangents. i ranges from 1 to 7 or is nothing (e.g. TangentAttribute, TangentAttribute1,...).</td></tr><tr><td style="width: 21.2493%;">BiNormalAttribute\[i\]</td><td style="width: 78.7095%;">Use this attribute for passing the vertices binormals. i ranges from 1 to 7 or is nothing (e.g. BiNormalAttribute, BiNormalAttribute1,...).</td></tr><tr><td style="width: 21.2493%;">TesselationFactorAttribute\[i\]</td><td style="width: 78.7095%;">Use this attribute for passing the vertices tesselation factors. i ranges from 1 to 7 or is nothing (e.g. TesselationFactorAttribute, TesselationFactorAttribute1,...).</td></tr><tr><td style="width: 21.2493%;">FogAttribute\[i\]</td><td style="width: 78.7095%;">Use this attribute for passing the vertices fog attributes. i ranges from 1 to 7 or is nothing (e.g. FogAttribute, FogAttribute1,...).</td></tr><tr><td style="width: 21.2493%;">DepthAttribute\[i\]</td><td style="width: 78.7095%;">Use this attribute for passing the vertices depth attributes. i ranges from 1 to 7 or is nothing (e.g. DepthAttribute, DepthAttribute1,...).</td></tr><tr><td style="width: 21.2493%;">SampleAttribute\[i\]</td><td style="width: 78.7095%;">Use this attribute for passing the vertices sample attributes. i ranges from 1 to 7 or is nothing (e.g. SampleAttribute, SampleAttribute1,...).</td></tr><tr><td style="width: 21.2493%;">CustomAttribute\[i\]</td><td style="width: 78.7095%;">Use this attribute for passing your custom data per vertex. i ranges from 1 to 7 or is nothing (e.g. CustomAttribute, CustomAttribute1,...).</td></tr></tbody></table>

</div></div>####   
**Single Pass Effects**

Single pass effects can be achieved in one camera pass only. They are simply realized with a single <span style="color: rgb(230,126,35);">[Candera::Appearance](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_appearance.html "The class Appearance groups following render attributes: Material, Textures, RenderMode, and Shader. Render attributes define the distinctive visualization of a geometry like Mesh, Billboard, and PointSprite. Further, render attributes can be shared across multiple objects, which conserves memory and enables sharing of appearance characteristics. An Appearance object is mandatory for any object in order to get rendered. Per default all render attributes are initialized to null, which is a valid setting. If the Appearance is activated, all render attributes that are set become activated. If no RenderMode is defined (null), then the default RenderMode is used instead;.")</span> attached to a <span style="color: rgb(230,126,35);">[Candera::Node](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_node.html "The class Node is an abstract base class for all scene graph nodes. Each Node defines a local coordin...")</span>.

Examples for single pass effects can be found in the <span style="color: rgb(230,126,35);">[Special Render Techniques chapter](https://doc316en.candera.eu/books/candera/page/single-pass-effects-in-candera-examples-for-3d-effect-shaders)</span>.

####   
**Local Multi Pass Effects**

Local multi pass effects describe effects with local impact only, thus, they belong to one certain node. They can be realized using <span style="color: rgb(230,126,35);">[Candera::MultiPassAppearance](http://dev.doc.cgistudio.at/APILINK/class_candera_1_1_multi_pass_appearance.html "A MultiPassAppearance enables a node to be rendered multiple times with different appearance settings...")</span>. These appearances are processed in a sequence; for each appearance the node is rendered once and the results are blended together using the different RenderMode settings.

Examples for local multi pass effects can be found in the <span style="color: rgb(230,126,35);">[Special Render Techniques chapter](https://doc316en.candera.eu/books/candera/page/multi-pass-effects-in-candera-examples-for-local-3d-effect-shaders)</span>.

####   
**Global Multi Pass Effects**

Global multi pass (also known as screen-based effects) typically operate on render targets, often they are also referred to as post-processing effects. To realize post-processing effects first images have to be rendered into an offscreen render target. How this is done is presented in <span style="color: rgb(230,126,35);">[Render Targets Tutorial](https://doc316en.candera.eu/books/candera/chapter/tutorial-for-graphic-device-interface)</span>.

The resulting image can further be processed in any desired way.

Examples for global multi pass effects can be found in chapter <span style="color: rgb(230,126,35);">[Special Render Techniques](https://doc316en.candera.eu/books/candera/page/multi-pass-effects-in-candera-examples-for-global-3d-effect-shaders)</span>.

##### <a class="anchor" id="bkmrk--13"></a>Creating Full Screen Effects

You can of course process the resulting texture on any mesh or object you like, but often post processing effects are applied to full screen images. For that purpose a dedicated scene with only a camera and a billboard can be used. The trick is to give the Billboard a size of 1.0 unit in both dimensions.

```
Billboard* fullScreenBB = <a class="code" href="http://dev.doc.cgistudio.at/APILINK/group___c_o_u_r_i_e_r___v_i_s_u_a_l_i_z_a_t_i_o_n.html#ggaf0e93dc4242f607c3c8d13dafd036af9aaabfa5309af24986d3111a092449f857">Billboard::Create</a>(1.0F, 1.0F);
```

This causes the billboard to have a vertex buffer with coordinates that match the corners of the window/screen in Canderas viewport space. To draw the billboard full screen you just need to use a vertex shader that doesn't transform the vertex coordinates, use ReferenceShaders\\Core\\RefViewportSpace.vertp for this purpose. The fragment shader then does the actual post processing. As texture for the billboard you need to use the image provided by the offscreen render target.

*RefViewportSpace.vertp* takes two float uniforms (u\_offsetLeft, u\_offsetTop) as inputs, which determine the top left corner of the billboard to render. These values are defined as being in normalized viewport space, where values range from 0.0 to 1.0, where 0.0 is interpreted as the left border respectively top border of the viewport, and 1.0 as the right, respectively bottom border.

The vertex position attribute of a vertex buffer used with this vertex shader is not transformed using a model-view-projection matrix, but simply translated into OpenGL's clip coordinate space with the specified offset applied.

The following examples demonstrate how to use the RefViewportSpace.vert shader in conjunction with the depth-of-field global multi pass effect.

Specify a full screen rectangle:

```
//Do Shader File I/O here and initialize m_dofCombineShader shader object.
Float m_viewportLeft = 1.0F;
Float m_vieportTop = 1.0F;
m_dofCombineSps = <a class="code" href="http://dev.doc.cgistudio.at/APILINK/group___c_o_u_r_i_e_r___v_i_s_u_a_l_i_z_a_t_i_o_n.html#ggaf0e93dc4242f607c3c8d13dafd036af9aaabfa5309af24986d3111a092449f857">GenericShaderParamSetter::Create</a>();
m_dofCombineSps->SetModelViewProjectionMatrix4Enabled(false);
m_dofCombineSps->SetUniform("u_offsetLeft", Shader::Float, &m_viewportLeft);
m_dofCombineSps->SetUniform("u_offsetTop", Shader::Float, &m_viewportTop);
m_fullScreenQuadDof = <a class="code" href="http://dev.doc.cgistudio.at/APILINK/group___c_o_u_r_i_e_r___v_i_s_u_a_l_i_z_a_t_i_o_n.html#ggaf0e93dc4242f607c3c8d13dafd036af9aaabfa5309af24986d3111a092449f857">Billboard::Create</a>(1.0f,1.0f);
m_fullScreenQuadDof->GetAppearance()->SetShader(m_dofCombineShader);
m_fullScreenQuadDof->GetAppearance()->SetShaderParamSetter(m_dofCombineSps);
```

This results in the following image:

<div drawio-diagram="2311"><img src="https://doc316en.candera.eu/uploads/images/drawio/2023-02/drawing-4-1677054213.png" alt="drawing-4-1677054213.png"/></div>

<div class="contents" id="bkmrk--0"><div class="contents"><div class="textblock">  
</div></div></div>Specify a centered rectangle with half viewport resolution:

```
//Do Shader File I/O here and initialize m_dofCombineShader shader object.
Float m_viewportLeft = 0.25F;
Float m_vieportTop = 0.25F;
m_dofCombineSps = <a class="code" href="http://dev.doc.cgistudio.at/APILINK/group___c_o_u_r_i_e_r___v_i_s_u_a_l_i_z_a_t_i_o_n.html#ggaf0e93dc4242f607c3c8d13dafd036af9aaabfa5309af24986d3111a092449f857">GenericShaderParamSetter::Create</a>();
m_dofCombineSps->SetModelViewProjectionMatrix4Enabled(false);
m_dofCombineSps->SetUniform("u_offsetLeft", Shader::Float, &m_viewportLeft);
m_dofCombineSps->SetUniform("u_offsetTop", Shader::Float, &m_viewportTop);
m_fullScreenQuadDof = <a class="code" href="http://dev.doc.cgistudio.at/APILINK/group___c_o_u_r_i_e_r___v_i_s_u_a_l_i_z_a_t_i_o_n.html#ggaf0e93dc4242f607c3c8d13dafd036af9aaabfa5309af24986d3111a092449f857">Billboard::Create</a>(0.5f,0.5f);
m_fullScreenQuadDof->GetAppearance()->SetShader(m_dofCombineShader);
m_fullScreenQuadDof->GetAppearance()->SetShaderParamSetter(m_dofCombineSps);
```

This results in the following image:

<div drawio-diagram="2310"><img src="https://doc316en.candera.eu/uploads/images/drawio/2023-02/drawing-4-1677054197.png" alt="drawing-4-1677054197.png"/></div>

<div class="contents" id="bkmrk--3"><div class="contents"><div class="textblock">  
</div></div></div>Specify a rectangle in bottom right corner with quarter viewport resolution:

```
//Do Shader File I/O here and initialize m_dofCombineShader shader object.
Float m_viewportLeft = 0.75F;
Float m_vieportTop = 0.75F;
m_dofCombineSps = <a class="code" href="http://dev.doc.cgistudio.at/APILINK/group___c_o_u_r_i_e_r___v_i_s_u_a_l_i_z_a_t_i_o_n.html#ggaf0e93dc4242f607c3c8d13dafd036af9aaabfa5309af24986d3111a092449f857">GenericShaderParamSetter::Create</a>();
m_dofCombineSps->SetModelViewProjectionMatrix4Enabled(false);
m_dofCombineSps->SetUniform("u_offsetLeft", Shader::Float, &m_viewportLeft);
m_dofCombineSps->SetUniform("u_offsetTop", Shader::Float, &m_viewportTop);
m_fullScreenQuadDof = <a class="code" href="http://dev.doc.cgistudio.at/APILINK/group___c_o_u_r_i_e_r___v_i_s_u_a_l_i_z_a_t_i_o_n.html#ggaf0e93dc4242f607c3c8d13dafd036af9aaabfa5309af24986d3111a092449f857">Billboard::Create</a>(0.25f,0.25f);
m_fullScreenQuadDof->GetAppearance()->SetShader(m_dofCombineShader);
m_fullScreenQuadDof->GetAppearance()->SetShaderParamSetter(m_dofCombineSps);
```

This results in the following image:

<div drawio-diagram="2309"><img src="https://doc316en.candera.eu/uploads/images/drawio/2023-02/drawing-4-1677054180.png" alt="drawing-4-1677054180.png"/></div>

<div class="contents" id="bkmrk--6"><div class="contents"><div class="textblock">  
</div></div></div><div class="contents" id="bkmrk-overlapping-billboar"><div class="contents"><div class="contents"><div class="textblock"><dl class="note"><dt></dt><dd><p class="callout info">Overlapping Billboards (in screen space) would produce depth-fighting artifacts. Disabling depth test and using render order as well as using depth bias can be used to avoid them.</p>

</dd></dl><div class="fragment">  
</div></div></div></div></div>```
m_fullScreenQuadDof->GetAppearance()->SetRenderMode(<a class="code" href="http://dev.doc.cgistudio.at/APILINK/group___c_o_u_r_i_e_r___v_i_s_u_a_l_i_z_a_t_i_o_n.html#ggaf0e93dc4242f607c3c8d13dafd036af9aaabfa5309af24986d3111a092449f857">RenderMode::Create</a>());
m_fullScreenQuadDof->GetAppearance()->GetRenderMode()->SetDepthBias(0.1F);
```

For details on how to use render order please refer to <span style="color: rgb(230,126,35);">[Tutorial 3](https://doc316en.candera.eu/books/candera/page/3d-render-order)</span>.