Skip to content

N
Native_SDK
Commit 3f19545f by Joe Davis
Options

Added the SDKBrowser & its dependencies

parent f7f184c0
Showing with 7009 additions and 0 deletions
Documentation/SDKBrowser/Contact.html 0 → 100644
<!DOCTYPE html>
<html lang="en">
<head>
<title>The PowerVR SDK Browser</title>
<meta charset="UTF-8" />
<link rel="stylesheet" type="text/css" href="style.css">
<link rel="icon" type="image/png" href="./images/img-icon.png">
</head>
<body>
<div id="GlobalHeaderContainer">
<div id="GlobalHeader">
<div class="logo">
<a href="http://www.powervrinsider.com" target="_blank"><img src="./images/PVRlogo.png" width="40%" height="40%" /></a>
</div>
<div class="sitetitle">PowerVR SDK Browser</div>
</div>
</div>
<div id="NavContainer">
<nav>
<div class="navlink">
<a href="Home.html">Home</a>
</div>
<div class="navlink">
<a href="GettingStarted.html">Getting Started</a>
</div>
<div class="navlink">
<a href="Examples.html">Examples</a>
</div>
<div class="navlink">
<a href="Framework.html">Framework</a>
</div>
<div class="navlink">
<a href="Documentation.html">Documentation</a>
</div>
<div class="navlink">
<a href="PowerVRTools.html">PowerVR Tools</a>
</div>
<div class="navlink">
<a href="ReleaseNotes.html">Release Notes</a>
</div>
<div class="navlink">
<a href="Contact.html" class="current">Contact Us</a>
</div>
</nav>
</div>
<div class="content">
<h1>Contact Details</h1>
<h3>Forum</h3>
<p>For further support, please visit our <a href="http://forum.imgtec.com" target="_blank">forum</a>.</p>
<h3>Support and Ticketing System</h3>
<p>Alternatively, file a ticket in our <a href="https://pvrsupport.imgtec.com" target="_blank">support system</a>.</p>
<h3>PowerVR Insider</h3>
<p>To learn more about our PowerVR Graphics SDK and Insider programme, please visit our <a href="http://www.powervrinsider.com" target="_blank">community webpages</a>.</p>
<h3>General Enquiries</h3>
<p>For general enquiries, please visit our <a href="http://www.imgtec.com/about/contactus.asp" target="_blank">corporate website</a>.</p>
<hr />
<h3>Further Contact Info</h3>
Imagination Technologies Ltd.<br />
Home Park Estate<br />
Kings Langley<br />
Hertfordshire, WD4 8LZ<br />
United Kingdom</p>
<p>Tel: +44 (0)1923 260511</p>
<p>Fax: +44 (0)1923 277463</p>
</div>
<br>
<div id="FooterMainContainer">
<div id="FooterContainer">
<div class="footerlogo">
<a href="http://www.imgtec.com" target="_blank"><img src="./images/img-footer-logo-grey.png" width="100%" height="100%" /></a>
</div>
<div class="copyright">&copy; Imagination Technologies Limited<br> All rights reserved</div>
</div>
</div>
</body>
</html>
\ No newline at end of file
Documentation/SDKBrowser/DX11.html 0 → 100644
<!DOCTYPE html>
<html lang="en">
<head>
<title>The PowerVR SDK Browser</title>
<meta charset="UTF-8" />
<link rel="stylesheet" type="text/css" href="style.css">
<link rel="icon" type="image/png" href="./images/img-icon.png">
</head>
<body>
<div id="GlobalHeaderContainer">
<div id="GlobalHeader">
<div class="logo">
<a href="http://www.powervrinsider.com" target="_blank"><img src="./images/PVRlogo.png" width="40%" height="40%" /></a>
</div>
<div class="sitetitle">PowerVR SDK Browser</div>
</div>
</div>
<div id="NavContainer">
<nav>
<div class="navlink">
<a href="Home.html">Home</a>
</div>
<div class="navlink">
<a href="GettingStarted.html">Getting Started</a>
</div>
<div class="navlink">
<a href="Examples.html" class="current">Examples</a>
</div>
<div class="navlink">
<a href="Framework.html">Framework</a>
</div>
<div class="navlink">
<a href="Documentation.html">Documentation</a>
</div>
<div class="navlink">
<a href="PowerVRTools.html">PowerVR Tools</a>
</div>
<div class="navlink">
<a href="ReleaseNotes.html">Release Notes</a>
</div>
<div class="navlink">
<a href="Contact.html">Contact Us</a>
</div>
</nav>
</div>
<!--API_TAB-->
<div class="content">
<div id="Section" class="section">
<!--API_DESCRIPTION-->
<h1>DirectX 11 Examples</h1>
<p>
DirectX 11 is the latest API for 2D and 3D graphics from Microsoft intended for desktop devices and consoles.
</p>
</DX11> <p><a href="#Beginner" class="link">Beginner</a> | <a href="#Intermediate" class="link">Intermediate</a> | <a href="#Advanced" class="link">Advanced</a></p>
<!--EXAMPLE_TEMPLATE-->
<div id="Beginner""><h2>Beginner</h2><ul class="accordion">
<li id="HelloAPI">
<div class="title">
<a href="../../Examples/Beginner/01_HelloAPI/HelloAPI.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Beginner/01_HelloAPI/HelloAPI.png" alt="HelloAPI" /></a>
<input type="checkbox" id="HelloAPIFull2">
<label for="HelloAPIFull2" title="Click for more information"><h3>HelloAPI</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>Draw a triangle to the screen using hardware acceleration.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>A basic tutorial that guides the user, step-by-step, through the process of initializing a window using :API:, drawing a triangle in it using hardware acceleration, and then terminating the window.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Beginner/01_HelloAPI/DX11/DX11HelloAPI.cpp" target="_blank">DX11HelloAPI.cpp</a> | <a href="../../Examples/Beginner/01_HelloAPI/DX11/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="IntroducingPVRShell">
<div class="title">
<a href="../../Examples/Beginner/02_IntroducingPVRShell/IntroducingPVRShell.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Beginner/02_IntroducingPVRShell/IntroducingPVRShell.png" alt="IntroducingPVRShell" /></a>
<input type="checkbox" id="IntroducingPVRShellFull2">
<label for="IntroducingPVRShellFull2" title="Click for more information"><h3>IntroducingPVRShell</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course introduces the PVRShell library.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This demo deals with the PVRShell library. The PowerVR shell handles all OS specific initialisation code, and has several built in command line features which allow for the specifying of attributes. The library is constructed around a 'PVRShell' base class, and object of which is constructed and returned from a 'NewDemo' function.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Beginner/02_IntroducingPVRShell/DX11/DX11IntroducingPVRShell.cpp" target="_blank">DX11IntroducingPVRShell.cpp</a> | <a href="../../Examples/Beginner/02_IntroducingPVRShell/DX11/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="Texturing">
<div class="title">
<a href="../../Examples/Beginner/03_Texturing/Texturing.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Beginner/03_Texturing/Texturing.png" alt="Texturing" /></a>
<input type="checkbox" id="TexturingFull2">
<label for="TexturingFull2" title="Click for more information"><h3>Texturing</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates how to apply a texture to a polygon in :API:.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course demonstrates how to apply a texture to a polygon in :API:. The texture is generated procedurally during initialisation and then loaded into :API:. The triangle is then drawn with UV values so that the texture can be applied to it.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Beginner/03_Texturing/DX11/DX11Texturing.cpp" target="_blank">DX11Texturing.cpp</a> | <a href="../../Examples/Beginner/03_Texturing/DX11/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="BasicTnL">
<div class="title">
<a href="../../Examples/Beginner/04_BasicTnL/BasicTnL.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Beginner/04_BasicTnL/BasicTnL.png" alt="BasicTnL" /></a>
<input type="checkbox" id="BasicTnLFull2">
<label for="BasicTnLFull2" title="Click for more information"><h3>BasicTnL</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course consists of a demonstration of basic transformation and lighting.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course consists of a demonstration of basic transformation and lighting, growing on the basic drawing techniques learnt in HelloTriangle.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Beginner/04_BasicTnL/DX11/DX11BasicTnL.cpp" target="_blank">DX11BasicTnL.cpp</a> | <a href="../../Examples/Beginner/04_BasicTnL/DX11/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="IntroducingPVRTools">
<div class="title">
<a href="../../Examples/Beginner/05_IntroducingPVRTools/IntroducingPVRTools.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Beginner/05_IntroducingPVRTools/IntroducingPVRTools.png" alt="IntroducingPVRTools" /></a>
<input type="checkbox" id="IntroducingPVRToolsFull2">
<label for="IntroducingPVRToolsFull2" title="Click for more information"><h3>IntroducingPVRTools</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course introduces the PVRTools libraries.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course introduces the PVRTools libraries. These libraries provide various modules to help developers perform many of the common tasks associated with hardware accelerated graphics rendering.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Beginner/05_IntroducingPVRTools/DX11/DX11IntroducingPVRTools.cpp" target="_blank">DX11IntroducingPVRTools.cpp</a> | <a href="../../Examples/Beginner/05_IntroducingPVRTools/DX11/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="IntroducingPrint3D">
<div class="title">
<a href="../../Examples/Beginner/06_IntroducingPrint3D/IntroducingPrint3D.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Beginner/06_IntroducingPrint3D/IntroducingPrint3D.png" alt="IntroducingPrint3D" /></a>
<input type="checkbox" id="IntroducingPrint3DFull2">
<label for="IntroducingPrint3DFull2" title="Click for more information"><h3>IntroducingPrint3D</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course introduces the Print3D class featured within the PVRTools library.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course introduces the Print3D class from the PVRTools library. Print3D can be used to display text in both 2D and 3D modes. The default projection mode is 2D but supplying a modelview and projection matrices allow the user to render the text in 3D. Text in different colours is also possible.
</p></p>
<p><strong>Controls:</strong></p>
<p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Beginner/06_IntroducingPrint3D/DX11/DX11IntroducingPrint3D.cpp" target="_blank">DX11IntroducingPrint3D.cpp</a> | <a href="../../Examples/Beginner/06_IntroducingPrint3D/DX11/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="IntroducingPOD">
<div class="title">
<a href="../../Examples/Beginner/07_IntroducingPOD/IntroducingPOD.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Beginner/07_IntroducingPOD/IntroducingPOD.png" alt="IntroducingPOD" /></a>
<input type="checkbox" id="IntroducingPODFull2">
<label for="IntroducingPODFull2" title="Click for more information"><h3>IntroducingPOD</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course introduces the PowerVR Object Data (.pod) format.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course introduces the PowerVR Object Data (.pod) format. It goes into detail on how to open .pod files, load any .pfx and .pvr files that have been referenced, and set up the cameras and lights from the .pod file.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Beginner/07_IntroducingPOD/DX11/DX11IntroducingPOD.cpp" target="_blank">DX11IntroducingPOD.cpp</a> | <a href="../../Examples/Beginner/07_IntroducingPOD/DX11/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li></div></ul><div id="Intermediate""><h2>Intermediate</h2><ul class="accordion">
<li id="AlphaBlend">
<div class="title">
<a href="../../Examples/Intermediate/AlphaBlend/AlphaBlend.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/AlphaBlend/AlphaBlend.png" alt="AlphaBlend" /></a>
<input type="checkbox" id="AlphaBlendFull2">
<label for="AlphaBlendFull2" title="Click for more information"><h3>AlphaBlend</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course illustrates how transparency effects can be achieved with blending and the use of some common blending modes.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>Blending is a fragment operation that combines the colour value of fragments as they are drawn with values that are already present in the colour buffer. This allows transparent objects to be simulated. This training course shows how to draw blended geometry using four different types of blending modes set with glBlendFunc().
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/AlphaBlend/DX11/DX11AlphaBlend.cpp" target="_blank">DX11AlphaBlend.cpp</a> | <a href="../../Examples/Intermediate/AlphaBlend/DX11/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="DisplacementMap">
<div class="title">
<a href="../../Examples/Intermediate/DisplacementMap/DisplacementMap.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/DisplacementMap/DisplacementMap.png" alt="DisplacementMap" /></a>
<input type="checkbox" id="DisplacementMapFull2">
<label for="DisplacementMapFull2" title="Click for more information"><h3>DisplacementMap</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates displacement mapping using a texture read from the vertex shader.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>Displacement mapping is an alternative to bump mapping, normal mapping, and parallax mapping, that causes the actual geometric position of points over a textured surface to be displaced, often along the local surface normal, according to the value the texture function evaluates to at each point on the surface.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/DisplacementMap/DX11/DX11DisplacementMap.cpp" target="_blank">DX11DisplacementMap.cpp</a> | <a href="../../Examples/Intermediate/DisplacementMap/DX11/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="Reflections">
<div class="title">
<a href="../../Examples/Intermediate/Reflections/Reflections.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/Reflections/Reflections.png" alt="Reflections" /></a>
<input type="checkbox" id="ReflectionsFull2">
<label for="ReflectionsFull2" title="Click for more information"><h3>Reflections</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates the creation of a reflection effect from a 2D map and a cube map.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course demonstrates the creation of a reflection effect from a 2D map and a cube map. This technique is also known as environment mapping in that the environment around an object is rendered into a texture (in this case as a pre-baked step) and then this environment is sampled per fragment in order to simulate the effect of light from the environment being reflected from the object. Two variations on the technique are shown using either a 2D map or a cube map.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Left/Right : Swap mapping type</p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/Reflections/DX11/DX11Reflections.cpp" target="_blank">DX11Reflections.cpp</a> | <a href="../../Examples/Intermediate/Reflections/DX11/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="Refraction">
<div class="title">
<a href="../../Examples/Intermediate/Refraction/Refraction.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/Refraction/Refraction.png" alt="Refraction" /></a>
<input type="checkbox" id="RefractionFull2">
<label for="RefractionFull2" title="Click for more information"><h3>Refraction</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates a simulation of glass-like materials.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course combines an object with a background in order to achieve a refraction effect. The background texture is applied to the model but the sample coordinates are affected by the normals of the geometry in order to simulate how light would be bent through a material with differing refractive index to the air around it.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Left/Right : Cycle Specular reflection on or off</p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/Refraction/DX11/DX11Refraction.cpp" target="_blank">DX11Refraction.cpp</a> | <a href="../../Examples/Intermediate/Refraction/DX11/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="RenderToTexture">
<div class="title">
<a href="../../Examples/Intermediate/RenderToTexture/RenderToTexture.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/RenderToTexture/RenderToTexture.png" alt="RenderToTexture" /></a>
<input type="checkbox" id="RenderToTextureFull2">
<label for="RenderToTextureFull2" title="Click for more information"><h3>RenderToTexture</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates the use of rendering to a texture.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course demonstrates rendering a scene to a pBuffer surface or FBO, then binding and applying that render to an object in an additional render pass.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Left : Toggles multisampling of the FBOs</p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/RenderToTexture/DX11/DX11RenderToTexture.cpp" target="_blank">DX11RenderToTexture.cpp</a> | <a href="../../Examples/Intermediate/RenderToTexture/DX11/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="Skinning">
<div class="title">
<a href="../../Examples/Intermediate/Skinning/Skinning.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/Skinning/Skinning.png" alt="Skinning" /></a>
<input type="checkbox" id="SkinningFull2">
<label for="SkinningFull2" title="Click for more information"><h3>Skinning</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates how to implement hardware accelerated skinning using .pod files.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course demonstrates how to implement hardware accelerated skinning using the .pod file loading tools found in the PVRTools library.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Left/Right : Rotate model clockwise/anti-clockwise</p><p> Up/Down : Zoom out/in</p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/Skinning/DX11/DX11Skinning.cpp" target="_blank">DX11Skinning.cpp</a> | <a href="../../Examples/Intermediate/Skinning/DX11/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li></div></ul><div id="Advanced""><h2>Advanced</h2><ul class="accordion">
<li id="Coverflow">
<div class="title">
<a href="../../Examples/Advanced/Coverflow/Coverflow.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Advanced/Coverflow/Coverflow.png" alt="Coverflow" /></a>
<input type="checkbox" id="CoverflowFull2">
<label for="CoverflowFull2" title="Click for more information"><h3>Coverflow</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>A demonstration of a coverflow style effect.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This demo serves as an example of a coverflow style effect, which is a three dimensional GUI used to display information as a stack of snapshots.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Left/Right : Flow covers left/right</p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Advanced/Coverflow/DX11/DX11Coverflow.cpp" target="_blank">DX11Coverflow.cpp</a> | <a href="../../Examples/Advanced/Coverflow/DX11/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="Fractal">
<div class="title">
<a href="../../Examples/Advanced/Fractal/Fractal.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Advanced/Fractal/Fractal.png" alt="Fractal" /></a>
<input type="checkbox" id="FractalFull2">
<label for="FractalFull2" title="Click for more information"><h3>Fractal</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>A demonstration of drawing a fractal using render to texture.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>A recursive fractal effect is demonstrated here using the render to texture technique. This technique is a useful method to create a variety of effects. Basically, a scene is rendered as usual, but in a texture for future reuse.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Advanced/Fractal/DX11/DX11Fractal.cpp" target="_blank">DX11Fractal.cpp</a> | <a href="../../Examples/Advanced/Fractal/DX11/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="Water">
<div class="title">
<a href="../../Examples/Advanced/Water/Water.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Advanced/Water/Water.png" alt="Water" /></a>
<input type="checkbox" id="WaterFull2">
<label for="WaterFull2" title="Click for more information"><h3>Water</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This demo shows how to render a water effect on a given plane
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This demo utilises a combination of different techniques to produce a water effect. User input controls the elements that are implemented in the effect so that users can determine the effect that would best suit their needs. When reflection, refraction and depth effects are off, the water colours alpha value is used to blend the plane in with the rest of the rendered world. This adds to the quality of the basic effect for very little cost.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Left/Right : Cycle backwards/forwards through available options</p><p> Up/Down : Change (Toggle or Increase/Decrease) the currently selected option</p><p> 1/Space : Toggle Pause/Unpause</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Advanced/Water/DX11/DX11Water.cpp" target="_blank">DX11Water.cpp</a> | <a href="../../Examples/Advanced/Water/DX11/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li></div></ul> </div>
</div>
<div id="FooterMainContainer">
<div id="FooterContainer">
<div class="footerlogo">
<a href="http://www.imgtec.com" target="_blank"><img src="./images/img-footer-logo-grey.png" width="100%" height="100%" /></a>
</div>
<div class="copyright">&copy; Imagination Technologies Limited<br> All rights reserved</div>
</div>
</div>
</body>
</html>
\ No newline at end of file
Documentation/SDKBrowser/Documentation.html 0 → 100644
<!DOCTYPE html>
<html lang="en">
<head>
<title>The PowerVR SDK Browser</title>
<meta charset="UTF-8" />
<link rel="stylesheet" type="text/css" href="style.css">
<link rel="icon" type="image/png" href="./images/img-icon.png">
</head>
<body>
<div id="GlobalHeaderContainer">
<div id="GlobalHeader">
<div class="logo">
<a href="http://www.powervrinsider.com" target="_blank"><img src="./images/PVRlogo.png" width="40%" height="40%" /></a>
</div>
<div class="sitetitle">PowerVR SDK Browser</div>
</div>
</div>
<div id="NavContainer">
<nav>
<div class="navlink">
<a href="Home.html">Home</a>
</div>
<div class="navlink">
<a href="GettingStarted.html">Getting Started</a>
</div>
<div class="navlink">
<a href="Examples.html">Examples</a>
</div>
<div class="navlink">
<a href="Framework.html">Framework</a>
</div>
<div class="navlink">
<a href="Documentation.html" class="current">Documentation</a>
</div>
<div class="navlink">
<a href="PowerVRTools.html">PowerVR Tools</a>
</div>
<div class="navlink">
<a href="ReleaseNotes.html">Release Notes</a>
</div>
<div class="navlink">
<a href="Contact.html">Contact Us</a>
</div>
</nav>
</div>
<div class="content">
<h1>Documentation</h1>
<p>This page provides a list of documents relevant to the SDK, including architecture guides, specifications and whitepapers. These documents are also accessible from the <a href="../../Documentation/" target="_blank">Documentation</a> folder.</p>
<hr/>
<p><a href="#architecture" class="link">Architecture Guides</a> | <a href="#specification" class="link">Specifications</a> | <a href="#whitepaper" class="link">Whitepapers</a></p>
<div id="architecture">
<h2>Architecture Guides</h2>
<ul>
<li><a href="../Architecture Guides/PowerVR Hardware.Architecture Overview for Developers.pdf" target="_blank" class="link">PowerVR Hardware Architecture Overview for Developers</a></li>
<li><a href="../Architecture Guides/PowerVR.Performance Recommendations.pdf" target="_blank" class="link">PowerVR Performance Recommendations</a></li>
<li><a href="../Architecture Guides/PowerVR Performance Recommendations.The Golden Rules.pdf" target="_blank" class="link">PowerVR Performance Recommendations: The Golden Rules</a></li>
<li><a href="../Architecture Guides/PowerVR.Supported Extensions.OpenGL ES.EGL.pdf" target="_blank" class="link">PowerVR Supported Extensions</a></li>
</ul>
</div>
<div id="specification">
<h2>Specifications</h2>
<ul>
<li><a href="../Specifications/PFX Language Format.Specification.pdf" target="_blank" class="link">PFX Language Format Specification</a></li>
<li><a href="../Specifications/POD File Format.Specification.pdf" target="_blank" class="link">POD File Format Specification</a></li>
<li><a href="../Specifications/PVR File Format.Specification.pdf" target="_blank" class="link">PVR File Format Specification</a></li>
<li><a href="../Specifications/PVR File Format.Specification.Legacy.pdf" target="_blank" class="link">PVR File Format Specification (Legacy)</a></li>
</ul>
</div>
<div id="whitepaper">
<h2>Whitepapers</h2>
<ul>
<li><a href="../Whitepapers/3D Navigation Rendering Techniques.Whitepaper.pdf" target="_blank" class="link">3D Navigation Rendering Techniques Whitepaper</a></li>
<li><a href="../Whitepapers/Dual Paraboloid Environment Mapping.Whitepaper.pdf" target="_blank" class="link">Dual Paraboloid Environment Mapping Whitepaper</a></li>
<li><a href="../Whitepapers/Edge Detection.Whitepaper.pdf" target="_blank" class="link">Edge Detection Whitepaper</a></li>
<li><a href="../Whitepapers/NavDataTools.Reference Guide.pdf" target="_blank" class="link">Navigational Data Tools Reference Guide</a></li>
<li><a href="../Whitepapers/Navigation Rendering Techniques.Whitepaper.pdf" target="_blank" class="link">Navigation Rendering Techniques Whitepaper</a></li>
<li><a href="../Whitepapers/Parallax Bumpmapping.Whitepaper.pdf" target="_blank" class="link">Parallax Bumpmapping Whitepaper</a></li>
<li><a href="../Whitepapers/Post Processing Effects.Whitepaper.pdf" target="_blank" class="link">Post Processing Effects Whitepaper</a></li>
<li><a href="../Whitepapers/Shader Based Water Effects.Whitepaper.pdf" target="_blank" class="link">Shader Based Water Effects Whitepaper</a></li>
<li><a href="../Whitepapers/UI Example.Whitepaper.pdf" target="_blank" class="link">UI Example Whitepaper</a></li>
</ul>
</div>
</div>
<br>
<div id="FooterMainContainer">
<div id="FooterContainer">
<div class="footerlogo">
<a href="http://www.imgtec.com" target="_blank"><img src="./images/img-footer-logo-grey.png" width="100%" height="100%" /></a>
</div>
<div class="copyright">&copy; Imagination Technologies Limited<br> All rights reserved</div>
</div>
</div>
</body>
</html>
\ No newline at end of file
Documentation/SDKBrowser/Examples.html 0 → 100644
<!DOCTYPE html>
<html lang="en">
<head>
<title>The PowerVR SDK Browser</title>
<meta charset="UTF-8" />
<link rel="stylesheet" type="text/css" href="style.css">
<link rel="icon" type="image/png" href="./images/img-icon.png">
</head>
<body>
<div id="GlobalHeaderContainer">
<div id="GlobalHeader">
<div class="logo">
<a href="http://www.powervrinsider.com" target="_blank"><img src="./images/PVRlogo.png" width="40%" height="40%" /></a>
</div>
<div class="sitetitle">PowerVR SDK Browser</div>
</div>
</div>
<div id="NavContainer">
<nav>
<div class="navlink">
<a href="Home.html">Home</a>
</div>
<div class="navlink">
<a href="GettingStarted.html">Getting Started</a>
</div>
<div class="navlink">
<a href="Examples.html" class="current">Examples</a>
</div>
<div class="navlink">
<a href="Framework.html">Framework</a>
</div>
<div class="navlink">
<a href="Documentation.html">Documentation</a>
</div>
<div class="navlink">
<a href="PowerVRTools.html">PowerVR Tools</a>
</div>
<div class="navlink">
<a href="ReleaseNotes.html">Release Notes</a>
</div>
<div class="navlink">
<a href="Contact.html">Contact Us</a>
</div>
</nav>
</div>
<!--API_TAB-->
<div id="SubNavContainer"><nav><div class="subnavlink"><a href="./OGLES.html">OpenGL ES 1.x</a></div>
<div class="subnavlink"><a href="./OGLES2.html">OpenGL ES 2.0</a></div>
<div class="subnavlink"><a href="./OGLES3.html">OpenGL ES 3.x</a></div>
</nav></div>
<div class="content">
<h1>Examples</h1>
<img src="./images/ExamplesPageGraphic.png"/>
<p>The <a href="../../Examples" target="_blank">Examples</a> folder supplied with this SDK contains several applications to show API-specific features in a simplified form. The examples are classified into beginner, intermediate and advanced categories, and the code has been thoroughly commented to help developers understand the API and get started.</p>
<p><em><strong>Note:</strong> Some of the examples do not handle screen rotation in order to keep the code as simple as possible. On devices with a portrait display the images below may appear stretched.</em></p>
<br>
</div>
<br>
<div id="FooterMainContainer">
<div id="FooterContainer">
<div class="footerlogo">
<a href="http://www.imgtec.com" target="_blank"><img src="./images/img-footer-logo-grey.png" width="100%" height="100%" /></a>
</div>
<div class="copyright">&copy; Imagination Technologies Limited<br> All rights reserved</div>
</div>
</div>
</body>
</html>
\ No newline at end of file
Documentation/SDKBrowser/Framework.html 0 → 100644
<!DOCTYPE html>
<html lang="en">
<head>
<title>The PowerVR SDK Browser</title>
<meta charset="UTF-8" />
<link rel="stylesheet" type="text/css" href="style.css">
<link rel="icon" type="image/png" href="./images/img-icon.png">
</head>
<body>
<div id="GlobalHeaderContainer">
<div id="GlobalHeader">
<div class="logo">
<a href="http://www.powervrinsider.com" target="_blank"><img src="./images/PVRlogo.png" width="40%" height="40%" /></a>
</div>
<div class="sitetitle">PowerVR SDK Browser</div>
</div>
</div>
<div id="NavContainer">
<nav>
<div class="navlink">
<a href="Home.html">Home</a>
</div>
<div class="navlink">
<a href="GettingStarted.html">Getting Started</a>
</div>
<div class="navlink">
<a href="Examples.html">Examples</a>
</div>
<div class="navlink">
<a href="Framework.html" class="current">Framework</a>
</div>
<div class="navlink">
<a href="Documentation.html">Documentation</a>
</div>
<div class="navlink">
<a href="PowerVRTools.html">PowerVR Tools</a>
</div>
<div class="navlink">
<a href="ReleaseNotes.html">Release Notes</a>
</div>
<div class="navlink">
<a href="Contact.html">Contact Us</a>
</div>
</nav>
</div>
<div class="content">
<h1>Framework</h1>
<p>The PowerVR Graphics SDK provides a framework which is made up of PVRShell and PVRTools.
PVRShell is a simple, light-weight architecture for the barebones of application setup, shutdown and event handling.
It is designed to streamline the process of writing cross-platform graphics applications.
PVRTools, on the other hand, is a cross-platform tools library containing the most commonly used functionality in a 3D graphics application.</p>
<hr/>
<p><a href="#PVRShell" class="link">PVRShell</a> | <a href="#PVRTools" class="link">PVRTools</a></p>
<div id="PVRShell">
<h2>PVRShell</h2>
<p>PVRShell is used in all our <a href="Examples.html">Examples</a> (except for HelloAPI) to provide a common framework for developing OpenGL ES applications on any PowerVR platform. The shell takes a set of command-line arguments which allow items like the position and size of the example to be controlled. The table below identifies these options.</p>
<table>
<thead>
<th>Option</th><th>Description</th>
</thead>
<tr>
<td>-aasamples=N</td><td>Sets the number of samples to use for full screen anti-aliasing, e.g., 0, 2, 4, 8.</td>
</tr>
<tr>
<td>-c=N</td><td>Save a single screenshot or a range, for a given frame or frame range, e.g., -c=14, -c=1-10.</td>
</tr>
<tr>
<td>-colourbpp=N or -cbpp=N</td><td>Frame buffer colour bits per pixel. When choosing an EGL config, N will be used as the value for EGL_BUFFER_SIZE.</td>
</tr>
<tr>
<td>-config=N</td><td>Force the shell to use the EGL config with ID N.</td>
</tr>
<tr>
<td>-depthbpp=N or -dbpp=N</td><td>Depth buffer bits per pixel. When choosing an EGL config, N will be used as the value for EGL_DEPTH_SIZE.</td>
</tr>
<tr>
<td>-discardframeall</td><td>Selects whether to explicitly request a discard of all contents of the relevant framebuffer at the end of every frame to save bandwidth.</td>
</tr>
<tr>
<td>-discardframecolour</td><td>Selects whether to explicitly request a discard of the frame colour of the relevant framebuffer at the end of every frame to save bandwidth. Default: false.</td>
</tr>
<tr>
<td>-discardframedepth</td><td>Selects whether to explicitly request a discard of the frame depth of the relevant framebuffer at the end of every frame to save bandwidth. Default: true.</td>
</tr>
<tr>
<td>-discardframestencil</td><td>Selects whether to explicitly request a discard of the frame stencil of the relevant framebuffer at the end of every frame to save bandwidth. Default: true.</td>
</tr>
<tr>
<td>-display</td><td>EGL only. Allows specifying the native display to use if the device has more than one.</td>
</tr>
<tr>
<td>-forceframetime=N or -fft=N</td><td>Force PVRShellGetTime to report fixed frame time.</td>
</tr>
<tr>
<td>-fps</td><td>Output frames per second.</td>
</tr>
<tr>
<td>-fullscreen=[1,0]</td><td>Runs in full-screen mode (1) or windowed (0).</td>
</tr>
<tr>
<td>-height=N</td><td>Sets the viewport height to N.</td>
</tr>
<tr>
<td>-info</td><td>Output setup information to the debug output.</td>
</tr>
<tr>
<td>-posx=N</td><td>Sets the x coordinate of the viewport.</td>
</tr>
<tr>
<td>-posy=N</td><td>Sets the y coordinate of the viewport.</td>
</tr>
<tr>
<td>-powersaving=[1,0] or -ps=[1,0]</td><td>Where available enable/disable power saving.</td>
</tr>
<tr>
<td>-priority=N</td><td>Sets the priority of the EGL context.</td>
</tr>
<tr>
<td>-quitafterframe=N or -qaf=N</td><td>Specify the frame after which to quit.</td>
</tr>
<tr>
<td>-quitaftertime=N or -qat=N</td><td>Specify the time after which to quit.</td>
</tr>
<tr>
<td>-rotatekeys=N</td><td>Sets the orientation of the keyboard input. N can be 0-3, where 0 is no rotation.</td>
</tr>
<tr>
<td>-screenshotscale=N</td><td>Allows to scale up screenshots to a bigger size (pixel replication).</td>
</tr>
<tr>
<td>-sw</td><td>Software render.</td>
</tr>
<tr>
<td>-version</td><td>Output the SDK version to the debug output.</td>
</tr>
<tr>
<td>-vsync=N</td><td>Where available modify the app's vsync parameters.</td>
</tr>
<tr>
<td>-width=N</td><td>Sets the viewport width to N.</td>
</tr>
</table>
<p>PVRShell also provides limited keyboard input which may vary depending on your actual platform. If your platform has full keyboard support, the <span class="code">Q</span> key will quit the application and the cursor keys will allow looping through the application options.</p>
<p>The PVRShell source can be found in the <a href="../../Shell/">Shell</a> folder in the SDK package. Further documentation is available at <a href="../../Shell/Documentation/Index.html">Shell/Documentation</a>.</p>
</div>
<div id="PVRTools">
<h2>PVRTools</h2>
<p>The PVRTools library consists of various modules designed to facilitate common tasks associated with hardware accelerated graphics rendering. This includes:</p>
<ul>
<li><p><strong>Vector, matrix and quaternion mathematics:</strong> Helpers to calculate and operate transformation matrices and other associated mathematical operations.</p></li>
<li><p><strong>OpenGL ES extension handling:</strong> This helps to load and use OpenGL ES extension functions and capabilities.</p></li>
<li><p><strong>3D font drawing:</strong> A very flexible engine to handle font maps.</p></li>
<li><p><strong>POD loader:</strong> Helpers to load and access the model data included in PowerVR Object Data (POD) files.</p></li>
<li><p><strong>PVR loader:</strong> Helpers to upload and manage textures exported to the PVR texture container format.</p></li>
<li><p><strong>PFX loader:</strong> Helpers to load and access PowerVR Effects (PFX) files, which contain vertex and fragment shaders.</p></li>
</ul>
<p>The Tools library is used extensively throughout the PowerVR SDK. The PVRTools source can be found in the <a href="../../Tools/">Tools</a> folder in the SDK package. Further documentation is available at <a href="../../Tools/Documentation/Index.html">Tools/Documentation</a>.</p>
</div>
</div>
<br>
<div id="FooterMainContainer">
<div id="FooterContainer">
<div class="footerlogo">
<a href="http://www.imgtec.com" target="_blank"><img src="./images/img-footer-logo-grey.png" width="100%" height="100%" /></a>
</div>
<div class="copyright">&copy; Imagination Technologies Limited<br> All rights reserved</div>
</div>
</div>
</body>
</html>
\ No newline at end of file
Documentation/SDKBrowser/GettingStarted.html 0 → 100644
<!DOCTYPE html>
<html lang="en">
<head>
<title>The PowerVR SDK Browser</title>
<meta charset="UTF-8" />
<link rel="stylesheet" type="text/css" href="style.css">
<link rel="icon" type="image/png" href="./images/img-icon.png">
</head>
<body>
<div id="GlobalHeaderContainer">
<div id="GlobalHeader">
<div class="logo">
<a href="http://www.powervrinsider.com" target="_blank"><img src="./images/PVRlogo.png" width="40%" height="40%" /></a>
</div>
<div class="sitetitle">PowerVR SDK Browser</div>
</div>
</div>
<div id="NavContainer">
<nav>
<div class="navlink">
<a href="Home.html">Home</a>
</div>
<div class="navlink">
<a href="GettingStarted.html">Getting Started</a>
</div>
<div class="navlink">
<a href="Examples.html">Examples</a>
</div>
<div class="navlink">
<a href="Framework.html">Framework</a>
</div>
<div class="navlink">
<a href="Documentation.html">Documentation</a>
</div>
<div class="navlink">
<a href="PowerVRTools.html">PowerVR Tools</a>
</div>
<div class="navlink">
<a href="ReleaseNotes.html">Release Notes</a>
</div>
<div class="navlink">
<a href="Contact.html">Contact Us</a>
</div>
</nav>
</div>
<div class="content">
<h1>Getting Started</h1>
<p><strong>Platform setup:</strong> <a href="#android" class="link">Android</a> | <a href="#ios" class="link">iOS</a> | <a href="#windows" class="link">Windows</a> | <a href="#osx" class="link">OS X</a> | <a href="#linux" class="link">Linux</a> | <a href="#webgl" class="link">WebGL</a>
<p><strong>Tutorials:</strong> <a href="#xcodeoglespvrvframe" class="link">XCode project setup for OpenGL ES using PVRVFrame</a></p>
<hr/>
<h3><strong>Platform Setup</strong></h3>
<p><em><strong>Note:</strong> PVRVFrame PC Emulation is not intended to be a completely accurate replication of the behaviour of PowerVR hardware. This tool is a wrapper around desktop OpenGL so its performance and capabilities will depend on the 3D acceleration present in your system.</em><p>
<p>The installation instructions contained in this section use various placeholders. The table below identifies the placeholders and their corresponding description.</p>
<table>
<thead>
<th>Placeholder</th><th>Description</th>
</thead>
<tr>
<td>[API]</td><td>Shorthand for the targeted Application Programming Interface, e.g., OGLES2 for OpenGL ES 2.0.</td>
</tr>
<tr>
<td>[ExampleName]</td><td>The name of the example application that you are building.</td>
</tr>
<tr>
<td>[Level]</td><td>The name of the folder the examples are sorted into according to their complexity. These folders are named either Beginner, Intermediate or Advanced.</td>
</tr>
<tr>
<td>[Platform]</td><td>The targeted Application Binary Interface, e.g., x86.</td>
</tr>
<tr>
<td>[PVRVFrameShort]</td><td>Shorthand term used in the file name of a PVRVFrame specific .dll or .lib file, e.g., GLES_CM in libGLES_CM.dll.</td>
</tr>
<tr>
<td>[ReleaseDir]</td><td>This refers to the release directory, which is either ReleaseRaw or ReleaseX11 in the case of Linux.</td>
</tr>
<tr>
<td>[Target]</td><td>ID number of the Android list target.</td>
</tr>
</table>
<div id="android">
<h2>Android</h2>
<p>The following instructions for building the examples in the Android PowerVR Graphics SDK assume that you have already installed the Android SDK from Google, the NDK and Apache Ant.</p>
<p>To build individual components go to the <span class="code">/Build/Android</span> sub-directory of the component to build. To create local properties, on the first build you will need to run:</p>
<ol>
<li>
<p><span class="code">android update project -p . -t [Target]</span>, where the list of targets can be found with the following command (<span class="code">[Target]</span> corresponds to the ID number): <span class="code">android list target</span></p>
</li>
</ol>
<p>To use the Android tool you need to have the Android SDK's tool folder in your path. After this, the building of an application is done in two stages. The first stage involves compiling the C++ code into a library. This is achieved using <span class="code">ndk-build</span> which is part of the Android NDK and needs to be present in your path. To compile for all supported platforms:</p>
<ol>
<li>
<p>Type <span class="code">ndk-build</span></p>
</li>
<li>
<p>On an a specific platform you can compile by typing: <span class="code">ndk-build APP_ABI=[Platform]</span>. <span class="code">[Platform]</span> is an entry from one of the following supported ABIs:</p>
<ul>
<li>armeabi</li>
<li>armeabi-v7a</li>
<li>x86</li>
<li>mips</li>
</ul>
</li>
<li>
<p>The second stage compiles the remaining Java components and creates the APK file for installing on your device. The quickest way of achieving this is to type: <span class="code">ant debug</span>. This will create an APK file in <span class="code">./bin</span> and will handle the signing of your application for you. For creating a release build of your app please visit the relevant page at <a href="http://developer.android.com/guide/index.html" target="_blank">http://developer.android.com/guide/index.html</a>.</p>
</li>
</ol>
<h3>Using Android SDK Manager</h3>
<p>The following instructions for building the examples in the PowerVR Graphics SDK assume that you have an Eclipse environment with the Android SDK and NDK installed, as well as the NDK Eclipse plug-in. For more details about using the NDK, please visit <a href="http://tools.android.com/recent/usingthendkplugin" target="_blank">Android Tools Project Site</a>.
<p>To download the Android PowerVR Graphics SDK through the Android SDK Manager, perform the following steps:</p>
<ol>
<li>
<p>Open the Android SDK manager.</p>
</li>
<li>
<p>Open the <span class="code">Tools -> Manage Add-on Sites</span> window and click the <span class="code">User Defined Sites</span> tab.</p>
</li>
<li>
<p>Click <span class="code">New...</span> and add the following URL: <a href="http://cdn.imgtec.com/sdk/androidsdk.xml" target="_blank">http://cdn.imgtec.com/sdk/androidsdk.xml</a></li> The PowerVR SDK should now appear on the <span class="code">Packages</span> list, under <span class="code">API 10</span>.</p>
</li>
<li>
<p>Once the SDK is installed you will then need to add the <span class="code">PVRSDKDIR</span> environment variable for your NDK builds. To do so in Eclipse, click <span class="code">Window</span> and open the <span class="code">Preferences</span> menu. From there, navigate to <span class="code">C/C++ -> Build -> Environment</span> and add the variable <span class="code">PVRSDKDIR</span>, setting its value to where the add-on is installed (typically under the add-ons directory inside the Android SDK).</p>
</li>
<li>
<p>All the examples can be imported by selecting the PowerVR SDK during the creation of a new Android sample project in Eclipse.</p>
</li>
</ol>
<p><em><strong>Note:</strong> Please note that for Windows we recommend to point <span class="code">PVRSDKDIR</span> to <span class="code">../</span> and copy the <span class="code">shell/</span>, <span class="code">tools/</span> and <span class="code">builds/</span> directories from the add-on folder to your <span class="code">workspace/</span>. This is due to the dropping of support for Windows paths in GNU Make 3.81 onwards. Otherwise the use of paths containing <span class="code">:</span> yields the error <span class="code">*** target pattern contains no '%'</span>.</em></p>
<p><em><strong>Note:</strong> For Windows, the Eclipse CDT <span class="code">"Scanner Configuration Builder"</span> appears not to be working with the directory structure of our <span class="code">samples/tools/shell</span>. For that reason is recommended to disable it from your project. To do this, right-click <span class="code">Project Name -> Properties -> Builders -> Disable the "Scanner Configuration Builder"</strong>.</em></p>
</div>
<div id="ios">
<h2>iOS</h2>
<p>To proceed with the installation of the PowerVR Graphics SDK on iOS, complete the following steps:<p>
<ol>
<li>
<p>Download a version of Apple's iOS SDK from <a href="http://developer.apple.com/ios/" target="_blank">http://developer.apple.com/ios/</a>. You will need to become a member of Apple's developer programme in order to access this page. You can find details of how to join at <a href="http://developer.apple.com" target="_blank">http://developer.apple.com</a>.</p>
</li>
<li>
<p>Install the Apple SDK on your Mac as specified by Apple's hardware and software requirements. This should also install Xcode and the other development tools required.</p>
</li>
<li>
<p>Expand the PowerVR Graphics SDK for iOS to a location for which you have both read and write access.</p>
</li>
<li>
<p>To build the examples and other projects from the SDK, find the various <span class="code">[API]***.xcode</span> projects available within the <span class="code">SDKPackage_[API]</span> directory and double click these to launch them in Xcode.</p>
</li>
<li>
<p>To build for an iOS device you will need a valid developer certificate in your machine's keychain. You may also have to change the <span class="code">Properties | Identifier</span> property from <span class="code">Project | Edit Active Target...</span> to match that which you have set up for yourself through Apple's Program Portal.</p>
</li>
<li>
<p>If you do not have a developer certificate from Apple then you can still build and launch applications in the iOS Simulator. Choose this configuration from the dropdown menu at the top left and then choose <span class="code">Build and Run</span> from the dropdown menu.</p>
</li>
</ol>
<p><em><strong>Note:</strong> The Scheme that you are building under may need to be set up for the SDK's projects to run.</em></p>
</div>
<div id="windows">
<h2>Windows</h2>
<p>This SDK requires a PC equipped with Windows XP, Windows Vista or Windows 7. The required installation steps are:</p>
<ol>
<li>
<p>Install the SDK on your machine as specified by Windows hardware and software requirements. The project and solution files provided do not require the SDK to be installed in a pre-defined location and are configured to use relative paths.</p>
</li>
<li>
<p>Copy the API-specific emulation "drivers" to a DLL-accessible directory prior to running the SDK applications. The API-specific emulation "drivers" are called <span class="code">libEGL.dll</span>, <span class="code">libEGL.lib</span>, <span class="code">lib[PVRVFrameShort].dll</span> and <span class="code">lib[PVRVFrameShort].lib</span>. The files are located by default in <span class="code">\Builds\Windows\x86_32\Lib</span> and <span class="code">\Builds\Windows\x86_64\Lib</span>.</p>
</li>
</ol>
<p><em><strong>Note:</strong> The examples can be launched directly from their project files.</em></p>
</div>
<div id="osx">
<h2>OS X</h2>
<p>The OS X SDK requires OS X (Snow Leopard) or higher for full operation.</p>
<ol>
<li>
<p>Install the latest version of Xcode, available from <a href="http://developer.apple.com/" target="_blank">http://developer.apple.com/</a> or from the Mac App store.</p>
<li>
<p>Expand the PowerVR Graphics SDK for OS X into a location for which you have full access.</p>
</li>
<li>
<p>To build the examples and other projects from the SDK, find the various <span class="code">[API]***.xcodeproj</span> projects available within the <span class="code">SDKPackage_[API]</span> directory and double click these to launch them in Xcode.</p>
</li>
</ol>
<p><em><strong>Note:</strong> The Scheme that you are building under may need to be set up for the SDK's projects to run.</em></p>
</div>
<div id="linux">
<h2>Linux</h2>
<p><em><strong>Note:</strong> API libraries are not distributed with the PowerVR Graphics SDK for Linux. Please ask your platform provider for these libraries if you do not have them. You will also need to install the latest platform toolchain on your development machine for your target platform.</em></p>
<p>To build the code examples, follow the steps below:</p>
<ol>
<li>
<p>Define the <span class="code">TOOLCHAIN</span> environment variable to the toolchain directory, or add the path of the toolchain to the <span class="code">PATH</span> environment variable (i.e., run <span class="code">export PATH="<i>path to the toolchain</i>:$PATH"</span>).</p>
</li>
<li>
<p>If you want an X11 build and it is available, define the environment variable <span class="code">X11ROOT</span> to point to the <span class="code">freedesktop</span> directory (i.e., <span class="code">export X11ROOT=/usr/X11R6_SGX</span>).</p>
</li>
<li>
<p>To build individual components go to the directory <span class="code">Examples/[Level]/[ExampleName]/[API]/Build/LinuxGeneric</span> and run the command: <span class="code">LinuxRaw: "make PLATFORM=[Platform]"</span> or <span class="code">LinuxX11: "make PLATFORM=[Platform] X11BUILD=1"</span>. <span class="code">[Platform]</span> is an entry from one of the following supported ABIs:</p>
<ul>
<li>linux_armv7</li>
<li>linux_armv7hf</li>
<li>linux_x86_32</li>
<li>linux_x86_64</li>
</ul>
</li>
</ol>
<p>The executables for the examples will be under: <span class="code">Examples/[Level]/[ExampleName]/[API]/Build/[Platform]/[ReleaseDir]</span> where <span class="code">[ReleaseDir]</span> is one of <span class="code">ReleaseRaw</span> or <span class="code">ReleaseX11</span>. <span class="code">[ExampleName]</span> is the name of the example that you are building and <span class="code">[Level]</span> is either <span class="code">Beginner</span>, <span class="code">Intermediate</span> or <span class="code">Advanced</span>.</p>
<p>To run an executable, follow the steps below:</p>
<ol>
<li>
<p>Ensure that the PowerVR drivers are installed on the target device (please refer to the DDK/driver installation instructions).</p>
</li>
<li>
<p>If the standard C++ libraries are not present on your target device, copy <span class="code">libc++</span> from the toolchain into <span class="code">/usr/lib</span>. <span class="code">libdl</span> and <span class="code">libgcc</span> may also be required.</p>
<p><em><strong>Note:</strong> <span class="code">libc++</span> lives at <span class="code">/usr/lib</span> if you have installed the drivers, or can be found as part of a binary driver release package.</em></p>
</li>
<li>
<p>Ensure the drivers are running (e.g., type <span class="code">/etc/init.d/rc/pvr</span> start, then run an X session if required).</p>
<p>Under X11, window sizes can be specified for the executables using the command-line arguments <span class="code">-posx=n</span> and <span class="code">-posy=n</span> to define the top right hand corner, and <span class="code">-width=n</span> and <span class="code">-height=n</span> to define width and height, respectively.</p>
<p>For example:</p>
<p class="code">./[API]IntroducingPOD -posx=10 -posy=10 -width=100 -height=100</p>
</li>
<li>
<p>If you attempt to run an SDK example and it fails with the message: <span class="code">"Can't open display"</span> produced by the X client, then make sure that the <span class="code">DISPLAY</span> variable is set with the shell command: <span class='code'>"set | grep -e DISPLAY"</span>. If this command does not yield any output then type (in shell): <span class='code'>"DISPLAY=:0.0; export DISPLAY"</span></p>
</li>
</ol>
</div>
<div id="webgl">
<h2>WebGL</h2>
<p>The steps below highlight the procedure for setting up the WebGL SDK:</p>
<ol>
<li>
<p>To host and run the WebGL SDK you will need a web server. Since the WebGL SDK only uses HTML5 and JavaScript (no dynamically generated content) any web server capable of serving HTML is suitable for hosting it. The WebGL SDK does not require building.</p>
</li>
<li>
<p>To use the WebGL SDK, copy across the contents of the WebGL package to an appropriate location in your web server tree (in some cases, also configure your web server to serve it), keeping the folder structure intact.</p>
</li>
<li>
<p>You can then navigate to and launch the required example from the SDK Browser.</p>
</li>
</ol>
<p><em><strong>Note:</strong> If you do not have a web server available, you will need to install and configure one, as appropriate. For example, on Windows, IIS is usually built in and may require to be enabled and configured. On OS X, Apache may require to be enabled and configured. Most Linux distributions will contain a web server such as Apache. Alternatively, you may want to download, install and configure another web server depending on what your specific needs are. A useful <a href="http://en.wikipedia.org/wiki/Comparison_of_web_server_software" target="_blank">comparison of web server software</a> is available in Wikipedia.</em></p>
</div>
<hr/>
<h3><strong>Tutorials</strong></h3>
<div id="xcodeoglespvrvframe">
<h2>XCode Project Setup for OpenGL ES Using PVRVFrame</h2>
<p>The following steps detail how to set up, from scratch, an XCode project for OpenGL ES using PVRVFrame:</p>
<ol>
<li>
<p>Open the XCode application and then click <span class="code">File -> New -> Project</span> from the menu. Select <span class="code">Cocoa Application</span> from the template OS X or Application. Select <span class="code">Next</span> and fill the product name, e.g., <span class="code">IntroducingPOD</span>, and the company identifier. Other fields can be left as is. Then select the project destination directory.</p>
</li>
<li>
<p>To organise the project, right-click on it from the <span class="code">Project Navigator</span> and select <span class="code">New Group</span>. Following this, create the following groups (which will contain the mentioned application contents):</p>
<ul>
<li>Source/Shell (Shell source files)</li>
<li>Content/Models (.pod files)</li>
<li>Content/Textures (.pvr textures)</li>
<li>Content/Shaders (shaders)</li>
<li>Libraries (dependencies)</li>
</ul>
</li>
<li>
<p>Right click the <span class="code">Shell</span> group and select <span class="code">Add Files</span> to <span class="code">"project name"</span> and add these following files:</p>
<ul>
<li><span class="code">PVRShell.h</span>, <span class="code">PVRShell.cpp</span>, <span class="code">PVRShellImpl.h</span> (from <span class="code">[sdk-installation-directory]/Shell</span>)</li>
<li><span class="code">PVRShellAPI.h</span>, <span class="code">PVRShellAPI.cpp,</span> (from <span class="code">[sdk-installation-directory]/Shell/API/KEGL</span>)</li>
<li><span class="code">main.m</span>, <span class="code">PVRShellOS.h</span>, <span class="code">PVRShellOS.cpp</span>, <span class="code">AppController.mm</span>, <span class="code">AppController.h</span> (from <span class="code">[sdk-installation-directory]/ /Shell/OS/OSX</span>)</li>
</ul>
</li>
<li>
<p>Under the <span class="code">Source</span> group create a new .cpp file for your application code and include the following header files:</p>
<ul>
<li><span class="code">PVRShell.h</span></li>
<li><span class="code">OGLES3Tools.h</span></li>
</ul>
</li>
<li>
<p>Right-click the <span class="code">Libraries</span> group and then select <span class="code">Add Files</span> to <span class="code">"project name"</span> and navigate to the <span class="code">[sdk-installation-directory] /Tools/[API]/Build/OSX/[API]Tools.xcodeproj</span> and add this project.</p>
</li>
<li>
<p>Go to your project’s <span class="code">Targets Build Phases</span> settings and add the following source files under the <span class="code">Compile Sources</span> section:</p>
<ul>
<li>Your application source file</li>
<li>PVRShell.cpp</li>
<li>PVRShellAPI.cpp</li>
<li>PVRShellOS.cpp</li>
<li>main.m</li>
<li>AppController.mm</li>
</ul>
<p>Add the library files under <span class="code">LinkBinary With Libraries</span> section:</p>
<ul>
<li><span class="code">Lib[API]Tools.a</span></li>
<li><span class="code">Quartzcore.framework</span></li>
<li><span class="code">libEGL.dylib</span> located at <span class="code">[sdk-installation-directory]/ /Builds/OSX/x86/Lib</span></li>
<li><span class="code">libGLESv2.dylib</span> located at <span class="code">[sdk-installation-directory]/ /Builds/OSX/x86/Lib</span></li>
</ul>
<p>Then add all content files (such as PVR files, POD files, shaders, icons, etc.) under <span class="code">Copy Bundle Resources</span>.</p>
<p>Following this, add a new build phase called <span class="code">Copy Files</span>, and select <span class="code">Destination Frameworks</span> and add these following library files:</p>
<ul>
<li><span class="code">libEGL.dylib</span></li>
<li><span class="code">libGLESv2.dylib</span></li>
</ul>
</li>
<li>
<p>Go to your project’s <span class="code">Targets Build Phases</span> settings, and under the <span class="code">Preprocessing</span> section add <span class="code">BUILD [API] preprocessor for Debug and release configuration</span>. Then under the <span class="code">Search</span> paths section select <span class="code">Yes for Always Search User Paths</span> and add these header search paths to <span class="code">User Header Search Paths</span>:</p>
<ul>
<li><span class="code">[sdk-installation-directory]/Builds/Include</span></li>
<li><span class="code">[sdk-installation-directory]/Tools/[API]</span></li>
<li><span class="code">[sdk-installation-directory]/Tools</span></li>
</ul>
<p>If your targeted API is OGLES3 then you also have to add:</p>
<ul>
<li><span class="code">[sdk-installation-directory]/Builds/Tools/OGLES2</span></li>
</ul>
<p>Add these following paths to the Library Search Paths:</p>
<ul>
<li><span class="code">[sdk-installation-directory]/Builds/OSX/x86/Lib</span></li>
</ul>
</li>
</ol>
</div>
<br>
</div>
<div id="FooterMainContainer">
<div id="FooterContainer">
<div class="footerlogo">
<a href="http://www.imgtec.com" target="_blank"><img src="./images/img-footer-logo-grey.png" width="100%" height="100%" /></a>
</div>
<div class="copyright">&copy; Imagination Technologies Limited<br> All rights reserved</div>
</div>
</div>
</body>
</html>
\ No newline at end of file
Documentation/SDKBrowser/Home.html 0 → 100644
<!DOCTYPE html>
<html lang="en">
<head>
<title>The PowerVR SDK Browser</title>
<meta charset="UTF-8" />
<link rel="stylesheet" type="text/css" href="style.css">
<link rel="icon" type="image/png" href="./images/img-icon.png">
</head>
<body>
<div id="GlobalHeaderContainer">
<div id="GlobalHeader">
<div class="logo">
<a href="http://www.powervrinsider.com" target="_blank"><img src="./images/PVRlogo.png" width="40%" height="40%" /></a>
</div>
<div class="sitetitle">PowerVR SDK Browser</div>
</div>
</div>
<div id="NavContainer">
<nav>
<div class="navlink">
<a href="Home.html" class="current">Home</a>
</div>
<div class="navlink">
<a href="GettingStarted.html">Getting Started</a>
</div>
<div class="navlink">
<a href="Examples.html">Examples</a>
</div>
<div class="navlink">
<a href="Framework.html">Framework</a>
</div>
<div class="navlink">
<a href="Documentation.html">Documentation</a>
</div>
<div class="navlink">
<a href="PowerVRTools.html">PowerVR Tools</a>
</div>
<div class="navlink">
<a href="ReleaseNotes.html">Release Notes</a>
</div>
<div class="navlink">
<a href="Contact.html">Contact Us</a>
</div>
</nav>
</div>
<div class="content">
<img src="./images/WelcomeGraphic.png"/>
<p>The PowerVR Graphics SDK includes tutorials, source code, documentation, platform abstraction frameworks and a highly integrated suite of tools. For further details regarding your SDK installation, please visit the <a href="./GettingStarted.html">Getting Started</a> page.</p>
<p>The <a href="./Examples.html">Examples</a> page features a range of methods from initialising the API through to complex 3D graphics techniques. Many of these take advantage of our <a href="./Framework.html">Framework</a> which includes PVRShell abstraction layer and PVRTools library, both of which are available as source libraries.</p>
<p>We've also supplied a range of documents which can be accessed from the <a href="./Documentation.html">Documentation</a> page. These documents include the relevant list of architecture guides, specifications, user manuals and whitepapers.</p>
<p>Additional information is provided in this browser regarding the PowerVR suite of utilities (see <a href="./PowerVRTools.html">PowerVR Tools</a> page). A <a href="./ReleaseNotes.html">Release Notes</a> page is also present, detailing what's changed in this release.</p>
<p>Developers can join the PowerVR Insider programme and interact with the community through online forums at <a href="http://www.powervrinsider.com" target="_blank">www.powervrinsider.com</a>. Also visit our <a href="./Contact.html">Contact</a> page for further details on how to get in touch with us.</p>
<br>
</div>
<div id="FooterMainContainer">
<div id="FooterContainer">
<div class="footerlogo">
<a href="http://www.imgtec.com" target="_blank"><img src="./images/img-footer-logo-grey.png" width="100%" height="100%" /></a>
</div>
<div class="copyright">&copy; Imagination Technologies Limited<br> All rights reserved</div>
</div>
</div>
</body>
</html>
\ No newline at end of file
Documentation/SDKBrowser/OCL_OGLES2.html 0 → 100644
<!DOCTYPE html>
<html lang="en">
<head>
<title>The PowerVR SDK Browser</title>
<meta charset="UTF-8" />
<link rel="stylesheet" type="text/css" href="style.css">
<link rel="icon" type="image/png" href="./images/img-icon.png">
</head>
<body>
<div id="GlobalHeaderContainer">
<div id="GlobalHeader">
<div class="logo">
<a href="http://www.powervrinsider.com" target="_blank"><img src="./images/PVRlogo.png" width="40%" height="40%" /></a>
</div>
<div class="sitetitle">PowerVR SDK Browser</div>
</div>
</div>
<div id="NavContainer">
<nav>
<div class="navlink">
<a href="Home.html">Home</a>
</div>
<div class="navlink">
<a href="GettingStarted.html">Getting Started</a>
</div>
<div class="navlink">
<a href="Examples.html" class="current">Examples</a>
</div>
<div class="navlink">
<a href="Framework.html">Framework</a>
</div>
<div class="navlink">
<a href="Documentation.html">Documentation</a>
</div>
<div class="navlink">
<a href="PowerVRTools.html">PowerVR Tools</a>
</div>
<div class="navlink">
<a href="ReleaseNotes.html">Release Notes</a>
</div>
<div class="navlink">
<a href="Contact.html">Contact Us</a>
</div>
</nav>
</div>
<!--API_TAB-->
<div class="content">
<div id="Section" class="section">
<!--API_DESCRIPTION-->
<h1>OpenCL 1.x Examples</h1>
<p>
OpenCL is a cross-platform API for parallel computing on modern processors, including CPUs, GPUs and custom accelerators. It is available both on desktop and embedded platforms, with an embedded profile which is used for more efficient rendering on mobile devices. Rather than being bottlenecked by the CPU, an application can use OpenCL to make use of processors like the GPU that may otherwise remain starved of work, accelerating the application. Also, many workloads that are typically run serially on a CPU are able to complete significantly faster by parallelizing the algorithm and executing them on a GPU. This API is available on PowerVR Series6 GPUs and later.
</p>
</OCL_OGLES2>
<p><a href="#Beginner" class="link">Beginner</a> | <a href="#Intermediate" class="link">Intermediate</a> | <a href="#Advanced" class="link">Advanced</a></p>
<!--EXAMPLE_TEMPLATE-->
<div id="Beginner""><h2>Beginner</h2><ul class="accordion">
<li id="HelloAPI">
<div class="title">
<a href="../../Examples/Beginner/01_HelloAPI/OCL_OGLES2HelloAPI.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Beginner/01_HelloAPI/OCL_OGLES2HelloAPI.png" alt="HelloAPI" /></a>
<input type="checkbox" id="HelloAPIFull2">
<label for="HelloAPIFull2" title="Click for more information"><h3>HelloAPI</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>How to invoke an OpenCL kernel
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>A basic tutorial that shows step-by-step how to initialize OpenCL, create a kernel and then execute it. A kernel is a C-like language used for writing programs.
</p></p>
<p><strong>Controls:</strong></p>
<p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Beginner/01_HelloAPI/OCL_OGLES2/OCL_OGLES2HelloAPI.cpp" target="_blank">OCL_OGLES2HelloAPI.cpp</a> | <a href="../../Examples/Beginner/01_HelloAPI/OCL_OGLES2/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li></div></ul><div id="Intermediate""><h2>Intermediate</h2><ul class="accordion">
<li id="ImageConvolution">
<div class="title">
<a href="../../Examples/Intermediate/ImageConvolution/ImageConvolution.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/ImageConvolution/ImageConvolution.png" alt="ImageConvolution" /></a>
<input type="checkbox" id="ImageConvolutionFull2">
<label for="ImageConvolutionFull2" title="Click for more information"><h3>ImageConvolution</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>Introduction to image processing using OpenCL API.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This demonstration deals with image processing. It illustrates the usage of OpenCL to write linear and non-linear filter kernels.
</p></p>
<p><strong>Controls:</strong></p>
<p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/ImageConvolution/OCL_OGLES2/OCL_OGLES2ImageConvolution.cpp" target="_blank">OCL_OGLES2ImageConvolution.cpp</a> | <a href="../../Examples/Intermediate/ImageConvolution/OCL_OGLES2/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="ZeroCopyCamera">
<div class="title">
<a href="../../Examples/Intermediate/ZeroCopyCamera/ZeroCopyCamera.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/ZeroCopyCamera/ZeroCopyCamera.png" alt="ZeroCopyCamera" /></a>
<input type="checkbox" id="ZeroCopyCameraFull2">
<label for="ZeroCopyCameraFull2" title="Click for more information"><h3>ZeroCopyCamera</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This example demonstrates the most optimal path to stream textures from the Camera of a mobile device and then Share it across API's
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>Streaming texture data from a camera source to a graphics API is a technique which can be very costly if hardware and software optimisations are not used correctly. This example demonstrates the correct usage for platform-specific texture streaming using native APIs relevant for each platform.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/ZeroCopyCamera/OCL_OGLES2/OCL_OGLES2ZeroCopyCamera.cpp" target="_blank">OCL_OGLES2ZeroCopyCamera.cpp</a> | <a href="../../Examples/Intermediate/ZeroCopyCamera/OCL_OGLES2/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li></div></ul><div id="Advanced""><h2>Advanced</h2><ul class="accordion">
<li id="GameOfLife">
<div class="title">
<a href="../../Examples/Advanced/GameOfLife/GameOfLife.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Advanced/GameOfLife/GameOfLife.png" alt="GameOfLife" /></a>
<input type="checkbox" id="GameOfLifeFull2">
<label for="GameOfLifeFull2" title="Click for more information"><h3>GameOfLife</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>Implementation of John Conway's Game of Life using OpenCL.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This demo utilises OpenCL to take advantage of the GPU computation available in PowerVR Series6 to implement John Conway's Game of Life simulation, updating every aspect of the grid where all the particles are stored. OpenGL then retrieves the result of that computation and presents it on the screen.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Left and right arrows : Switch between evolution functions.</p><p> Up : Pause simulation.</p><p> Down : Generate new population.</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Advanced/GameOfLife/OCL_OGLES2/OCL_OGLES2GameOfLife.cpp" target="_blank">OCL_OGLES2GameOfLife.cpp</a> | <a href="../../Examples/Advanced/GameOfLife/OCL_OGLES2/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="ParticleSystem">
<div class="title">
<a href="../../Examples/Advanced/ParticleSystem/ParticleSystem.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Advanced/ParticleSystem/ParticleSystem.png" alt="ParticleSystem" /></a>
<input type="checkbox" id="ParticleSystemFull2">
<label for="ParticleSystemFull2" title="Click for more information"><h3>ParticleSystem</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>Shows how to implement a simple particle system using OpenCL and the GPU.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>The demo utilises OpenCL to implement a particle system. Particle systems are techniques that use a large amount of sprites to simulate phenomena that would be difficult to reproduce with conventional rendering techniques. Furthermore, it also highlights the interaction between OpenCL and OpenGL (plus OpenGL ES 2).
</p><p>- left and right arrows - Decrease and increase number of particles
</p><p>- up and down arrows - Switch between OpenCL and CPU Particle System implementation.
</p></p>
<p><strong>Controls:</strong></p>
<p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Advanced/ParticleSystem/OCL_OGLES2/OCL_OGLES2ParticleSystem.cpp" target="_blank">OCL_OGLES2ParticleSystem.cpp</a> | <a href="../../Examples/Advanced/ParticleSystem/OCL_OGLES2/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="ProceduralTextures">
<div class="title">
<a href="../../Examples/Advanced/ProceduralTextures/ProceduralTextures.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Advanced/ProceduralTextures/ProceduralTextures.png" alt="ProceduralTextures" /></a>
<input type="checkbox" id="ProceduralTexturesFull2">
<label for="ProceduralTexturesFull2" title="Click for more information"><h3>ProceduralTextures</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>Shows how to generate procedural textures using OpenCL.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>Utilises OpenCL to generate procedural textures using Steven Worley's cellular texture basis functions. Procedural textures are computer-generated images created using an algorithm intended to create a realistic representation of natural elements such as wood or marble.
</p><p>- left and right arrows - Switch between distance metrics
</p><p>- up and down arrows - Switch between linear combination of weights
</p></p>
<p><strong>Controls:</strong></p>
<p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Advanced/ProceduralTextures/OCL_OGLES2/OCL_OGLES2ProceduralTextures.cpp" target="_blank">OCL_OGLES2ProceduralTextures.cpp</a> | <a href="../../Examples/Advanced/ProceduralTextures/OCL_OGLES2/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li></div></ul> </div>
</div>
<div id="FooterMainContainer">
<div id="FooterContainer">
<div class="footerlogo">
<a href="http://www.imgtec.com" target="_blank"><img src="./images/img-footer-logo-grey.png" width="100%" height="100%" /></a>
</div>
<div class="copyright">&copy; Imagination Technologies Limited<br> All rights reserved</div>
</div>
</div>
</body>
</html>
\ No newline at end of file
Documentation/SDKBrowser/OGL.html 0 → 100644
<!DOCTYPE html>
<html lang="en">
<head>
<title>The PowerVR SDK Browser</title>
<meta charset="UTF-8" />
<link rel="stylesheet" type="text/css" href="style.css">
<link rel="icon" type="image/png" href="./images/img-icon.png">
</head>
<body>
<div id="GlobalHeaderContainer">
<div id="GlobalHeader">
<div class="logo">
<a href="http://www.powervrinsider.com" target="_blank"><img src="./images/PVRlogo.png" width="40%" height="40%" /></a>
</div>
<div class="sitetitle">PowerVR SDK Browser</div>
</div>
</div>
<div id="NavContainer">
<nav>
<div class="navlink">
<a href="Home.html">Home</a>
</div>
<div class="navlink">
<a href="GettingStarted.html">Getting Started</a>
</div>
<div class="navlink">
<a href="Examples.html" class="current">Examples</a>
</div>
<div class="navlink">
<a href="Framework.html">Framework</a>
</div>
<div class="navlink">
<a href="Documentation.html">Documentation</a>
</div>
<div class="navlink">
<a href="PowerVRTools.html">PowerVR Tools</a>
</div>
<div class="navlink">
<a href="ReleaseNotes.html">Release Notes</a>
</div>
<div class="navlink">
<a href="Contact.html">Contact Us</a>
</div>
</nav>
</div>
<!--API_TAB-->
<div class="content">
<div id="Section" class="section">
<!--API_DESCRIPTION-->
<h1>OpenGL 4.x Examples</h1>
<p>
OpenGL is a cross-platform API for 2D and 3D graphics on desktop devices.
</p>
</OGL>
<p><a href="#Beginner" class="link">Beginner</a> | <a href="#Intermediate" class="link">Intermediate</a> | <a href="#Advanced" class="link">Advanced</a></p>
<!--EXAMPLE_TEMPLATE-->
<div id="Beginner""><h2>Beginner</h2><ul class="accordion">
<li id="HelloAPI">
<div class="title">
<a href="../../Examples/Beginner/01_HelloAPI/HelloAPI.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Beginner/01_HelloAPI/HelloAPI.png" alt="HelloAPI" /></a>
<input type="checkbox" id="HelloAPIFull2">
<label for="HelloAPIFull2" title="Click for more information"><h3>HelloAPI</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>Draw a triangle to the screen using hardware acceleration.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>A basic tutorial that guides the user, step-by-step, through the process of initializing a window using :API:, drawing a triangle in it using hardware acceleration, and then terminating the window.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Beginner/01_HelloAPI/OGL/OGLHelloAPI_Windows.cpp" target="_blank">OGLHelloAPI_Windows.cpp</a> | <a href="../../Examples/Beginner/01_HelloAPI/OGL/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="IntroducingPVRShell">
<div class="title">
<a href="../../Examples/Beginner/02_IntroducingPVRShell/IntroducingPVRShell.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Beginner/02_IntroducingPVRShell/IntroducingPVRShell.png" alt="IntroducingPVRShell" /></a>
<input type="checkbox" id="IntroducingPVRShellFull2">
<label for="IntroducingPVRShellFull2" title="Click for more information"><h3>IntroducingPVRShell</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course introduces the PVRShell library.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This demo deals with the PVRShell library. The PowerVR shell handles all OS specific initialisation code, and has several built in command line features which allow for the specifying of attributes. The library is constructed around a 'PVRShell' base class, and object of which is constructed and returned from a 'NewDemo' function.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Beginner/02_IntroducingPVRShell/OGL/OGLIntroducingPVRShell.cpp" target="_blank">OGLIntroducingPVRShell.cpp</a> | <a href="../../Examples/Beginner/02_IntroducingPVRShell/OGL/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="Texturing">
<div class="title">
<a href="../../Examples/Beginner/03_Texturing/Texturing.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Beginner/03_Texturing/Texturing.png" alt="Texturing" /></a>
<input type="checkbox" id="TexturingFull2">
<label for="TexturingFull2" title="Click for more information"><h3>Texturing</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates how to apply a texture to a polygon in :API:.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course demonstrates how to apply a texture to a polygon in :API:. The texture is generated procedurally during initialisation and then loaded into :API:. The triangle is then drawn with UV values so that the texture can be applied to it.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Beginner/03_Texturing/OGL/OGLTexturing.cpp" target="_blank">OGLTexturing.cpp</a> | <a href="../../Examples/Beginner/03_Texturing/OGL/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="BasicTnL">
<div class="title">
<a href="../../Examples/Beginner/04_BasicTnL/BasicTnL.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Beginner/04_BasicTnL/BasicTnL.png" alt="BasicTnL" /></a>
<input type="checkbox" id="BasicTnLFull2">
<label for="BasicTnLFull2" title="Click for more information"><h3>BasicTnL</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course consists of a demonstration of basic transformation and lighting.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course consists of a demonstration of basic transformation and lighting, growing on the basic drawing techniques learnt in HelloTriangle.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Beginner/04_BasicTnL/OGL/OGLBasicTnL.cpp" target="_blank">OGLBasicTnL.cpp</a> | <a href="../../Examples/Beginner/04_BasicTnL/OGL/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="IntroducingPVRTools">
<div class="title">
<a href="../../Examples/Beginner/05_IntroducingPVRTools/IntroducingPVRTools.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Beginner/05_IntroducingPVRTools/IntroducingPVRTools.png" alt="IntroducingPVRTools" /></a>
<input type="checkbox" id="IntroducingPVRToolsFull2">
<label for="IntroducingPVRToolsFull2" title="Click for more information"><h3>IntroducingPVRTools</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course introduces the PVRTools libraries.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course introduces the PVRTools libraries. These libraries provide various modules to help developers perform many of the common tasks associated with hardware accelerated graphics rendering.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Beginner/05_IntroducingPVRTools/OGL/OGLIntroducingPVRTools.cpp" target="_blank">OGLIntroducingPVRTools.cpp</a> | <a href="../../Examples/Beginner/05_IntroducingPVRTools/OGL/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="IntroducingPrint3D">
<div class="title">
<a href="../../Examples/Beginner/06_IntroducingPrint3D/IntroducingPrint3D.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Beginner/06_IntroducingPrint3D/IntroducingPrint3D.png" alt="IntroducingPrint3D" /></a>
<input type="checkbox" id="IntroducingPrint3DFull2">
<label for="IntroducingPrint3DFull2" title="Click for more information"><h3>IntroducingPrint3D</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course introduces the Print3D class featured within the PVRTools library.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course introduces the Print3D class from the PVRTools library. Print3D can be used to display text in both 2D and 3D modes. The default projection mode is 2D but supplying a modelview and projection matrices allow the user to render the text in 3D. Text in different colours is also possible.
</p></p>
<p><strong>Controls:</strong></p>
<p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Beginner/06_IntroducingPrint3D/OGL/OGLIntroducingPrint3D.cpp" target="_blank">OGLIntroducingPrint3D.cpp</a> | <a href="../../Examples/Beginner/06_IntroducingPrint3D/OGL/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="IntroducingPOD">
<div class="title">
<a href="../../Examples/Beginner/07_IntroducingPOD/IntroducingPOD.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Beginner/07_IntroducingPOD/IntroducingPOD.png" alt="IntroducingPOD" /></a>
<input type="checkbox" id="IntroducingPODFull2">
<label for="IntroducingPODFull2" title="Click for more information"><h3>IntroducingPOD</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course introduces the PowerVR Object Data (.pod) format.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course introduces the PowerVR Object Data (.pod) format. It goes into detail on how to open .pod files, load any .pfx and .pvr files that have been referenced, and set up the cameras and lights from the .pod file.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Beginner/07_IntroducingPOD/OGL/OGLIntroducingPOD.cpp" target="_blank">OGLIntroducingPOD.cpp</a> | <a href="../../Examples/Beginner/07_IntroducingPOD/OGL/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="IntroducingPFX">
<div class="title">
<a href="../../Examples/Beginner/08_IntroducingPFX/IntroducingPFX.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Beginner/08_IntroducingPFX/IntroducingPFX.png" alt="IntroducingPFX" /></a>
<input type="checkbox" id="IntroducingPFXFull2">
<label for="IntroducingPFXFull2" title="Click for more information"><h3>IntroducingPFX</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates how to use the PVRTools library to load and use .pfx files.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course demonstrates how to use the PVRTools library to load and use .pfx files. PFX is both a file format and an API, and stands for PowerVR Effects.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Beginner/08_IntroducingPFX/OGL/OGLIntroducingPFX.cpp" target="_blank">OGLIntroducingPFX.cpp</a> | <a href="../../Examples/Beginner/08_IntroducingPFX/OGL/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li></div></ul><div id="Intermediate""><h2>Intermediate</h2><ul class="accordion">
<li id="AlphaBlend">
<div class="title">
<a href="../../Examples/Intermediate/AlphaBlend/AlphaBlend.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/AlphaBlend/AlphaBlend.png" alt="AlphaBlend" /></a>
<input type="checkbox" id="AlphaBlendFull2">
<label for="AlphaBlendFull2" title="Click for more information"><h3>AlphaBlend</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course illustrates how transparency effects can be achieved with blending and the use of some common blending modes.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>Blending is a fragment operation that combines the colour value of fragments as they are drawn with values that are already present in the colour buffer. This allows transparent objects to be simulated. This training course shows how to draw blended geometry using four different types of blending modes set with glBlendFunc().
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/AlphaBlend/OGL/OGLAlphaBlend.cpp" target="_blank">OGLAlphaBlend.cpp</a> | <a href="../../Examples/Intermediate/AlphaBlend/OGL/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="AlphaTest">
<div class="title">
<a href="../../Examples/Intermediate/AlphaTest/AlphaTest.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/AlphaTest/AlphaTest.png" alt="AlphaTest" /></a>
<input type="checkbox" id="AlphaTestFull2">
<label for="AlphaTestFull2" title="Click for more information"><h3>AlphaTest</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course illustrates how to perform alpha testing and provides a visual comparison between alpha blending and alpha testing.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>Alpha testing is a technique through which a test is conducted on a per-fragment basis to determine whether that fragment should be discarded and not contribute to the final scene. This can allow complex shapes to be drawn using very simple geometries, but often at the price of hardware optimisations in the graphics pipeline. In programmable graphics pipelines supporting GLSL this is done through the use of the 'discard' keyword in the fragment shader while in the fixed function pipeline API OpenGL ES 1.x this is performed by calling either glEnable(GL_BLEND) or glEnable(GL_ALPHA_TEST).
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/AlphaTest/OGL/OGLAlphaTest.cpp" target="_blank">OGLAlphaTest.cpp</a> | <a href="../../Examples/Intermediate/AlphaTest/OGL/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="AnisotropicLighting">
<div class="title">
<a href="../../Examples/Intermediate/AnisotropicLighting/AnisotropicLighting.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/AnisotropicLighting/AnisotropicLighting.png" alt="AnisotropicLighting" /></a>
<input type="checkbox" id="AnisotropicLightingFull2">
<label for="AnisotropicLightingFull2" title="Click for more information"><h3>AnisotropicLighting</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>In this training course two techniques are shown for generating an anisotropic lighting effect, one technique using per vertex/pixel calculations, and the other using a texture lookup.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>In this training course two techniques are shown for generating an anisotropic lighting effect (the effect of surface grain on materials such as brushed metal, velvet etc.). The first technique uses per vertex and pixel calculations to calculate the shading and thus generate the effect on the fly. The second technique uses a texture lookup to determine the shading and would be useful in situations where bandwidth was more readily available than processing time.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Left/Right Arrow : Toggle effect</p><p> Esc : Close application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/AnisotropicLighting/OGL/OGLAnisotropicLighting.cpp" target="_blank">OGLAnisotropicLighting.cpp</a> | <a href="../../Examples/Intermediate/AnisotropicLighting/OGL/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="Bloom">
<div class="title">
<a href="../../Examples/Intermediate/Bloom/Bloom.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/Bloom/Bloom.png" alt="Bloom" /></a>
<input type="checkbox" id="BloomFull2">
<label for="BloomFull2" title="Click for more information"><h3>Bloom</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates a simple implementation of a 'bloom' effect.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course demonstrates a simple implementation of a 'bloom' post processing effect. The bright parts of the picture are extracted in a post processing step, blurred and added over the final image to create a glow around the object's borders.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Up/Down : Toggle the bloom effect On/Off</p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/Bloom/OGL/OGLBloom.cpp" target="_blank">OGLBloom.cpp</a> | <a href="../../Examples/Intermediate/Bloom/OGL/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="Bumpmap">
<div class="title">
<a href="../../Examples/Intermediate/Bumpmap/Bumpmap.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/Bumpmap/Bumpmap.png" alt="Bumpmap" /></a>
<input type="checkbox" id="BumpmapFull2">
<label for="BumpmapFull2" title="Click for more information"><h3>Bumpmap</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates an example of using a normal map to implement bump mapping.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>Bump mapping is a technique for simulating bumps and wrinkles on the surface of an object. This is achieved by perturbing the surface normals of the object and using the perturbed normal during the illumination calculations. The result is an apparently bumpy surface rather than a perfectly smooth surface although the surface of the underlying object is not actually changed. This technique is used extensively in graphics applications to add perceived detail to models without adding further geometry.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/Bumpmap/OGL/OGLBumpmap.cpp" target="_blank">OGLBumpmap.cpp</a> | <a href="../../Examples/Intermediate/Bumpmap/OGL/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="CellShading">
<div class="title">
<a href="../../Examples/Intermediate/CellShading/CellShading.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/CellShading/CellShading.png" alt="CellShading" /></a>
<input type="checkbox" id="CellShadingFull2">
<label for="CellShadingFull2" title="Click for more information"><h3>CellShading</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates how to implement cell shading.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course demonstrates how to implement cell shading. Cell-shaded animation (also known as Cell shading or Toon shading) is a type of non-photorealistic rendering designed to make computer graphics appear to be hand-drawn. Cell-shading is often used to mimic the style of a comic book or cartoon and is predominantly used in video games.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/CellShading/OGL/OGLCellShading.cpp" target="_blank">OGLCellShading.cpp</a> | <a href="../../Examples/Intermediate/CellShading/OGL/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="ComplexLighting">
<div class="title">
<a href="../../Examples/Intermediate/ComplexLighting/ComplexLighting.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/ComplexLighting/ComplexLighting.png" alt="ComplexLighting" /></a>
<input type="checkbox" id="ComplexLightingFull2">
<label for="ComplexLightingFull2" title="Click for more information"><h3>ComplexLighting</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates how to implement complex lighting techniques.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course demonstrates how to implement various forms of more complex lighting techniques than the basic lighting training courses. Specifically, it shows how to implement directional, point and spot lighting with a diffuse and a specular component using branching in the vertex shader.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Left/Right : Cycle through the available modes</p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/ComplexLighting/OGL/OGLComplexLighting.cpp" target="_blank">OGLComplexLighting.cpp</a> | <a href="../../Examples/Intermediate/ComplexLighting/OGL/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="CubeShadowMapping">
<div class="title">
<a href="../../Examples/Intermediate/CubeShadowMapping/CubeShadowMapping.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/CubeShadowMapping/CubeShadowMapping.png" alt="CubeShadowMapping" /></a>
<input type="checkbox" id="CubeShadowMappingFull2">
<label for="CubeShadowMappingFull2" title="Click for more information"><h3>CubeShadowMapping</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>Shows how to use cube shadow maps for point light sources.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>Shows how to dynamically update the cube shadow map for a point light source and cast shadows using that cube shadow map. Shadow Mapping is a process by which shadows are added to 3D computer graphics by testing whether a pixel is visible from the light source, and comparing it to a z-buffer or depth image of the light source's view.</p></p>
<p><strong>Controls:</strong></p>
<p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/CubeShadowMapping/OGL/OGLCubeShadowMapping.cpp" target="_blank">OGLCubeShadowMapping.cpp</a> | <a href="../../Examples/Intermediate/CubeShadowMapping/OGL/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="DisplacementMap">
<div class="title">
<a href="../../Examples/Intermediate/DisplacementMap/DisplacementMap.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/DisplacementMap/DisplacementMap.png" alt="DisplacementMap" /></a>
<input type="checkbox" id="DisplacementMapFull2">
<label for="DisplacementMapFull2" title="Click for more information"><h3>DisplacementMap</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates displacement mapping using a texture read from the vertex shader.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>Displacement mapping is an alternative to bump mapping, normal mapping, and parallax mapping, that causes the actual geometric position of points over a textured surface to be displaced, often along the local surface normal, according to the value the texture function evaluates to at each point on the surface.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/DisplacementMap/OGL/OGLDisplacementMap.cpp" target="_blank">OGLDisplacementMap.cpp</a> | <a href="../../Examples/Intermediate/DisplacementMap/OGL/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="FastTnL">
<div class="title">
<a href="../../Examples/Intermediate/FastTnL/FastTnL.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/FastTnL/FastTnL.png" alt="FastTnL" /></a>
<input type="checkbox" id="FastTnLFull2">
<label for="FastTnLFull2" title="Click for more information"><h3>FastTnL</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course serves as an example of a fast transformation and lighting vertex shader.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course shows how to use a fast transformation and lighting vertex shader. This technique is appropriate for situations when a high performance shader is required.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/FastTnL/OGL/OGLFastTnL.cpp" target="_blank">OGLFastTnL.cpp</a> | <a href="../../Examples/Intermediate/FastTnL/OGL/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="Fog">
<div class="title">
<a href="../../Examples/Intermediate/Fog/Fog.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/Fog/Fog.png" alt="Fog" /></a>
<input type="checkbox" id="FogFull2">
<label for="FogFull2" title="Click for more information"><h3>Fog</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates how to create a fog effect using shaders.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course demonstrates how to create a fog effect using shaders. Fog is used to help with the perception of distance in a 3D world - objects that are further way are increasingly coloured with a fog colour.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Left/Right : Cycle fog mode</p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/Fog/OGL/OGLFog.cpp" target="_blank">OGLFog.cpp</a> | <a href="../../Examples/Intermediate/Fog/OGL/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="FresnelReflections">
<div class="title">
<a href="../../Examples/Intermediate/FresnelReflections/FresnelReflections.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/FresnelReflections/FresnelReflections.png" alt="FresnelReflections" /></a>
<input type="checkbox" id="FresnelReflectionsFull2">
<label for="FresnelReflectionsFull2" title="Click for more information"><h3>FresnelReflections</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates an implementation of Fresnel reflection.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course demonstrates an implementation of Fresnel reflection. The Fresnel equations (or Fresnel conditions) describe the behaviour of light when moving between media of differing refractive indices. The reflection of light that the equations predict is known as Fresnel reflection.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Up/Down : Increase/Decrease the refractive index of the surface material</p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/FresnelReflections/OGL/OGLFresnelReflections.cpp" target="_blank">OGLFresnelReflections.cpp</a> | <a href="../../Examples/Intermediate/FresnelReflections/OGL/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="ImageConvolution">
<div class="title">
<a href="../../Examples/Intermediate/ImageConvolution/ImageConvolution.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/ImageConvolution/ImageConvolution.png" alt="ImageConvolution" /></a>
<input type="checkbox" id="ImageConvolutionFull2">
<label for="ImageConvolutionFull2" title="Click for more information"><h3>ImageConvolution</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>Introduction to image processing using OpenCL API.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This demonstration deals with image processing. It illustrates the usage of OpenCL to write linear and non-linear filter kernels.
</p></p>
<p><strong>Controls:</strong></p>
<p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/ImageConvolution/OGL/OGLImageConvolution.cpp" target="_blank">OGLImageConvolution.cpp</a> | <a href="../../Examples/Intermediate/ImageConvolution/OGL/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="Instancing">
<div class="title">
<a href="../../Examples/Intermediate/Instancing/Instancing.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/Instancing/Instancing.png" alt="Instancing" /></a>
<input type="checkbox" id="InstancingFull2">
<label for="InstancingFull2" title="Click for more information"><h3>Instancing</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>Shows how to use instancing to draw several instances of the same mesh with a single draw call.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This example shows how to use instancing to draw several instances of the same mesh with a single draw call.
</p></p>
<p><strong>Controls:</strong></p>
<p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/Instancing/OGL/OGLInstancing.cpp" target="_blank">OGLInstancing.cpp</a> | <a href="../../Examples/Intermediate/Instancing/OGL/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="Iridescence">
<div class="title">
<a href="../../Examples/Intermediate/Iridescence/Iridescence.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/Iridescence/Iridescence.png" alt="Iridescence" /></a>
<input type="checkbox" id="IridescenceFull2">
<label for="IridescenceFull2" title="Click for more information"><h3>Iridescence</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates how to implement an iridescence effect.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course demonstrates how to implement an iridescence effect. Iridescence (also known as goniochromism) is generally known as the property of certain surfaces which appear to change colour as the angle of view or the angle of illumination changes. Iridescence is commonly seen in items such as soap bubbles, butterfly wings, and sea shells. The effect demonstrated in this training course mimics the behaviour of light reflecting off a surface covered by a translucent film of variable thickness.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Up/Down : Increase/Decrease the maximum variation</p><p> Left/Right : Decrease/Increase the maximum thickness</p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/Iridescence/OGL/OGLIridescence.cpp" target="_blank">OGLIridescence.cpp</a> | <a href="../../Examples/Intermediate/Iridescence/OGL/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="LevelOfDetail">
<div class="title">
<a href="../../Examples/Intermediate/LevelOfDetail/LevelOfDetail.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/LevelOfDetail/LevelOfDetail.png" alt="LevelOfDetail" /></a>
<input type="checkbox" id="LevelOfDetailFull2">
<label for="LevelOfDetailFull2" title="Click for more information"><h3>LevelOfDetail</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates a switch in the detail of an object based on its distance from the camera.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course demonstrates a switch in the detail of an object based on its distance from the camera. The vertex and fragment shaders implement two techniques for reflections. Which technique is used depends on the value of bHighDetail (which varies based on distance). If bHighDetail is true the method described in OGLES2PerturbedUVs is used; if bHighDetail is false the method described in OGLES2Reflections is used. Additionally, when the training course is in 'low detail' mode it uses a different mesh, this mesh contains only 7% of the original meshes vertices.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/LevelOfDetail/OGL/OGLLevelOfDetail.cpp" target="_blank">OGLLevelOfDetail.cpp</a> | <a href="../../Examples/Intermediate/LevelOfDetail/OGL/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="LightMap">
<div class="title">
<a href="../../Examples/Intermediate/LightMap/LightMap.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/LightMap/LightMap.png" alt="LightMap" /></a>
<input type="checkbox" id="LightMapFull2">
<label for="LightMapFull2" title="Click for more information"><h3>LightMap</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course shows how to use light maps.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course demonstrates how to use light mapping to project a shadow texture from an arbitrary point, in an arbitrary direction, onto a model which has a base and reflection texture.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/LightMap/OGL/OGLLightMap.cpp" target="_blank">OGLLightMap.cpp</a> | <a href="../../Examples/Intermediate/LightMap/OGL/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="MultipleRenderTargets">
<div class="title">
<a href="../../Examples/Intermediate/MultipleRenderTargets/MultipleRenderTargets.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/MultipleRenderTargets/MultipleRenderTargets.png" alt="MultipleRenderTargets" /></a>
<input type="checkbox" id="MultipleRenderTargetsFull2">
<label for="MultipleRenderTargetsFull2" title="Click for more information"><h3>MultipleRenderTargets</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>Shows how to use multiple render targets to output data to several different surfaces within a single pass.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>Multiple Render Targets is a technique utilised in modern graphics processing that allows the rendering of multiple images to multiple render targets simultaneously. These textures can then be used as texture maps applied to 3D models, or as inputs for other shaders.
</p></p>
<p><strong>Controls:</strong></p>
<p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/MultipleRenderTargets/OGL/OGLMultipleRenderTargets.cpp" target="_blank">OGLMultipleRenderTargets.cpp</a> | <a href="../../Examples/Intermediate/MultipleRenderTargets/OGL/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="OcclusionQueries">
<div class="title">
<a href="../../Examples/Intermediate/OcclusionQueries/OcclusionQueries.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/OcclusionQueries/OcclusionQueries.png" alt="OcclusionQueries" /></a>
<input type="checkbox" id="OcclusionQueriesFull2">
<label for="OcclusionQueriesFull2" title="Click for more information"><h3>OcclusionQueries</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>Shows how to use occlusion queries to determine visible objects.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>Shows how to use occlusion queries to determine visible objects and cull invisible ones to increase run-time performance.
</p></p>
<p><strong>Controls:</strong></p>
<p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/OcclusionQueries/OGL/OGLOcclusionQueries.cpp" target="_blank">OGLOcclusionQueries.cpp</a> | <a href="../../Examples/Intermediate/OcclusionQueries/OGL/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="PerturbedUvs">
<div class="title">
<a href="../../Examples/Intermediate/PerturbedUvs/PerturbedUvs.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/PerturbedUvs/PerturbedUvs.png" alt="PerturbedUvs" /></a>
<input type="checkbox" id="PerturbedUvsFull2">
<label for="PerturbedUvsFull2" title="Click for more information"><h3>PerturbedUvs</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates the use of environment mapping with perturbed UVs.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course demonstrates the use of environment mapping with perturbed UVs. For any given surface on the object a normal map value is read, an angle of reflection between that normal and the eye direction is used to generate a new UV co-ordinate and finally, this UV co-ordinate is used to find the correct colour to reflect from the environment map.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/PerturbedUvs/OGL/OGLPerturbedUvs.cpp" target="_blank">OGLPerturbedUvs.cpp</a> | <a href="../../Examples/Intermediate/PerturbedUvs/OGL/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="Reflections">
<div class="title">
<a href="../../Examples/Intermediate/Reflections/Reflections.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/Reflections/Reflections.png" alt="Reflections" /></a>
<input type="checkbox" id="ReflectionsFull2">
<label for="ReflectionsFull2" title="Click for more information"><h3>Reflections</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates the creation of a reflection effect from a 2D map and a cube map.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course demonstrates the creation of a reflection effect from a 2D map and a cube map. This technique is also known as environment mapping in that the environment around an object is rendered into a texture (in this case as a pre-baked step) and then this environment is sampled per fragment in order to simulate the effect of light from the environment being reflected from the object. Two variations on the technique are shown using either a 2D map or a cube map.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Left/Right : Swap mapping type</p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/Reflections/OGL/OGLReflections.cpp" target="_blank">OGLReflections.cpp</a> | <a href="../../Examples/Intermediate/Reflections/OGL/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="Refraction">
<div class="title">
<a href="../../Examples/Intermediate/Refraction/Refraction.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/Refraction/Refraction.png" alt="Refraction" /></a>
<input type="checkbox" id="RefractionFull2">
<label for="RefractionFull2" title="Click for more information"><h3>Refraction</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates a simulation of glass-like materials.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course combines an object with a background in order to achieve a refraction effect. The background texture is applied to the model but the sample coordinates are affected by the normals of the geometry in order to simulate how light would be bent through a material with differing refractive index to the air around it.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Left/Right : Cycle Specular reflection on or off</p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/Refraction/OGL/OGLRefraction.cpp" target="_blank">OGLRefraction.cpp</a> | <a href="../../Examples/Intermediate/Refraction/OGL/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="RenderToTexture">
<div class="title">
<a href="../../Examples/Intermediate/RenderToTexture/RenderToTexture.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/RenderToTexture/RenderToTexture.png" alt="RenderToTexture" /></a>
<input type="checkbox" id="RenderToTextureFull2">
<label for="RenderToTextureFull2" title="Click for more information"><h3>RenderToTexture</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates the use of rendering to a texture.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course demonstrates rendering a scene to a pBuffer surface or FBO, then binding and applying that render to an object in an additional render pass.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Left : Toggles multisampling of the FBOs</p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/RenderToTexture/OGL/OGLRenderToTexture.cpp" target="_blank">OGLRenderToTexture.cpp</a> | <a href="../../Examples/Intermediate/RenderToTexture/OGL/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="ShadowMapping">
<div class="title">
<a href="../../Examples/Intermediate/ShadowMapping/ShadowMapping.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/ShadowMapping/ShadowMapping.png" alt="ShadowMapping" /></a>
<input type="checkbox" id="ShadowMappingFull2">
<label for="ShadowMappingFull2" title="Click for more information"><h3>ShadowMapping</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates a shadow mapping technique.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course demonstrates a shadow mapping technique. This technique begins by determining whether a given area can be seen from the light. Each fragment that is not visible is marked in one render pass and used to create a texture. In a second render pass this texture is applied to the scene to create the shadow effect.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/ShadowMapping/OGL/OGLShadowMapping.cpp" target="_blank">OGLShadowMapping.cpp</a> | <a href="../../Examples/Intermediate/ShadowMapping/OGL/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="ShadowVolume">
<div class="title">
<a href="../../Examples/Intermediate/ShadowVolume/ShadowVolume.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/ShadowVolume/ShadowVolume.png" alt="ShadowVolume" /></a>
<input type="checkbox" id="ShadowVolumeFull2">
<label for="ShadowVolumeFull2" title="Click for more information"><h3>ShadowVolume</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates how to use the PVRTools libraries to create and use shadow volumes.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course demonstrates how to use the PVRTools library to create and use shadow volumes. The process for using this technique involves updating dynamic shadow volumes before drawing the fully lit scene. After that, the stencil test must be enabled, and the shadow volumes must be drawn to fill the stencil buffer. Then draw a full screen quad that will only appear where the stencil buffer is not zero, and finally disable the stencil test.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> 1 : Toggle display of shadow volumes</p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/ShadowVolume/OGL/OGLShadowVolume.cpp" target="_blank">OGLShadowVolume.cpp</a> | <a href="../../Examples/Intermediate/ShadowVolume/OGL/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="Skinning">
<div class="title">
<a href="../../Examples/Intermediate/Skinning/Skinning.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/Skinning/Skinning.png" alt="Skinning" /></a>
<input type="checkbox" id="SkinningFull2">
<label for="SkinningFull2" title="Click for more information"><h3>Skinning</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates how to implement hardware accelerated skinning using .pod files.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course demonstrates how to implement hardware accelerated skinning using the .pod file loading tools found in the PVRTools library.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Left/Right : Rotate model clockwise/anti-clockwise</p><p> Up/Down : Zoom out/in</p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/Skinning/OGL/OGLSkinning.cpp" target="_blank">OGLSkinning.cpp</a> | <a href="../../Examples/Intermediate/Skinning/OGL/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="StencilBuffer">
<div class="title">
<a href="../../Examples/Intermediate/StencilBuffer/StencilBuffer.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/StencilBuffer/StencilBuffer.png" alt="StencilBuffer" /></a>
<input type="checkbox" id="StencilBufferFull2">
<label for="StencilBufferFull2" title="Click for more information"><h3>StencilBuffer</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates how to use the stencil buffer to mask areas of the screen when rendering.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course demonstrates how to use the stencil buffer to mask areas of the screen when rendering. A sphere and a cylinder are drawn intersecting. The sphere is drawn first, then a stencil test performed using the cylinder. This test is used to determine what colour should be drawn for a given area of the sphere.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/StencilBuffer/OGL/OGLStencilBuffer.cpp" target="_blank">OGLStencilBuffer.cpp</a> | <a href="../../Examples/Intermediate/StencilBuffer/OGL/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="TextureArray">
<div class="title">
<a href="../../Examples/Intermediate/TextureArray/TextureArray.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/TextureArray/TextureArray.png" alt="TextureArray" /></a>
<input type="checkbox" id="TextureArrayFull2">
<label for="TextureArrayFull2" title="Click for more information"><h3>TextureArray</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>Shows how to use the texture array functionality.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This demo shows how to use a texture array in the fragment shader by using three parameters. These are the index of the texture to be sampled, and the sampling coordinates.
</p></p>
<p><strong>Controls:</strong></p>
<p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/TextureArray/OGL/OGLTextureArray.cpp" target="_blank">OGLTextureArray.cpp</a> | <a href="../../Examples/Intermediate/TextureArray/OGL/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="TransformFeedback">
<div class="title">
<a href="../../Examples/Intermediate/TransformFeedback/TransformFeedback.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/TransformFeedback/TransformFeedback.png" alt="TransformFeedback" /></a>
<input type="checkbox" id="TransformFeedbackFull2">
<label for="TransformFeedbackFull2" title="Click for more information"><h3>TransformFeedback</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>Shows how to use transform feedback to implement a simple particle system.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>Shows how to use the transform feedback functionality to implement a simple particle system. The particles are animated within a vertex shader and written out to a buffer object. This buffer object is then used to render the particles and used as input for the next frame's animation.
</p></p>
<p><strong>Controls:</strong></p>
<p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/TransformFeedback/OGL/OGLTransformFeedback.cpp" target="_blank">OGLTransformFeedback.cpp</a> | <a href="../../Examples/Intermediate/TransformFeedback/OGL/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="UniformBufferObjects">
<div class="title">
<a href="../../Examples/Intermediate/UniformBufferObjects/UniformBufferObjects.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/UniformBufferObjects/UniformBufferObjects.png" alt="UniformBufferObjects" /></a>
<input type="checkbox" id="UniformBufferObjectsFull2">
<label for="UniformBufferObjectsFull2" title="Click for more information"><h3>UniformBufferObjects</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>Shows how to use uniform buffer objects.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This demonstration shows how to use uniform buffer objects to set the values of several shader uniforms at once. A uniform buffer object stores uniform data for a shader program, and is often used becuase switching between uniform buffer bindings is faster than swithcing several uniforms in a program. </p></p>
<p><strong>Controls:</strong></p>
<p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/UniformBufferObjects/OGL/OGLUniformBufferObjects.cpp" target="_blank">OGLUniformBufferObjects.cpp</a> | <a href="../../Examples/Intermediate/UniformBufferObjects/OGL/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li></div></ul><div id="Advanced""><h2>Advanced</h2><ul class="accordion">
<li id="DeferredShading">
<div class="title">
<a href="../../Examples/Advanced/DeferredShading/DeferredShading.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Advanced/DeferredShading/DeferredShading.png" alt="DeferredShading" /></a>
<input type="checkbox" id="DeferredShadingFull2">
<label for="DeferredShadingFull2" title="Click for more information"><h3>DeferredShading</h3></label>
<div class="ShortDescription" id="TexturingShort"><p>../../../Examples/Advanced/DeferredShading/DeferredShading.txt</p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p>ERROR</p>
<p><strong>Controls:</strong></p>
<p>ERROR</p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Advanced/DeferredShading/OGL/OGLDeferredShading.cpp" target="_blank">OGLDeferredShading.cpp</a> | <a href="../../Examples/Advanced/DeferredShading/OGL/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="Fractal">
<div class="title">
<a href="../../Examples/Advanced/Fractal/Fractal.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Advanced/Fractal/Fractal.png" alt="Fractal" /></a>
<input type="checkbox" id="FractalFull2">
<label for="FractalFull2" title="Click for more information"><h3>Fractal</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>A demonstration of drawing a fractal using render to texture.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>A recursive fractal effect is demonstrated here using the render to texture technique. This technique is a useful method to create a variety of effects. Basically, a scene is rendered as usual, but in a texture for future reuse.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Advanced/Fractal/OGL/OGLFractal.cpp" target="_blank">OGLFractal.cpp</a> | <a href="../../Examples/Advanced/Fractal/OGL/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="GameOfLife">
<div class="title">
<a href="../../Examples/Advanced/GameOfLife/GameOfLife.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Advanced/GameOfLife/GameOfLife.png" alt="GameOfLife" /></a>
<input type="checkbox" id="GameOfLifeFull2">
<label for="GameOfLifeFull2" title="Click for more information"><h3>GameOfLife</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>Implementation of John Conway's Game of Life using OpenCL.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This demo utilises OpenCL to take advantage of the GPU computation available in PowerVR Series6 to implement John Conway's Game of Life simulation, updating every aspect of the grid where all the particles are stored. OpenGL then retrieves the result of that computation and presents it on the screen.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Left and right arrows : Switch between evolution functions.</p><p> Up : Pause simulation.</p><p> Down : Generate new population.</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Advanced/GameOfLife/OGL/OGLGameOfLife.cpp" target="_blank">OGLGameOfLife.cpp</a> | <a href="../../Examples/Advanced/GameOfLife/OGL/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="PVRScopeExample">
<div class="title">
<a href="../../Examples/Advanced/PVRScopeExample/PVRScopeExample.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Advanced/PVRScopeExample/PVRScopeExample.png" alt="PVRScopeExample" /></a>
<input type="checkbox" id="PVRScopeExampleFull2">
<label for="PVRScopeExampleFull2" title="Click for more information"><h3>PVRScopeExample</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>Demonstrates the use of PVRScope and the example graphing code.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This demo shows the use of PVRScope and the example graphing code that allows an application to return performance statistics from the GPU in real time. For further details, refer to the PVRScope User Manual.
</p></p>
<p><strong>Controls:</strong></p>
<p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Advanced/PVRScopeExample/OGL/OGLPVRScopeExample.cpp" target="_blank">OGLPVRScopeExample.cpp</a> | <a href="../../Examples/Advanced/PVRScopeExample/OGL/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="PVRScopeRemote">
<div class="title">
<a href="../../Examples/Advanced/PVRScopeRemote/PVRScopeRemote.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Advanced/PVRScopeRemote/PVRScopeRemote.png" alt="PVRScopeRemote" /></a>
<input type="checkbox" id="PVRScopeRemoteFull2">
<label for="PVRScopeRemoteFull2" title="Click for more information"><h3>PVRScopeRemote</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>Demonstrates the use of PVRScope's remote communication features.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This example shows how to use the editable data and custom mark functionality of PVRScope. PVRTune must be running and connected to an instance of PVRPerfServer running on the target device for this demo to function.
</p></p>
<p><strong>Controls:</strong></p>
<p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Advanced/PVRScopeRemote/OGL/OGLPVRScopeRemote.cpp" target="_blank">OGLPVRScopeRemote.cpp</a> | <a href="../../Examples/Advanced/PVRScopeRemote/OGL/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="ParticleSystem">
<div class="title">
<a href="../../Examples/Advanced/ParticleSystem/ParticleSystem.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Advanced/ParticleSystem/ParticleSystem.png" alt="ParticleSystem" /></a>
<input type="checkbox" id="ParticleSystemFull2">
<label for="ParticleSystemFull2" title="Click for more information"><h3>ParticleSystem</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>Shows how to implement a simple particle system using OpenCL and the GPU.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>The demo utilises OpenCL to implement a particle system. Particle systems are techniques that use a large amount of sprites to simulate phenomena that would be difficult to reproduce with conventional rendering techniques. Furthermore, it also highlights the interaction between OpenCL and OpenGL (plus OpenGL ES 2).
</p><p>- left and right arrows - Decrease and increase number of particles
</p><p>- up and down arrows - Switch between OpenCL and CPU Particle System implementation.
</p></p>
<p><strong>Controls:</strong></p>
<p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Advanced/ParticleSystem/OGL/OGLParticleSystem.cpp" target="_blank">OGLParticleSystem.cpp</a> | <a href="../../Examples/Advanced/ParticleSystem/OGL/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li></div></ul> </div>
</div>
<div id="FooterMainContainer">
<div id="FooterContainer">
<div class="footerlogo">
<a href="http://www.imgtec.com" target="_blank"><img src="./images/img-footer-logo-grey.png" width="100%" height="100%" /></a>
</div>
<div class="copyright">&copy; Imagination Technologies Limited<br> All rights reserved</div>
</div>
</div>
</body>
</html>
\ No newline at end of file
Documentation/SDKBrowser/OGLES.html 0 → 100644
<!DOCTYPE html>
<html lang="en">
<head>
<title>The PowerVR SDK Browser</title>
<meta charset="UTF-8" />
<link rel="stylesheet" type="text/css" href="style.css">
<link rel="icon" type="image/png" href="./images/img-icon.png">
</head>
<body>
<div id="GlobalHeaderContainer">
<div id="GlobalHeader">
<div class="logo">
<a href="http://www.powervrinsider.com" target="_blank"><img src="./images/PVRlogo.png" width="40%" height="40%" /></a>
</div>
<div class="sitetitle">PowerVR SDK Browser</div>
</div>
</div>
<div id="NavContainer">
<nav>
<div class="navlink">
<a href="Home.html">Home</a>
</div>
<div class="navlink">
<a href="GettingStarted.html">Getting Started</a>
</div>
<div class="navlink">
<a href="Examples.html" class="current">Examples</a>
</div>
<div class="navlink">
<a href="Framework.html">Framework</a>
</div>
<div class="navlink">
<a href="Documentation.html">Documentation</a>
</div>
<div class="navlink">
<a href="PowerVRTools.html">PowerVR Tools</a>
</div>
<div class="navlink">
<a href="ReleaseNotes.html">Release Notes</a>
</div>
<div class="navlink">
<a href="Contact.html">Contact Us</a>
</div>
</nav>
</div>
<!--API_TAB-->
<div id="SubNavContainer"><nav><div class="subnavlink"><a href="./OGLES.html">OpenGL ES 1.x</a></div>
<div class="subnavlink"><a href="./OGLES2.html">OpenGL ES 2.0</a></div>
<div class="subnavlink"><a href="./OGLES3.html">OpenGL ES 3.x</a></div>
</nav></div>
<div class="content">
<div id="Section" class="section">
<!--API_DESCRIPTION-->
<h1>OpenGL ES 1.x Examples</h1>
<p>
OpenGL ES is a cross-platform API for 2D and 3D graphics on embedded systems such as mobile phones, tablets, vehicles and appliances. It is a subset of desktop OpenGL, tuned to expose the most efficient features of embedded GPUs. OpenGL ES 1.x is the first embedded version of the API, and exposes an efficient, fixed-function pipeline for rendering simpler applications. It is often used for 2D games as the 3D pipeline is more limited than the widely available OpenGL ES 2.x, and it is also used as a basis for teaching engineers about graphics on mobile due to its simpler concepts. If you've never coded OpenGL or OpenGL ES before, it might be useful to start here before moving onto programmable APIs. The examples below will walk you through various basic graphics techniques implemented with OpenGL ES 1.x. This API is available on all current PowerVR GPUs.
</p>
</OGLES>
<p><a href="#Beginner" class="link">Beginner</a> | <a href="#Intermediate" class="link">Intermediate</a> | <a href="#Advanced" class="link">Advanced</a></p>
<!--EXAMPLE_TEMPLATE-->
<div id="Beginner""><h2>Beginner</h2><ul class="accordion">
<li id="HelloAPI">
<div class="title">
<a href="../../Examples/Beginner/01_HelloAPI/HelloAPI.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Beginner/01_HelloAPI/HelloAPI.png" alt="HelloAPI" /></a>
<input type="checkbox" id="HelloAPIFull2">
<label for="HelloAPIFull2" title="Click for more information"><h3>HelloAPI</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>Draw a triangle to the screen using hardware acceleration.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>A basic tutorial that guides the user, step-by-step, through the process of initializing a window using :API:, drawing a triangle in it using hardware acceleration, and then terminating the window.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Beginner/01_HelloAPI/OGLES/OGLESHelloAPI_Windows.cpp" target="_blank">OGLESHelloAPI_Windows.cpp</a> | <a href="../../Examples/Beginner/01_HelloAPI/OGLES/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="IntroducingPVRShell">
<div class="title">
<a href="../../Examples/Beginner/02_IntroducingPVRShell/IntroducingPVRShell.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Beginner/02_IntroducingPVRShell/IntroducingPVRShell.png" alt="IntroducingPVRShell" /></a>
<input type="checkbox" id="IntroducingPVRShellFull2">
<label for="IntroducingPVRShellFull2" title="Click for more information"><h3>IntroducingPVRShell</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course introduces the PVRShell library.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This demo deals with the PVRShell library. The PowerVR shell handles all OS specific initialisation code, and has several built in command line features which allow for the specifying of attributes. The library is constructed around a 'PVRShell' base class, and object of which is constructed and returned from a 'NewDemo' function.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Beginner/02_IntroducingPVRShell/OGLES/OGLESIntroducingPVRShell.cpp" target="_blank">OGLESIntroducingPVRShell.cpp</a> | <a href="../../Examples/Beginner/02_IntroducingPVRShell/OGLES/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="Texturing">
<div class="title">
<a href="../../Examples/Beginner/03_Texturing/Texturing.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Beginner/03_Texturing/Texturing.png" alt="Texturing" /></a>
<input type="checkbox" id="TexturingFull2">
<label for="TexturingFull2" title="Click for more information"><h3>Texturing</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates how to apply a texture to a polygon in :API:.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course demonstrates how to apply a texture to a polygon in :API:. The texture is generated procedurally during initialisation and then loaded into :API:. The triangle is then drawn with UV values so that the texture can be applied to it.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Beginner/03_Texturing/OGLES/OGLESTexturing.cpp" target="_blank">OGLESTexturing.cpp</a> | <a href="../../Examples/Beginner/03_Texturing/OGLES/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="BasicTnL">
<div class="title">
<a href="../../Examples/Beginner/04_BasicTnL/BasicTnL.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Beginner/04_BasicTnL/BasicTnL.png" alt="BasicTnL" /></a>
<input type="checkbox" id="BasicTnLFull2">
<label for="BasicTnLFull2" title="Click for more information"><h3>BasicTnL</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course consists of a demonstration of basic transformation and lighting.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course consists of a demonstration of basic transformation and lighting, growing on the basic drawing techniques learnt in HelloTriangle.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Beginner/04_BasicTnL/OGLES/OGLESBasicTnL.cpp" target="_blank">OGLESBasicTnL.cpp</a> | <a href="../../Examples/Beginner/04_BasicTnL/OGLES/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="IntroducingPVRTools">
<div class="title">
<a href="../../Examples/Beginner/05_IntroducingPVRTools/IntroducingPVRTools.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Beginner/05_IntroducingPVRTools/IntroducingPVRTools.png" alt="IntroducingPVRTools" /></a>
<input type="checkbox" id="IntroducingPVRToolsFull2">
<label for="IntroducingPVRToolsFull2" title="Click for more information"><h3>IntroducingPVRTools</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course introduces the PVRTools libraries.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course introduces the PVRTools libraries. These libraries provide various modules to help developers perform many of the common tasks associated with hardware accelerated graphics rendering.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Beginner/05_IntroducingPVRTools/OGLES/OGLESIntroducingPVRTools.cpp" target="_blank">OGLESIntroducingPVRTools.cpp</a> | <a href="../../Examples/Beginner/05_IntroducingPVRTools/OGLES/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="IntroducingPrint3D">
<div class="title">
<a href="../../Examples/Beginner/06_IntroducingPrint3D/IntroducingPrint3D.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Beginner/06_IntroducingPrint3D/IntroducingPrint3D.png" alt="IntroducingPrint3D" /></a>
<input type="checkbox" id="IntroducingPrint3DFull2">
<label for="IntroducingPrint3DFull2" title="Click for more information"><h3>IntroducingPrint3D</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course introduces the Print3D class featured within the PVRTools library.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course introduces the Print3D class from the PVRTools library. Print3D can be used to display text in both 2D and 3D modes. The default projection mode is 2D but supplying a modelview and projection matrices allow the user to render the text in 3D. Text in different colours is also possible.
</p></p>
<p><strong>Controls:</strong></p>
<p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Beginner/06_IntroducingPrint3D/OGLES/OGLESIntroducingPrint3D.cpp" target="_blank">OGLESIntroducingPrint3D.cpp</a> | <a href="../../Examples/Beginner/06_IntroducingPrint3D/OGLES/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="IntroducingPOD">
<div class="title">
<a href="../../Examples/Beginner/07_IntroducingPOD/IntroducingPOD.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Beginner/07_IntroducingPOD/IntroducingPOD.png" alt="IntroducingPOD" /></a>
<input type="checkbox" id="IntroducingPODFull2">
<label for="IntroducingPODFull2" title="Click for more information"><h3>IntroducingPOD</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course introduces the PowerVR Object Data (.pod) format.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course introduces the PowerVR Object Data (.pod) format. It goes into detail on how to open .pod files, load any .pfx and .pvr files that have been referenced, and set up the cameras and lights from the .pod file.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Beginner/07_IntroducingPOD/OGLES/OGLESIntroducingPOD.cpp" target="_blank">OGLESIntroducingPOD.cpp</a> | <a href="../../Examples/Beginner/07_IntroducingPOD/OGLES/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li></div></ul><div id="Intermediate""><h2>Intermediate</h2><ul class="accordion">
<li id="AlphaBlend">
<div class="title">
<a href="../../Examples/Intermediate/AlphaBlend/AlphaBlend.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/AlphaBlend/AlphaBlend.png" alt="AlphaBlend" /></a>
<input type="checkbox" id="AlphaBlendFull2">
<label for="AlphaBlendFull2" title="Click for more information"><h3>AlphaBlend</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course illustrates how transparency effects can be achieved with blending and the use of some common blending modes.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>Blending is a fragment operation that combines the colour value of fragments as they are drawn with values that are already present in the colour buffer. This allows transparent objects to be simulated. This training course shows how to draw blended geometry using four different types of blending modes set with glBlendFunc().
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/AlphaBlend/OGLES/OGLESAlphaBlend.cpp" target="_blank">OGLESAlphaBlend.cpp</a> | <a href="../../Examples/Intermediate/AlphaBlend/OGLES/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="AntialiasedLines">
<div class="title">
<a href="../../Examples/Intermediate/AntialiasedLines/AntialiasedLines.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/AntialiasedLines/AntialiasedLines.png" alt="AntialiasedLines" /></a>
<input type="checkbox" id="AntialiasedLinesFull2">
<label for="AntialiasedLinesFull2" title="Click for more information"><h3>AntialiasedLines</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates how to render anti-aliased lines without enabling full screen anti-aliasing.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>Full screen antialiasing can be too expensive or unavailable on some platforms, but it is possible to render smooth lines without it. This training course shows how to render anti-aliased lines with round caps using texture filtering and blending.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/AntialiasedLines/OGLES/OGLESAntialiasedLines.cpp" target="_blank">OGLESAntialiasedLines.cpp</a> | <a href="../../Examples/Intermediate/AntialiasedLines/OGLES/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="FiveSpheres">
<div class="title">
<a href="../../Examples/Intermediate/FiveSpheres/FiveSpheres.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/FiveSpheres/FiveSpheres.png" alt="FiveSpheres" /></a>
<input type="checkbox" id="FiveSpheresFull2">
<label for="FiveSpheresFull2" title="Click for more information"><h3>FiveSpheres</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>A demonstration of different primitive types.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This demo displays five spheres, each one displaying a different primitive type. These types are GL_POINTS, GL_TRIANGLES, GL_LINE_STRIP, GL_TRIANGLE_FAN, and GL_TRIANGLE_STRIP.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/FiveSpheres/OGLES/OGLESFiveSpheres.cpp" target="_blank">OGLESFiveSpheres.cpp</a> | <a href="../../Examples/Intermediate/FiveSpheres/OGLES/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="Lighting">
<div class="title">
<a href="../../Examples/Intermediate/Lighting/Lighting.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/Lighting/Lighting.png" alt="Lighting" /></a>
<input type="checkbox" id="LightingFull2">
<label for="LightingFull2" title="Click for more information"><h3>Lighting</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>A demonstration of a model being lit with 8 point lights at high performance.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This demo shows a sphere lit by 8 differently coloured spotlights using ambient, diffuse and specular components. Ambient light is a light source of fixed intensity and colour, whilst a diffuse reflection is a reflection of light from a surface at many angles rather than just one. A specular highlight is a visual cue regarding the shape and location of an object in respect to the light source in a scene.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/Lighting/OGLES/OGLESLighting.cpp" target="_blank">OGLESLighting.cpp</a> | <a href="../../Examples/Intermediate/Lighting/OGLES/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="MatrixPalette">
<div class="title">
<a href="../../Examples/Intermediate/MatrixPalette/MatrixPalette.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/MatrixPalette/MatrixPalette.png" alt="MatrixPalette" /></a>
<input type="checkbox" id="MatrixPaletteFull2">
<label for="MatrixPaletteFull2" title="Click for more information"><h3>MatrixPalette</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates how to use matrix palettes to animate a skinned character.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course demonstrates how to use matrix palettes to animate a skinned character loaded from a .pod file. A skinned character is an animated mesh which has had a texture applied to it.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/MatrixPalette/OGLES/OGLESMatrixPalette.cpp" target="_blank">OGLESMatrixPalette.cpp</a> | <a href="../../Examples/Intermediate/MatrixPalette/OGLES/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="Multitexture">
<div class="title">
<a href="../../Examples/Intermediate/Multitexture/Multitexture.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/Multitexture/Multitexture.png" alt="Multitexture" /></a>
<input type="checkbox" id="MultitextureFull2">
<label for="MultitextureFull2" title="Click for more information"><h3>Multitexture</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course is an example of how to combine multiple textures.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course demonstrates how to combine multiple textures in six different ways using glTexEnvf(GL_TEXTURE_ENV, GL_COMBINE_RGB, param). "param" can be any of the following six options: GL_MODULATE, GL_ADD, GL_ADD_SIGNED , GL_REPLACE, GL_SUBTRACT, GL_DOT3_RGB.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/Multitexture/OGLES/OGLESMultitexture.cpp" target="_blank">OGLESMultitexture.cpp</a> | <a href="../../Examples/Intermediate/Multitexture/OGLES/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="OptimizeMesh">
<div class="title">
<a href="../../Examples/Intermediate/OptimizeMesh/OptimizeMesh.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/OptimizeMesh/OptimizeMesh.png" alt="OptimizeMesh" /></a>
<input type="checkbox" id="OptimizeMeshFull2">
<label for="OptimizeMeshFull2" title="Click for more information"><h3>OptimizeMesh</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>A demonstration of the performance gained when using optimized indexed triangle lists.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>Shows a textured model rendered in two different modes: one using a non-optimized triangle list and one using an optimized triangle list. The demo switches modes after a few seconds or after the user presses the action key. Both models were exported with the PVRGeoPOD plug-in from the SDK. The optimized triangle list case was generated using the PVRTTriStrip triangle sorting option from PVRGeoPOD.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/OptimizeMesh/OGLES/OGLESOptimizeMesh.cpp" target="_blank">OGLESOptimizeMesh.cpp</a> | <a href="../../Examples/Intermediate/OptimizeMesh/OGLES/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="RenderToTexture">
<div class="title">
<a href="../../Examples/Intermediate/RenderToTexture/RenderToTexture.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/RenderToTexture/RenderToTexture.png" alt="RenderToTexture" /></a>
<input type="checkbox" id="RenderToTextureFull2">
<label for="RenderToTextureFull2" title="Click for more information"><h3>RenderToTexture</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates the use of rendering to a texture.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course demonstrates rendering a scene to a pBuffer surface or FBO, then binding and applying that render to an object in an additional render pass.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Left : Toggles multisampling of the FBOs</p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/RenderToTexture/OGLES/OGLESRenderToTexture.cpp" target="_blank">OGLESRenderToTexture.cpp</a> | <a href="../../Examples/Intermediate/RenderToTexture/OGLES/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="ShadowTechniques">
<div class="title">
<a href="../../Examples/Intermediate/ShadowTechniques/ShadowTechniques.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/ShadowTechniques/ShadowTechniques.png" alt="ShadowTechniques" /></a>
<input type="checkbox" id="ShadowTechniquesFull2">
<label for="ShadowTechniquesFull2" title="Click for more information"><h3>ShadowTechniques</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>A demonstration of a variety of shadow techniques.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This demo illustrates various shadow techniques, such as the dynamic blob method which draws a transparent blob under the character and the blob moves based on the centre of the object. The projected geometry method draws the object "projected" onto the floor plane, only pure black shadows are possible due to multiple polygons being projected into the same location (would give intensity differences in the shadow if transparency would be used). The final method is a projected texture where the projected shadow texture is updated dynamically each frame (generated by rendering the scene from the point of view of the light source).
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/ShadowTechniques/OGLES/OGLESShadowTechniques.cpp" target="_blank">OGLESShadowTechniques.cpp</a> | <a href="../../Examples/Intermediate/ShadowTechniques/OGLES/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="ShadowVolume">
<div class="title">
<a href="../../Examples/Intermediate/ShadowVolume/ShadowVolume.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/ShadowVolume/ShadowVolume.png" alt="ShadowVolume" /></a>
<input type="checkbox" id="ShadowVolumeFull2">
<label for="ShadowVolumeFull2" title="Click for more information"><h3>ShadowVolume</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates how to use the PVRTools libraries to create and use shadow volumes.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course demonstrates how to use the PVRTools library to create and use shadow volumes. The process for using this technique involves updating dynamic shadow volumes before drawing the fully lit scene. After that, the stencil test must be enabled, and the shadow volumes must be drawn to fill the stencil buffer. Then draw a full screen quad that will only appear where the stencil buffer is not zero, and finally disable the stencil test.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> 1 : Toggle display of shadow volumes</p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/ShadowVolume/OGLES/OGLESShadowVolume.cpp" target="_blank">OGLESShadowVolume.cpp</a> | <a href="../../Examples/Intermediate/ShadowVolume/OGLES/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="Skinning">
<div class="title">
<a href="../../Examples/Intermediate/Skinning/Skinning.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/Skinning/Skinning.png" alt="Skinning" /></a>
<input type="checkbox" id="SkinningFull2">
<label for="SkinningFull2" title="Click for more information"><h3>Skinning</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates how to implement hardware accelerated skinning using .pod files.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course demonstrates how to implement hardware accelerated skinning using the .pod file loading tools found in the PVRTools library.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Left/Right : Rotate model clockwise/anti-clockwise</p><p> Up/Down : Zoom out/in</p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/Skinning/OGLES/OGLESSkinning.cpp" target="_blank">OGLESSkinning.cpp</a> | <a href="../../Examples/Intermediate/Skinning/OGLES/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="StencilBuffer">
<div class="title">
<a href="../../Examples/Intermediate/StencilBuffer/StencilBuffer.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/StencilBuffer/StencilBuffer.png" alt="StencilBuffer" /></a>
<input type="checkbox" id="StencilBufferFull2">
<label for="StencilBufferFull2" title="Click for more information"><h3>StencilBuffer</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates how to use the stencil buffer to mask areas of the screen when rendering.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course demonstrates how to use the stencil buffer to mask areas of the screen when rendering. A sphere and a cylinder are drawn intersecting. The sphere is drawn first, then a stencil test performed using the cylinder. This test is used to determine what colour should be drawn for a given area of the sphere.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/StencilBuffer/OGLES/OGLESStencilBuffer.cpp" target="_blank">OGLESStencilBuffer.cpp</a> | <a href="../../Examples/Intermediate/StencilBuffer/OGLES/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="Trilinear">
<div class="title">
<a href="../../Examples/Intermediate/Trilinear/Trilinear.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/Trilinear/Trilinear.png" alt="Trilinear" /></a>
<input type="checkbox" id="TrilinearFull2">
<label for="TrilinearFull2" title="Click for more information"><h3>Trilinear</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This demo illustrates the visual difference between different texture filter modes.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This demo illustrates the visual difference between the following different texture filter modes: GL_LINEAR (Bilinear with no MIPMapping), GL_LINEAR_MIPMAP_NEAREST (Bilinear with MIPMapping), GL_LINEAR_MIPMAP_LINEAR (Trilinear).
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/Trilinear/OGLES/OGLESTrilinear.cpp" target="_blank">OGLESTrilinear.cpp</a> | <a href="../../Examples/Intermediate/Trilinear/OGLES/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="UserClipPlanes">
<div class="title">
<a href="../../Examples/Intermediate/UserClipPlanes/UserClipPlanes.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/UserClipPlanes/UserClipPlanes.png" alt="UserClipPlanes" /></a>
<input type="checkbox" id="UserClipPlanesFull2">
<label for="UserClipPlanesFull2" title="Click for more information"><h3>UserClipPlanes</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This demo illustrates how to use user clip planes.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This demo illustrates how to use user clip planes. In this case a rotating sphere is shown cut by six user clip planes.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p><p>This demo requires 3D hardware which supports user clip planes.
</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/UserClipPlanes/OGLES/OGLESUserClipPlanes.cpp" target="_blank">OGLESUserClipPlanes.cpp</a> | <a href="../../Examples/Intermediate/UserClipPlanes/OGLES/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li></div></ul><div id="Advanced""><h2>Advanced</h2><ul class="accordion">
<li id="Coverflow">
<div class="title">
<a href="../../Examples/Advanced/Coverflow/Coverflow.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Advanced/Coverflow/Coverflow.png" alt="Coverflow" /></a>
<input type="checkbox" id="CoverflowFull2">
<label for="CoverflowFull2" title="Click for more information"><h3>Coverflow</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>A demonstration of a coverflow style effect.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This demo serves as an example of a coverflow style effect, which is a three dimensional GUI used to display information as a stack of snapshots.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Left/Right : Flow covers left/right</p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Advanced/Coverflow/OGLES/OGLESCoverflow.cpp" target="_blank">OGLESCoverflow.cpp</a> | <a href="../../Examples/Advanced/Coverflow/OGLES/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="EvilSkull">
<div class="title">
<a href="../../Examples/Advanced/EvilSkull/EvilSkull.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Advanced/EvilSkull/EvilSkull.png" alt="EvilSkull" /></a>
<input type="checkbox" id="EvilSkullFull2">
<label for="EvilSkullFull2" title="Click for more information"><h3>EvilSkull</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>A demonstration of morphing in combination with multi-texturing.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>Morphing creates the final object using weighted blending between a number of different configurations of the same object. Each configuration controls a certain aspect of the object. In the case of EvilSkull the different configurations represent the position of the eyebrows and cheekbones. By setting different weights it is possible to generate a huge variety of facial expressions. Meanwhile the background shows multi-texturing with two independently animated layers.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Advanced/EvilSkull/OGLES/OGLESEvilSkull.cpp" target="_blank">OGLESEvilSkull.cpp</a> | <a href="../../Examples/Advanced/EvilSkull/OGLES/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="FilmTV">
<div class="title">
<a href="../../Examples/Advanced/FilmTV/FilmTV.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Advanced/FilmTV/FilmTV.png" alt="FilmTV" /></a>
<input type="checkbox" id="FilmTVFull2">
<label for="FilmTVFull2" title="Click for more information"><h3>FilmTV</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>A demonstration of a render to texture effect.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>A demonstration of a render to texture effect is shown in this demo. FBOs are used as render targets each frame, with the previous frames FBOs used as the source of the view from the camera.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Advanced/FilmTV/OGLES/OGLESFilmTV.cpp" target="_blank">OGLESFilmTV.cpp</a> | <a href="../../Examples/Advanced/FilmTV/OGLES/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="Fractal">
<div class="title">
<a href="../../Examples/Advanced/Fractal/Fractal.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Advanced/Fractal/Fractal.png" alt="Fractal" /></a>
<input type="checkbox" id="FractalFull2">
<label for="FractalFull2" title="Click for more information"><h3>Fractal</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>A demonstration of drawing a fractal using render to texture.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>A recursive fractal effect is demonstrated here using the render to texture technique. This technique is a useful method to create a variety of effects. Basically, a scene is rendered as usual, but in a texture for future reuse.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Advanced/Fractal/OGLES/OGLESFractal.cpp" target="_blank">OGLESFractal.cpp</a> | <a href="../../Examples/Advanced/Fractal/OGLES/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="Fur">
<div class="title">
<a href="../../Examples/Advanced/Fur/Fur.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Advanced/Fur/Fur.png" alt="Fur" /></a>
<input type="checkbox" id="FurFull2">
<label for="FurFull2" title="Click for more information"><h3>Fur</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>A demonstration of a fur effect on a simple duck model.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>Demonstrates a method for rendering fur. Multiple translucent "shells" of the original model are rendered, each slightly larger than the previous. The texture applied to these layers contains a "dot" in the alpha channel to show where a hair passes through the "shell".
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Left/Right : Cycle Left/Right through explanation pages</p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Advanced/Fur/OGLES/OGLESFur.cpp" target="_blank">OGLESFur.cpp</a> | <a href="../../Examples/Advanced/Fur/OGLES/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="Mouse">
<div class="title">
<a href="../../Examples/Advanced/Mouse/Mouse.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Advanced/Mouse/Mouse.png" alt="Mouse" /></a>
<input type="checkbox" id="MouseFull2">
<label for="MouseFull2" title="Click for more information"><h3>Mouse</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>A demonstration of a cell-shading (a.k.a. Toon shading) effect applied on an animated model.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>Cell-Shading is the "art" of rendering your objects to look like cartoons. This demo shows a dancing mouse with a hard black outline and banded shading to achieve the desired cartoon-look. Both effects are set up using optimised software routines.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Advanced/Mouse/OGLES/OGLESMouse.cpp" target="_blank">OGLESMouse.cpp</a> | <a href="../../Examples/Advanced/Mouse/OGLES/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="Navigation">
<div class="title">
<a href="../../Examples/Advanced/Navigation/Navigation.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Advanced/Navigation/Navigation.png" alt="Navigation" /></a>
<input type="checkbox" id="NavigationFull2">
<label for="NavigationFull2" title="Click for more information"><h3>Navigation</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>A demonstration of how to implement rendering algorithms for Navigation software.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This demo serves as an example of how to implement rendering algorithms for Navigation software. Several techniques such as anti-aliased lines and billboards are employed. The demo also provides an example of how to use culling and batching to optimize rendering.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Up : Toggle pause/un-pause</p><p> Esc : Close the application.</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Advanced/Navigation/OGLES/OGLESNavigation.cpp" target="_blank">OGLESNavigation.cpp</a> | <a href="../../Examples/Advanced/Navigation/OGLES/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="Navigation3D">
<div class="title">
<a href="../../Examples/Advanced/Navigation3D/Navigation3D.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Advanced/Navigation3D/Navigation3D.png" alt="Navigation3D" /></a>
<input type="checkbox" id="Navigation3DFull2">
<label for="Navigation3DFull2" title="Click for more information"><h3>Navigation3D</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>A demonstration of how to implement rendering algorithms for 3D Navigation software.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This demo serves as an example of how to implement rendering algorithms for 3D Navigation software. Several techniques such as frustrum culling, visibility based culling and dynamic stencil-shadow volumes are employed. The demo also provides an example of how to use culling and batching to optimize rendering.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Advanced/Navigation3D/OGLES/OGLESNavigation3D.cpp" target="_blank">OGLESNavigation3D.cpp</a> | <a href="../../Examples/Advanced/Navigation3D/OGLES/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="PVRScopeExample">
<div class="title">
<a href="../../Examples/Advanced/PVRScopeExample/PVRScopeExample.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Advanced/PVRScopeExample/PVRScopeExample.png" alt="PVRScopeExample" /></a>
<input type="checkbox" id="PVRScopeExampleFull2">
<label for="PVRScopeExampleFull2" title="Click for more information"><h3>PVRScopeExample</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>Demonstrates the use of PVRScope and the example graphing code.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This demo shows the use of PVRScope and the example graphing code that allows an application to return performance statistics from the GPU in real time. For further details, refer to the PVRScope User Manual.
</p></p>
<p><strong>Controls:</strong></p>
<p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Advanced/PVRScopeExample/OGLES/OGLESPVRScopeExample.cpp" target="_blank">OGLESPVRScopeExample.cpp</a> | <a href="../../Examples/Advanced/PVRScopeExample/OGLES/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="PVRScopeRemote">
<div class="title">
<a href="../../Examples/Advanced/PVRScopeRemote/PVRScopeRemote.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Advanced/PVRScopeRemote/PVRScopeRemote.png" alt="PVRScopeRemote" /></a>
<input type="checkbox" id="PVRScopeRemoteFull2">
<label for="PVRScopeRemoteFull2" title="Click for more information"><h3>PVRScopeRemote</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>Demonstrates the use of PVRScope's remote communication features.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This example shows how to use the editable data and custom mark functionality of PVRScope. PVRTune must be running and connected to an instance of PVRPerfServer running on the target device for this demo to function.
</p></p>
<p><strong>Controls:</strong></p>
<p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Advanced/PVRScopeRemote/OGLES/OGLESPVRScopeRemote.cpp" target="_blank">OGLESPVRScopeRemote.cpp</a> | <a href="../../Examples/Advanced/PVRScopeRemote/OGLES/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="Particles">
<div class="title">
<a href="../../Examples/Advanced/Particles/Particles.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Advanced/Particles/Particles.png" alt="Particles" /></a>
<input type="checkbox" id="ParticlesFull2">
<label for="ParticlesFull2" title="Click for more information"><h3>Particles</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>A demonstration of particle effects with frame buffer blending.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This demo shows a physics based particle effect displaying a total of 900 particles (600 real + 300 reflected). This effect was generated using alpha blending, which involves combining a translucent foreground color with a background colour, producing a new blended color as a result.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Advanced/Particles/OGLES/OGLESParticles.cpp" target="_blank">OGLESParticles.cpp</a> | <a href="../../Examples/Advanced/Particles/OGLES/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="PolyBump">
<div class="title">
<a href="../../Examples/Advanced/PolyBump/PolyBump.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Advanced/PolyBump/PolyBump.png" alt="PolyBump" /></a>
<input type="checkbox" id="PolyBumpFull2">
<label for="PolyBumpFull2" title="Click for more information"><h3>PolyBump</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This demonstration illustrates the PolyBump technology developed by Crytek (commonly referred to as normal or bump mapping).
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This demo illustrates the Polybump technology developed by Crytek to enhance 3D-rendering quality without increasing the overhead in real-time rendering. It allows users to create and render an extremely low poly model using per pixel DOT3 lighting. The DOT3 NormalMap is automatically generated from a high poly model. As a result when displaying the low polygon model with the DOT3 map generated from the high polygon object there is virtually no visible difference between the two. Rendering time is greatly decreased and bandwidth is compressed. In this demo a model of a detailed human head is show even though there are only 276 polygons in the model.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> 1 : Toggle normal map on/off</p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Advanced/PolyBump/OGLES/OGLESPolyBump.cpp" target="_blank">OGLESPolyBump.cpp</a> | <a href="../../Examples/Advanced/PolyBump/OGLES/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="Skybox">
<div class="title">
<a href="../../Examples/Advanced/Skybox/Skybox.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Advanced/Skybox/Skybox.png" alt="Skybox" /></a>
<input type="checkbox" id="SkyboxFull2">
<label for="SkyboxFull2" title="Click for more information"><h3>Skybox</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>A demonstration of a skybox using PVRTC.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>A demonstration of a skybox using PVRTC. The PVRTCs are compressed using PVRTexTool's skybox compression feature; a special tool used to remove the hard edges of skyboxes.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Advanced/Skybox/OGLES/OGLESSkybox.cpp" target="_blank">OGLESSkybox.cpp</a> | <a href="../../Examples/Advanced/Skybox/OGLES/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="Vase">
<div class="title">
<a href="../../Examples/Advanced/Vase/Vase.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Advanced/Vase/Vase.png" alt="Vase" /></a>
<input type="checkbox" id="VaseFull2">
<label for="VaseFull2" title="Click for more information"><h3>Vase</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This demo shows a transparent vase with dynamic reflections on its metallic sections.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This demo shows a transparent vase with dynamic reflections on its metallic sections. The effect is achieved through a mixture of texturing blending, and a two pass render that draws both the back and front face of the glass object separately with different culling modes.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Advanced/Vase/OGLES/OGLESVase.cpp" target="_blank">OGLESVase.cpp</a> | <a href="../../Examples/Advanced/Vase/OGLES/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li></div></ul> </div>
</div>
<div id="FooterMainContainer">
<div id="FooterContainer">
<div class="footerlogo">
<a href="http://www.imgtec.com" target="_blank"><img src="./images/img-footer-logo-grey.png" width="100%" height="100%" /></a>
</div>
<div class="copyright">&copy; Imagination Technologies Limited<br> All rights reserved</div>
</div>
</div>
</body>
</html>
\ No newline at end of file
Documentation/SDKBrowser/OGLES2.html 0 → 100644
<!DOCTYPE html>
<html lang="en">
<head>
<title>The PowerVR SDK Browser</title>
<meta charset="UTF-8" />
<link rel="stylesheet" type="text/css" href="style.css">
<link rel="icon" type="image/png" href="./images/img-icon.png">
</head>
<body>
<div id="GlobalHeaderContainer">
<div id="GlobalHeader">
<div class="logo">
<a href="http://www.powervrinsider.com" target="_blank"><img src="./images/PVRlogo.png" width="40%" height="40%" /></a>
</div>
<div class="sitetitle">PowerVR SDK Browser</div>
</div>
</div>
<div id="NavContainer">
<nav>
<div class="navlink">
<a href="Home.html">Home</a>
</div>
<div class="navlink">
<a href="GettingStarted.html">Getting Started</a>
</div>
<div class="navlink">
<a href="Examples.html" class="current">Examples</a>
</div>
<div class="navlink">
<a href="Framework.html">Framework</a>
</div>
<div class="navlink">
<a href="Documentation.html">Documentation</a>
</div>
<div class="navlink">
<a href="PowerVRTools.html">PowerVR Tools</a>
</div>
<div class="navlink">
<a href="ReleaseNotes.html">Release Notes</a>
</div>
<div class="navlink">
<a href="Contact.html">Contact Us</a>
</div>
</nav>
</div>
<!--API_TAB-->
<div id="SubNavContainer"><nav><div class="subnavlink"><a href="./OGLES.html">OpenGL ES 1.x</a></div>
<div class="subnavlink"><a href="./OGLES2.html">OpenGL ES 2.0</a></div>
<div class="subnavlink"><a href="./OGLES3.html">OpenGL ES 3.x</a></div>
</nav></div>
<div class="content">
<div id="Section" class="section">
<!--API_DESCRIPTION-->
<h1>OpenGL ES 2.0 Examples</h1>
<p>
OpenGL ES is a cross-platform API for 2D and 3D graphics on embedded systems such as mobile phones, tablets, vehicles and appliances. It is a subset of desktop OpenGL, tuned to expose the most efficient features of embedded GPUs. OpenGL ES 2.0 introduces a programmable pipeline into the API, deprecating a lot of the fixed functionality in OpenGL ES 1.x in favour of programmable shaders. This is the most popular 3D API in existence today, and is widely used in most 3D and many 2D games on mobile and embedded devices. Shaders provide a lot of advanced functionality and flexibility to renderers resulting in substantially more ways to improve graphics fidelity than in OpenGL ES 1.x. The examples below both reproduce techniques in OpenGL ES 1.x using shaders, and also describe a number of other more advanced techniques. This API is available on all current PowerVR GPUs.
</p>
</OGLES2>
<p><a href="#Beginner" class="link">Beginner</a> | <a href="#Intermediate" class="link">Intermediate</a> | <a href="#Advanced" class="link">Advanced</a></p>
<!--EXAMPLE_TEMPLATE-->
<div id="Beginner""><h2>Beginner</h2><ul class="accordion">
<li id="HelloAPI">
<div class="title">
<a href="../../Examples/Beginner/01_HelloAPI/HelloAPI.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Beginner/01_HelloAPI/HelloAPI.png" alt="HelloAPI" /></a>
<input type="checkbox" id="HelloAPIFull2">
<label for="HelloAPIFull2" title="Click for more information"><h3>HelloAPI</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>Draw a triangle to the screen using hardware acceleration.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>A basic tutorial that guides the user, step-by-step, through the process of initializing a window using :API:, drawing a triangle in it using hardware acceleration, and then terminating the window.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Beginner/01_HelloAPI/OGLES2/OGLES2HelloAPI_Windows.cpp" target="_blank">OGLES2HelloAPI_Windows.cpp</a> | <a href="../../Examples/Beginner/01_HelloAPI/OGLES2/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="IntroducingPVRShell">
<div class="title">
<a href="../../Examples/Beginner/02_IntroducingPVRShell/IntroducingPVRShell.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Beginner/02_IntroducingPVRShell/IntroducingPVRShell.png" alt="IntroducingPVRShell" /></a>
<input type="checkbox" id="IntroducingPVRShellFull2">
<label for="IntroducingPVRShellFull2" title="Click for more information"><h3>IntroducingPVRShell</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course introduces the PVRShell library.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This demo deals with the PVRShell library. The PowerVR shell handles all OS specific initialisation code, and has several built in command line features which allow for the specifying of attributes. The library is constructed around a 'PVRShell' base class, and object of which is constructed and returned from a 'NewDemo' function.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Beginner/02_IntroducingPVRShell/OGLES2/OGLES2IntroducingPVRShell.cpp" target="_blank">OGLES2IntroducingPVRShell.cpp</a> | <a href="../../Examples/Beginner/02_IntroducingPVRShell/OGLES2/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="Texturing">
<div class="title">
<a href="../../Examples/Beginner/03_Texturing/Texturing.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Beginner/03_Texturing/Texturing.png" alt="Texturing" /></a>
<input type="checkbox" id="TexturingFull2">
<label for="TexturingFull2" title="Click for more information"><h3>Texturing</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates how to apply a texture to a polygon in :API:.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course demonstrates how to apply a texture to a polygon in :API:. The texture is generated procedurally during initialisation and then loaded into :API:. The triangle is then drawn with UV values so that the texture can be applied to it.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Beginner/03_Texturing/OGLES2/OGLES2Texturing.cpp" target="_blank">OGLES2Texturing.cpp</a> | <a href="../../Examples/Beginner/03_Texturing/OGLES2/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="BasicTnL">
<div class="title">
<a href="../../Examples/Beginner/04_BasicTnL/BasicTnL.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Beginner/04_BasicTnL/BasicTnL.png" alt="BasicTnL" /></a>
<input type="checkbox" id="BasicTnLFull2">
<label for="BasicTnLFull2" title="Click for more information"><h3>BasicTnL</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course consists of a demonstration of basic transformation and lighting.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course consists of a demonstration of basic transformation and lighting, growing on the basic drawing techniques learnt in HelloTriangle.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Beginner/04_BasicTnL/OGLES2/OGLES2BasicTnL.cpp" target="_blank">OGLES2BasicTnL.cpp</a> | <a href="../../Examples/Beginner/04_BasicTnL/OGLES2/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="IntroducingPVRTools">
<div class="title">
<a href="../../Examples/Beginner/05_IntroducingPVRTools/IntroducingPVRTools.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Beginner/05_IntroducingPVRTools/IntroducingPVRTools.png" alt="IntroducingPVRTools" /></a>
<input type="checkbox" id="IntroducingPVRToolsFull2">
<label for="IntroducingPVRToolsFull2" title="Click for more information"><h3>IntroducingPVRTools</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course introduces the PVRTools libraries.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course introduces the PVRTools libraries. These libraries provide various modules to help developers perform many of the common tasks associated with hardware accelerated graphics rendering.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Beginner/05_IntroducingPVRTools/OGLES2/OGLES2IntroducingPVRTools.cpp" target="_blank">OGLES2IntroducingPVRTools.cpp</a> | <a href="../../Examples/Beginner/05_IntroducingPVRTools/OGLES2/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="IntroducingPrint3D">
<div class="title">
<a href="../../Examples/Beginner/06_IntroducingPrint3D/IntroducingPrint3D.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Beginner/06_IntroducingPrint3D/IntroducingPrint3D.png" alt="IntroducingPrint3D" /></a>
<input type="checkbox" id="IntroducingPrint3DFull2">
<label for="IntroducingPrint3DFull2" title="Click for more information"><h3>IntroducingPrint3D</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course introduces the Print3D class featured within the PVRTools library.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course introduces the Print3D class from the PVRTools library. Print3D can be used to display text in both 2D and 3D modes. The default projection mode is 2D but supplying a modelview and projection matrices allow the user to render the text in 3D. Text in different colours is also possible.
</p></p>
<p><strong>Controls:</strong></p>
<p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Beginner/06_IntroducingPrint3D/OGLES2/OGLES2IntroducingPrint3D.cpp" target="_blank">OGLES2IntroducingPrint3D.cpp</a> | <a href="../../Examples/Beginner/06_IntroducingPrint3D/OGLES2/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="IntroducingPOD">
<div class="title">
<a href="../../Examples/Beginner/07_IntroducingPOD/IntroducingPOD.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Beginner/07_IntroducingPOD/IntroducingPOD.png" alt="IntroducingPOD" /></a>
<input type="checkbox" id="IntroducingPODFull2">
<label for="IntroducingPODFull2" title="Click for more information"><h3>IntroducingPOD</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course introduces the PowerVR Object Data (.pod) format.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course introduces the PowerVR Object Data (.pod) format. It goes into detail on how to open .pod files, load any .pfx and .pvr files that have been referenced, and set up the cameras and lights from the .pod file.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Beginner/07_IntroducingPOD/OGLES2/OGLES2IntroducingPOD.cpp" target="_blank">OGLES2IntroducingPOD.cpp</a> | <a href="../../Examples/Beginner/07_IntroducingPOD/OGLES2/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="IntroducingPFX">
<div class="title">
<a href="../../Examples/Beginner/08_IntroducingPFX/IntroducingPFX.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Beginner/08_IntroducingPFX/IntroducingPFX.png" alt="IntroducingPFX" /></a>
<input type="checkbox" id="IntroducingPFXFull2">
<label for="IntroducingPFXFull2" title="Click for more information"><h3>IntroducingPFX</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates how to use the PVRTools library to load and use .pfx files.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course demonstrates how to use the PVRTools library to load and use .pfx files. PFX is both a file format and an API, and stands for PowerVR Effects.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Beginner/08_IntroducingPFX/OGLES2/OGLES2IntroducingPFX.cpp" target="_blank">OGLES2IntroducingPFX.cpp</a> | <a href="../../Examples/Beginner/08_IntroducingPFX/OGLES2/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li></div></ul><div id="Intermediate""><h2>Intermediate</h2><ul class="accordion">
<li id="AlphaBlend">
<div class="title">
<a href="../../Examples/Intermediate/AlphaBlend/AlphaBlend.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/AlphaBlend/AlphaBlend.png" alt="AlphaBlend" /></a>
<input type="checkbox" id="AlphaBlendFull2">
<label for="AlphaBlendFull2" title="Click for more information"><h3>AlphaBlend</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course illustrates how transparency effects can be achieved with blending and the use of some common blending modes.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>Blending is a fragment operation that combines the colour value of fragments as they are drawn with values that are already present in the colour buffer. This allows transparent objects to be simulated. This training course shows how to draw blended geometry using four different types of blending modes set with glBlendFunc().
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/AlphaBlend/OGLES2/OGLES2AlphaBlend.cpp" target="_blank">OGLES2AlphaBlend.cpp</a> | <a href="../../Examples/Intermediate/AlphaBlend/OGLES2/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="AlphaTest">
<div class="title">
<a href="../../Examples/Intermediate/AlphaTest/AlphaTest.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/AlphaTest/AlphaTest.png" alt="AlphaTest" /></a>
<input type="checkbox" id="AlphaTestFull2">
<label for="AlphaTestFull2" title="Click for more information"><h3>AlphaTest</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course illustrates how to perform alpha testing and provides a visual comparison between alpha blending and alpha testing.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>Alpha testing is a technique through which a test is conducted on a per-fragment basis to determine whether that fragment should be discarded and not contribute to the final scene. This can allow complex shapes to be drawn using very simple geometries, but often at the price of hardware optimisations in the graphics pipeline. In programmable graphics pipelines supporting GLSL this is done through the use of the 'discard' keyword in the fragment shader while in the fixed function pipeline API OpenGL ES 1.x this is performed by calling either glEnable(GL_BLEND) or glEnable(GL_ALPHA_TEST).
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/AlphaTest/OGLES2/OGLES2AlphaTest.cpp" target="_blank">OGLES2AlphaTest.cpp</a> | <a href="../../Examples/Intermediate/AlphaTest/OGLES2/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="AnisotropicLighting">
<div class="title">
<a href="../../Examples/Intermediate/AnisotropicLighting/AnisotropicLighting.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/AnisotropicLighting/AnisotropicLighting.png" alt="AnisotropicLighting" /></a>
<input type="checkbox" id="AnisotropicLightingFull2">
<label for="AnisotropicLightingFull2" title="Click for more information"><h3>AnisotropicLighting</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>In this training course two techniques are shown for generating an anisotropic lighting effect, one technique using per vertex/pixel calculations, and the other using a texture lookup.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>In this training course two techniques are shown for generating an anisotropic lighting effect (the effect of surface grain on materials such as brushed metal, velvet etc.). The first technique uses per vertex and pixel calculations to calculate the shading and thus generate the effect on the fly. The second technique uses a texture lookup to determine the shading and would be useful in situations where bandwidth was more readily available than processing time.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Left/Right Arrow : Toggle effect</p><p> Esc : Close application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/AnisotropicLighting/OGLES2/OGLES2AnisotropicLighting.cpp" target="_blank">OGLES2AnisotropicLighting.cpp</a> | <a href="../../Examples/Intermediate/AnisotropicLighting/OGLES2/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="Bloom">
<div class="title">
<a href="../../Examples/Intermediate/Bloom/Bloom.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/Bloom/Bloom.png" alt="Bloom" /></a>
<input type="checkbox" id="BloomFull2">
<label for="BloomFull2" title="Click for more information"><h3>Bloom</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates a simple implementation of a 'bloom' effect.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course demonstrates a simple implementation of a 'bloom' post processing effect. The bright parts of the picture are extracted in a post processing step, blurred and added over the final image to create a glow around the object's borders.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Up/Down : Toggle the bloom effect On/Off</p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/Bloom/OGLES2/OGLES2Bloom.cpp" target="_blank">OGLES2Bloom.cpp</a> | <a href="../../Examples/Intermediate/Bloom/OGLES2/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="Bumpmap">
<div class="title">
<a href="../../Examples/Intermediate/Bumpmap/Bumpmap.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/Bumpmap/Bumpmap.png" alt="Bumpmap" /></a>
<input type="checkbox" id="BumpmapFull2">
<label for="BumpmapFull2" title="Click for more information"><h3>Bumpmap</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates an example of using a normal map to implement bump mapping.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>Bump mapping is a technique for simulating bumps and wrinkles on the surface of an object. This is achieved by perturbing the surface normals of the object and using the perturbed normal during the illumination calculations. The result is an apparently bumpy surface rather than a perfectly smooth surface although the surface of the underlying object is not actually changed. This technique is used extensively in graphics applications to add perceived detail to models without adding further geometry.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/Bumpmap/OGLES2/OGLES2Bumpmap.cpp" target="_blank">OGLES2Bumpmap.cpp</a> | <a href="../../Examples/Intermediate/Bumpmap/OGLES2/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="CellShading">
<div class="title">
<a href="../../Examples/Intermediate/CellShading/CellShading.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/CellShading/CellShading.png" alt="CellShading" /></a>
<input type="checkbox" id="CellShadingFull2">
<label for="CellShadingFull2" title="Click for more information"><h3>CellShading</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates how to implement cell shading.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course demonstrates how to implement cell shading. Cell-shaded animation (also known as Cell shading or Toon shading) is a type of non-photorealistic rendering designed to make computer graphics appear to be hand-drawn. Cell-shading is often used to mimic the style of a comic book or cartoon and is predominantly used in video games.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/CellShading/OGLES2/OGLES2CellShading.cpp" target="_blank">OGLES2CellShading.cpp</a> | <a href="../../Examples/Intermediate/CellShading/OGLES2/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="ComplexLighting">
<div class="title">
<a href="../../Examples/Intermediate/ComplexLighting/ComplexLighting.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/ComplexLighting/ComplexLighting.png" alt="ComplexLighting" /></a>
<input type="checkbox" id="ComplexLightingFull2">
<label for="ComplexLightingFull2" title="Click for more information"><h3>ComplexLighting</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates how to implement complex lighting techniques.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course demonstrates how to implement various forms of more complex lighting techniques than the basic lighting training courses. Specifically, it shows how to implement directional, point and spot lighting with a diffuse and a specular component using branching in the vertex shader.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Left/Right : Cycle through the available modes</p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/ComplexLighting/OGLES2/OGLES2ComplexLighting.cpp" target="_blank">OGLES2ComplexLighting.cpp</a> | <a href="../../Examples/Intermediate/ComplexLighting/OGLES2/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="DisplacementMap">
<div class="title">
<a href="../../Examples/Intermediate/DisplacementMap/DisplacementMap.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/DisplacementMap/DisplacementMap.png" alt="DisplacementMap" /></a>
<input type="checkbox" id="DisplacementMapFull2">
<label for="DisplacementMapFull2" title="Click for more information"><h3>DisplacementMap</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates displacement mapping using a texture read from the vertex shader.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>Displacement mapping is an alternative to bump mapping, normal mapping, and parallax mapping, that causes the actual geometric position of points over a textured surface to be displaced, often along the local surface normal, according to the value the texture function evaluates to at each point on the surface.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/DisplacementMap/OGLES2/OGLES2DisplacementMap.cpp" target="_blank">OGLES2DisplacementMap.cpp</a> | <a href="../../Examples/Intermediate/DisplacementMap/OGLES2/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="EdgeDetection">
<div class="title">
<a href="../../Examples/Intermediate/EdgeDetection/EdgeDetection.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/EdgeDetection/EdgeDetection.png" alt="EdgeDetection" /></a>
<input type="checkbox" id="EdgeDetectionFull2">
<label for="EdgeDetectionFull2" title="Click for more information"><h3>EdgeDetection</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates a means of simple edge detection.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>Four highlighting modes for edge detection are available in this demonstration.'Edge Detection' mode locates the edges of each object and highlights them with a black line. 'Edge Detection: Inverse' mode locates the edge of each object and highlights them with an inverted colour, all other areas are coloured black. 'Edge Detection: Blur' mode locates the edge of each object and sets the colour of the edge to be a mixture of the surrounding fragments to produce a blur effect.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Up/Down : Cycle through highlighting modes</p><p> Left : Decrease the width of edge highlights</p><p> Right : Increase the width of edge highlights</p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/EdgeDetection/OGLES2/OGLES2EdgeDetection.cpp" target="_blank">OGLES2EdgeDetection.cpp</a> | <a href="../../Examples/Intermediate/EdgeDetection/OGLES2/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="FastTnL">
<div class="title">
<a href="../../Examples/Intermediate/FastTnL/FastTnL.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/FastTnL/FastTnL.png" alt="FastTnL" /></a>
<input type="checkbox" id="FastTnLFull2">
<label for="FastTnLFull2" title="Click for more information"><h3>FastTnL</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course serves as an example of a fast transformation and lighting vertex shader.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course shows how to use a fast transformation and lighting vertex shader. This technique is appropriate for situations when a high performance shader is required.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/FastTnL/OGLES2/OGLES2FastTnL.cpp" target="_blank">OGLES2FastTnL.cpp</a> | <a href="../../Examples/Intermediate/FastTnL/OGLES2/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="Fog">
<div class="title">
<a href="../../Examples/Intermediate/Fog/Fog.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/Fog/Fog.png" alt="Fog" /></a>
<input type="checkbox" id="FogFull2">
<label for="FogFull2" title="Click for more information"><h3>Fog</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates how to create a fog effect using shaders.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course demonstrates how to create a fog effect using shaders. Fog is used to help with the perception of distance in a 3D world - objects that are further way are increasingly coloured with a fog colour.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Left/Right : Cycle fog mode</p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/Fog/OGLES2/OGLES2Fog.cpp" target="_blank">OGLES2Fog.cpp</a> | <a href="../../Examples/Intermediate/Fog/OGLES2/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="FresnelReflections">
<div class="title">
<a href="../../Examples/Intermediate/FresnelReflections/FresnelReflections.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/FresnelReflections/FresnelReflections.png" alt="FresnelReflections" /></a>
<input type="checkbox" id="FresnelReflectionsFull2">
<label for="FresnelReflectionsFull2" title="Click for more information"><h3>FresnelReflections</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates an implementation of Fresnel reflection.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course demonstrates an implementation of Fresnel reflection. The Fresnel equations (or Fresnel conditions) describe the behaviour of light when moving between media of differing refractive indices. The reflection of light that the equations predict is known as Fresnel reflection.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Up/Down : Increase/Decrease the refractive index of the surface material</p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/FresnelReflections/OGLES2/OGLES2FresnelReflections.cpp" target="_blank">OGLES2FresnelReflections.cpp</a> | <a href="../../Examples/Intermediate/FresnelReflections/OGLES2/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="Iridescence">
<div class="title">
<a href="../../Examples/Intermediate/Iridescence/Iridescence.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/Iridescence/Iridescence.png" alt="Iridescence" /></a>
<input type="checkbox" id="IridescenceFull2">
<label for="IridescenceFull2" title="Click for more information"><h3>Iridescence</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates how to implement an iridescence effect.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course demonstrates how to implement an iridescence effect. Iridescence (also known as goniochromism) is generally known as the property of certain surfaces which appear to change colour as the angle of view or the angle of illumination changes. Iridescence is commonly seen in items such as soap bubbles, butterfly wings, and sea shells. The effect demonstrated in this training course mimics the behaviour of light reflecting off a surface covered by a translucent film of variable thickness.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Up/Down : Increase/Decrease the maximum variation</p><p> Left/Right : Decrease/Increase the maximum thickness</p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/Iridescence/OGLES2/OGLES2Iridescence.cpp" target="_blank">OGLES2Iridescence.cpp</a> | <a href="../../Examples/Intermediate/Iridescence/OGLES2/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="LevelOfDetail">
<div class="title">
<a href="../../Examples/Intermediate/LevelOfDetail/LevelOfDetail.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/LevelOfDetail/LevelOfDetail.png" alt="LevelOfDetail" /></a>
<input type="checkbox" id="LevelOfDetailFull2">
<label for="LevelOfDetailFull2" title="Click for more information"><h3>LevelOfDetail</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates a switch in the detail of an object based on its distance from the camera.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course demonstrates a switch in the detail of an object based on its distance from the camera. The vertex and fragment shaders implement two techniques for reflections. Which technique is used depends on the value of bHighDetail (which varies based on distance). If bHighDetail is true the method described in OGLES2PerturbedUVs is used; if bHighDetail is false the method described in OGLES2Reflections is used. Additionally, when the training course is in 'low detail' mode it uses a different mesh, this mesh contains only 7% of the original meshes vertices.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/LevelOfDetail/OGLES2/OGLES2LevelOfDetail.cpp" target="_blank">OGLES2LevelOfDetail.cpp</a> | <a href="../../Examples/Intermediate/LevelOfDetail/OGLES2/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="LightMap">
<div class="title">
<a href="../../Examples/Intermediate/LightMap/LightMap.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/LightMap/LightMap.png" alt="LightMap" /></a>
<input type="checkbox" id="LightMapFull2">
<label for="LightMapFull2" title="Click for more information"><h3>LightMap</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course shows how to use light maps.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course demonstrates how to use light mapping to project a shadow texture from an arbitrary point, in an arbitrary direction, onto a model which has a base and reflection texture.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/LightMap/OGLES2/OGLES2LightMap.cpp" target="_blank">OGLES2LightMap.cpp</a> | <a href="../../Examples/Intermediate/LightMap/OGLES2/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="MaximumIntensityProjection">
<div class="title">
<a href="../../Examples/Intermediate/MaximumIntensityProjection/MaximumIntensityProjection.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/MaximumIntensityProjection/MaximumIntensityProjection.png" alt="MaximumIntensityProjection" /></a>
<input type="checkbox" id="MaximumIntensityProjectionFull2">
<label for="MaximumIntensityProjectionFull2" title="Click for more information"><h3>MaximumIntensityProjection</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This examples demonstrates a technique known as Maximum Intensity Projection using the EXT_blend_minmax OpenGL ES 2.0 extension.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>Maximum Intensity Projection is a technique predominantly used in the medical and scientific visualisation industry. Typically it is used to display PET scan slices retaining the maximum intensity for a given projected pixel. This example uses the EXT_blend_minmax extension to demonstrate this technique.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/MaximumIntensityProjection/OGLES2/OGLES2MaximumIntensityProjection.cpp" target="_blank">OGLES2MaximumIntensityProjection.cpp</a> | <a href="../../Examples/Intermediate/MaximumIntensityProjection/OGLES2/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="MultiThreading">
<div class="title">
<a href="../../Examples/Intermediate/MultiThreading/MultiThreading.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/MultiThreading/MultiThreading.png" alt="MultiThreading" /></a>
<input type="checkbox" id="MultiThreadingFull2">
<label for="MultiThreadingFull2" title="Click for more information"><h3>MultiThreading</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course is an example of how to correctly use synchronisation techniques to achieve multi-threaded rendering.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course demonstrates how to load resources on a separate thread to the main rendering thread. While this may seem a trivial exercise, API extension functionality must be utilised in order to achieve correct results.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/MultiThreading/OGLES2/OGLES2MultiThreading_Windows.cpp" target="_blank">OGLES2MultiThreading_Windows.cpp</a> | <a href="../../Examples/Intermediate/MultiThreading/OGLES2/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="MultipleRenderTargets">
<div class="title">
<a href="../../Examples/Intermediate/MultipleRenderTargets/MultipleRenderTargets.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/MultipleRenderTargets/MultipleRenderTargets.png" alt="MultipleRenderTargets" /></a>
<input type="checkbox" id="MultipleRenderTargetsFull2">
<label for="MultipleRenderTargetsFull2" title="Click for more information"><h3>MultipleRenderTargets</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>Shows how to use multiple render targets to output data to several different surfaces within a single pass.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>Multiple Render Targets is a technique utilised in modern graphics processing that allows the rendering of multiple images to multiple render targets simultaneously. These textures can then be used as texture maps applied to 3D models, or as inputs for other shaders.
</p></p>
<p><strong>Controls:</strong></p>
<p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/MultipleRenderTargets/OGLES2/OGLES2MultipleRenderTargets.cpp" target="_blank">OGLES2MultipleRenderTargets.cpp</a> | <a href="../../Examples/Intermediate/MultipleRenderTargets/OGLES2/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="OcclusionQueries">
<div class="title">
<a href="../../Examples/Intermediate/OcclusionQueries/OcclusionQueries.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/OcclusionQueries/OcclusionQueries.png" alt="OcclusionQueries" /></a>
<input type="checkbox" id="OcclusionQueriesFull2">
<label for="OcclusionQueriesFull2" title="Click for more information"><h3>OcclusionQueries</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>Shows how to use occlusion queries to determine visible objects.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>Shows how to use occlusion queries to determine visible objects and cull invisible ones to increase run-time performance.
</p></p>
<p><strong>Controls:</strong></p>
<p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/OcclusionQueries/OGLES2/OGLES2OcclusionQueries.cpp" target="_blank">OGLES2OcclusionQueries.cpp</a> | <a href="../../Examples/Intermediate/OcclusionQueries/OGLES2/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="ParallaxBumpMap">
<div class="title">
<a href="../../Examples/Intermediate/ParallaxBumpMap/ParallaxBumpMap.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/ParallaxBumpMap/ParallaxBumpMap.png" alt="ParallaxBumpMap" /></a>
<input type="checkbox" id="ParallaxBumpMapFull2">
<label for="ParallaxBumpMapFull2" title="Click for more information"><h3>ParallaxBumpMap</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course serves as an example of implementing the parallax bump mapping effect.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>Parallax bump mapping is a technique for simulating bumps and wrinkles on the surface of an object. This is very similar to normal bump mapping but with the addition of a parallax effect based on the view vector. This training course serves as an example of implementing the parallax bump mapping effect.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/ParallaxBumpMap/OGLES2/OGLES2ParallaxBumpMap.cpp" target="_blank">OGLES2ParallaxBumpMap.cpp</a> | <a href="../../Examples/Intermediate/ParallaxBumpMap/OGLES2/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="PerturbedUvs">
<div class="title">
<a href="../../Examples/Intermediate/PerturbedUvs/PerturbedUvs.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/PerturbedUvs/PerturbedUvs.png" alt="PerturbedUvs" /></a>
<input type="checkbox" id="PerturbedUvsFull2">
<label for="PerturbedUvsFull2" title="Click for more information"><h3>PerturbedUvs</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates the use of environment mapping with perturbed UVs.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course demonstrates the use of environment mapping with perturbed UVs. For any given surface on the object a normal map value is read, an angle of reflection between that normal and the eye direction is used to generate a new UV co-ordinate and finally, this UV co-ordinate is used to find the correct colour to reflect from the environment map.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/PerturbedUvs/OGLES2/OGLES2PerturbedUvs.cpp" target="_blank">OGLES2PerturbedUvs.cpp</a> | <a href="../../Examples/Intermediate/PerturbedUvs/OGLES2/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="Reflections">
<div class="title">
<a href="../../Examples/Intermediate/Reflections/Reflections.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/Reflections/Reflections.png" alt="Reflections" /></a>
<input type="checkbox" id="ReflectionsFull2">
<label for="ReflectionsFull2" title="Click for more information"><h3>Reflections</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates the creation of a reflection effect from a 2D map and a cube map.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course demonstrates the creation of a reflection effect from a 2D map and a cube map. This technique is also known as environment mapping in that the environment around an object is rendered into a texture (in this case as a pre-baked step) and then this environment is sampled per fragment in order to simulate the effect of light from the environment being reflected from the object. Two variations on the technique are shown using either a 2D map or a cube map.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Left/Right : Swap mapping type</p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/Reflections/OGLES2/OGLES2Reflections.cpp" target="_blank">OGLES2Reflections.cpp</a> | <a href="../../Examples/Intermediate/Reflections/OGLES2/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="Refraction">
<div class="title">
<a href="../../Examples/Intermediate/Refraction/Refraction.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/Refraction/Refraction.png" alt="Refraction" /></a>
<input type="checkbox" id="RefractionFull2">
<label for="RefractionFull2" title="Click for more information"><h3>Refraction</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates a simulation of glass-like materials.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course combines an object with a background in order to achieve a refraction effect. The background texture is applied to the model but the sample coordinates are affected by the normals of the geometry in order to simulate how light would be bent through a material with differing refractive index to the air around it.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Left/Right : Cycle Specular reflection on or off</p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/Refraction/OGLES2/OGLES2Refraction.cpp" target="_blank">OGLES2Refraction.cpp</a> | <a href="../../Examples/Intermediate/Refraction/OGLES2/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="RenderToTexture">
<div class="title">
<a href="../../Examples/Intermediate/RenderToTexture/RenderToTexture.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/RenderToTexture/RenderToTexture.png" alt="RenderToTexture" /></a>
<input type="checkbox" id="RenderToTextureFull2">
<label for="RenderToTextureFull2" title="Click for more information"><h3>RenderToTexture</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates the use of rendering to a texture.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course demonstrates rendering a scene to a pBuffer surface or FBO, then binding and applying that render to an object in an additional render pass.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Left : Toggles multisampling of the FBOs</p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/RenderToTexture/OGLES2/OGLES2RenderToTexture.cpp" target="_blank">OGLES2RenderToTexture.cpp</a> | <a href="../../Examples/Intermediate/RenderToTexture/OGLES2/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="ShadowMapping">
<div class="title">
<a href="../../Examples/Intermediate/ShadowMapping/ShadowMapping.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/ShadowMapping/ShadowMapping.png" alt="ShadowMapping" /></a>
<input type="checkbox" id="ShadowMappingFull2">
<label for="ShadowMappingFull2" title="Click for more information"><h3>ShadowMapping</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates a shadow mapping technique.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course demonstrates a shadow mapping technique. This technique begins by determining whether a given area can be seen from the light. Each fragment that is not visible is marked in one render pass and used to create a texture. In a second render pass this texture is applied to the scene to create the shadow effect.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/ShadowMapping/OGLES2/OGLES2ShadowMapping.cpp" target="_blank">OGLES2ShadowMapping.cpp</a> | <a href="../../Examples/Intermediate/ShadowMapping/OGLES2/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="ShadowVolume">
<div class="title">
<a href="../../Examples/Intermediate/ShadowVolume/ShadowVolume.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/ShadowVolume/ShadowVolume.png" alt="ShadowVolume" /></a>
<input type="checkbox" id="ShadowVolumeFull2">
<label for="ShadowVolumeFull2" title="Click for more information"><h3>ShadowVolume</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates how to use the PVRTools libraries to create and use shadow volumes.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course demonstrates how to use the PVRTools library to create and use shadow volumes. The process for using this technique involves updating dynamic shadow volumes before drawing the fully lit scene. After that, the stencil test must be enabled, and the shadow volumes must be drawn to fill the stencil buffer. Then draw a full screen quad that will only appear where the stencil buffer is not zero, and finally disable the stencil test.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> 1 : Toggle display of shadow volumes</p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/ShadowVolume/OGLES2/OGLES2ShadowVolume.cpp" target="_blank">OGLES2ShadowVolume.cpp</a> | <a href="../../Examples/Intermediate/ShadowVolume/OGLES2/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="Skinning">
<div class="title">
<a href="../../Examples/Intermediate/Skinning/Skinning.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/Skinning/Skinning.png" alt="Skinning" /></a>
<input type="checkbox" id="SkinningFull2">
<label for="SkinningFull2" title="Click for more information"><h3>Skinning</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates how to implement hardware accelerated skinning using .pod files.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course demonstrates how to implement hardware accelerated skinning using the .pod file loading tools found in the PVRTools library.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Left/Right : Rotate model clockwise/anti-clockwise</p><p> Up/Down : Zoom out/in</p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/Skinning/OGLES2/OGLES2Skinning.cpp" target="_blank">OGLES2Skinning.cpp</a> | <a href="../../Examples/Intermediate/Skinning/OGLES2/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="StencilBuffer">
<div class="title">
<a href="../../Examples/Intermediate/StencilBuffer/StencilBuffer.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/StencilBuffer/StencilBuffer.png" alt="StencilBuffer" /></a>
<input type="checkbox" id="StencilBufferFull2">
<label for="StencilBufferFull2" title="Click for more information"><h3>StencilBuffer</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates how to use the stencil buffer to mask areas of the screen when rendering.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course demonstrates how to use the stencil buffer to mask areas of the screen when rendering. A sphere and a cylinder are drawn intersecting. The sphere is drawn first, then a stencil test performed using the cylinder. This test is used to determine what colour should be drawn for a given area of the sphere.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/StencilBuffer/OGLES2/OGLES2StencilBuffer.cpp" target="_blank">OGLES2StencilBuffer.cpp</a> | <a href="../../Examples/Intermediate/StencilBuffer/OGLES2/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="ToneMapping">
<div class="title">
<a href="../../Examples/Intermediate/ToneMapping/ToneMapping.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/ToneMapping/ToneMapping.png" alt="ToneMapping" /></a>
<input type="checkbox" id="ToneMappingFull2">
<label for="ToneMappingFull2" title="Click for more information"><h3>ToneMapping</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This example demonstrates floating point textures using the OES_texture_float extension and mapping this texture to the colour buffer using several different tone mapping operators.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>Tone mapping is a technique used to map a set of colours to a renderable representation. This is generally used for High Dynamic Range rendering or visualisation - such as in this example. The texture supplied with this example is a full-precision 32bit IEEE floating point image which is then mapped to the colour buffer via a set of tone mapping operators executed at the fragment shader stage. A number of operators are supplied and descriptions are included with the PFX file. The example allows the user to alter the exposure of the image by a number of stops, demonstrating the usefulness of floating point textures.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p><p> Up/Down : Change the tone mapping operator</p><p> Left/Right : Alter the exposure value</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/ToneMapping/OGLES2/OGLES2ToneMapping.cpp" target="_blank">OGLES2ToneMapping.cpp</a> | <a href="../../Examples/Intermediate/ToneMapping/OGLES2/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li></div></ul><div id="Advanced""><h2>Advanced</h2><ul class="accordion">
<li id="BinaryShader">
<div class="title">
<a href="../../Examples/Advanced/BinaryShader/BinaryShader.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Advanced/BinaryShader/BinaryShader.png" alt="BinaryShader" /></a>
<input type="checkbox" id="BinaryShaderFull2">
<label for="BinaryShaderFull2" title="Click for more information"><h3>BinaryShader</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course shows how to save and load binary shaders in a program to avoid recompiling the shaders each time.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course demonstrates how to save and load binary shaders at runtime. The code will compile a binary shader on first run, save it to disk and then on subsequent runs it will load in the binary shaders and use these without unnecessary recompilation. This can save time at startup, especially if many complex shaders are used. The triangle will appear red if the original shader is used, and green if the binary shader is used.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p><p>This training course does not use the OGLES2Tools library and will only function on platforms that support the GL_OES_get_program_binary extension.
</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Advanced/BinaryShader/OGLES2/OGLES2BinaryShader.cpp" target="_blank">OGLES2BinaryShader.cpp</a> | <a href="../../Examples/Advanced/BinaryShader/OGLES2/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="ChameleonMan">
<div class="title">
<a href="../../Examples/Advanced/ChameleonMan/ChameleonMan.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Advanced/ChameleonMan/ChameleonMan.png" alt="ChameleonMan" /></a>
<input type="checkbox" id="ChameleonManFull2">
<label for="ChameleonManFull2" title="Click for more information"><h3>ChameleonMan</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This demo shows a matrix skinned character in combination with bump mapping.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>The ChameleonMan demo shows a Matrix Skinned Character in combination with bump mapping. Matrix Skinning is the act of animating a vertex over time given a set (palette) of matrices and a known set of blend weights assigned to those matrices. For each frame the Matrix Palette is recomputed based on time. Per vertex, up to 3 matrices, from the palette, along with 3 weights are used by the vertex shader to update the vertex position to obtain the current animation frame position. Two lighting modes are available; per vertex lighting, and bump mapped lighting.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> 1 : Toggle lighting modes</p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Advanced/ChameleonMan/OGLES2/OGLES2ChameleonMan.cpp" target="_blank">OGLES2ChameleonMan.cpp</a> | <a href="../../Examples/Advanced/ChameleonMan/OGLES2/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="Coverflow">
<div class="title">
<a href="../../Examples/Advanced/Coverflow/Coverflow.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Advanced/Coverflow/Coverflow.png" alt="Coverflow" /></a>
<input type="checkbox" id="CoverflowFull2">
<label for="CoverflowFull2" title="Click for more information"><h3>Coverflow</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>A demonstration of a coverflow style effect.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This demo serves as an example of a coverflow style effect, which is a three dimensional GUI used to display information as a stack of snapshots.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Left/Right : Flow covers left/right</p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Advanced/Coverflow/OGLES2/OGLES2Coverflow.cpp" target="_blank">OGLES2Coverflow.cpp</a> | <a href="../../Examples/Advanced/Coverflow/OGLES2/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="DeferredShading">
<div class="title">
<a href="../../Examples/Advanced/DeferredShading/DeferredShading.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Advanced/DeferredShading/DeferredShading.png" alt="DeferredShading" /></a>
<input type="checkbox" id="DeferredShadingFull2">
<label for="DeferredShadingFull2" title="Click for more information"><h3>DeferredShading</h3></label>
<div class="ShortDescription" id="TexturingShort"><p>../../../Examples/Advanced/DeferredShading/DeferredShading.txt</p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p>ERROR</p>
<p><strong>Controls:</strong></p>
<p>ERROR</p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Advanced/DeferredShading/OGLES2/OGLES2DeferredShading.cpp" target="_blank">OGLES2DeferredShading.cpp</a> | <a href="../../Examples/Advanced/DeferredShading/OGLES2/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="ExampleUI">
<div class="title">
<a href="../../Examples/Advanced/ExampleUI/ExampleUI.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Advanced/ExampleUI/ExampleUI.png" alt="ExampleUI" /></a>
<input type="checkbox" id="ExampleUIFull2">
<label for="ExampleUIFull2" title="Click for more information"><h3>ExampleUI</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>Shows how to efficiently render sprites and interface elements.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>Rendering graphical user interfaces may seem like a trivial exercise, however without careful consideration a simple interface may be unresponsive and sluggish due to poor graphics performance. The purpose of this demo is to highlight and demonstrate techniques that can be used to improve user interface performance for software running on PowerVR platforms. Indeed, any generic 2D sprite-based applications can benefit from the recommendations given in this demo including games, applications and interfaces.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Advanced/ExampleUI/OGLES2/OGLES2ExampleUI.cpp" target="_blank">OGLES2ExampleUI.cpp</a> | <a href="../../Examples/Advanced/ExampleUI/OGLES2/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="FilmTV">
<div class="title">
<a href="../../Examples/Advanced/FilmTV/FilmTV.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Advanced/FilmTV/FilmTV.png" alt="FilmTV" /></a>
<input type="checkbox" id="FilmTVFull2">
<label for="FilmTVFull2" title="Click for more information"><h3>FilmTV</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>A demonstration of a render to texture effect.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>A demonstration of a render to texture effect is shown in this demo. FBOs are used as render targets each frame, with the previous frames FBOs used as the source of the view from the camera.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Advanced/FilmTV/OGLES2/OGLES2FilmTV.cpp" target="_blank">OGLES2FilmTV.cpp</a> | <a href="../../Examples/Advanced/FilmTV/OGLES2/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="Fractal">
<div class="title">
<a href="../../Examples/Advanced/Fractal/Fractal.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Advanced/Fractal/Fractal.png" alt="Fractal" /></a>
<input type="checkbox" id="FractalFull2">
<label for="FractalFull2" title="Click for more information"><h3>Fractal</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>A demonstration of drawing a fractal using render to texture.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>A recursive fractal effect is demonstrated here using the render to texture technique. This technique is a useful method to create a variety of effects. Basically, a scene is rendered as usual, but in a texture for future reuse.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Advanced/Fractal/OGLES2/OGLES2Fractal.cpp" target="_blank">OGLES2Fractal.cpp</a> | <a href="../../Examples/Advanced/Fractal/OGLES2/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="Glass">
<div class="title">
<a href="../../Examples/Advanced/Glass/Glass.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Advanced/Glass/Glass.png" alt="Glass" /></a>
<input type="checkbox" id="GlassFull2">
<label for="GlassFull2" title="Click for more information"><h3>Glass</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>Demonstrates dynamic reflection and refraction using a dual paraboloid environment map.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This example shows a technique to maintain a dynamic environment map by rendering both hemispheres of the scene to two halves of a single rectangular texture. In addition, this also demonstrates rendering skyboxes with a full screen quad, reflection and refraction with chromatic dispersion.
</p></p>
<p><strong>Controls:</strong></p>
<p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Advanced/Glass/OGLES2/OGLES2Glass.cpp" target="_blank">OGLES2Glass.cpp</a> | <a href="../../Examples/Advanced/Glass/OGLES2/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="MagicLantern">
<div class="title">
<a href="../../Examples/Advanced/MagicLantern/MagicLantern.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Advanced/MagicLantern/MagicLantern.png" alt="MagicLantern" /></a>
<input type="checkbox" id="MagicLanternFull2">
<label for="MagicLanternFull2" title="Click for more information"><h3>MagicLantern</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>A demonstration of dynamic lighting using spherical projection.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>MagicLantern shows how to project a dynamic light-map onto a scene. It uses a cube map to hold the projected image and calculates the mapping coordinates using the direction from the light source to the vertices.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Advanced/MagicLantern/OGLES2/OGLES2MagicLantern.cpp" target="_blank">OGLES2MagicLantern.cpp</a> | <a href="../../Examples/Advanced/MagicLantern/OGLES2/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="Navigation">
<div class="title">
<a href="../../Examples/Advanced/Navigation/Navigation.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Advanced/Navigation/Navigation.png" alt="Navigation" /></a>
<input type="checkbox" id="NavigationFull2">
<label for="NavigationFull2" title="Click for more information"><h3>Navigation</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>A demonstration of how to implement rendering algorithms for Navigation software.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This demo serves as an example of how to implement rendering algorithms for Navigation software. Several techniques such as anti-aliased lines and billboards are employed. The demo also provides an example of how to use culling and batching to optimize rendering.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Up : Toggle pause/un-pause</p><p> Esc : Close the application.</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Advanced/Navigation/OGLES2/OGLES2Navigation.cpp" target="_blank">OGLES2Navigation.cpp</a> | <a href="../../Examples/Advanced/Navigation/OGLES2/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="Navigation3D">
<div class="title">
<a href="../../Examples/Advanced/Navigation3D/Navigation3D.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Advanced/Navigation3D/Navigation3D.png" alt="Navigation3D" /></a>
<input type="checkbox" id="Navigation3DFull2">
<label for="Navigation3DFull2" title="Click for more information"><h3>Navigation3D</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>A demonstration of how to implement rendering algorithms for 3D Navigation software.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This demo serves as an example of how to implement rendering algorithms for 3D Navigation software. Several techniques such as frustrum culling, visibility based culling and dynamic stencil-shadow volumes are employed. The demo also provides an example of how to use culling and batching to optimize rendering.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Advanced/Navigation3D/OGLES2/OGLES2Navigation3D.cpp" target="_blank">OGLES2Navigation3D.cpp</a> | <a href="../../Examples/Advanced/Navigation3D/OGLES2/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="PVRScopeExample">
<div class="title">
<a href="../../Examples/Advanced/PVRScopeExample/PVRScopeExample.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Advanced/PVRScopeExample/PVRScopeExample.png" alt="PVRScopeExample" /></a>
<input type="checkbox" id="PVRScopeExampleFull2">
<label for="PVRScopeExampleFull2" title="Click for more information"><h3>PVRScopeExample</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>Demonstrates the use of PVRScope and the example graphing code.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This demo shows the use of PVRScope and the example graphing code that allows an application to return performance statistics from the GPU in real time. For further details, refer to the PVRScope User Manual.
</p></p>
<p><strong>Controls:</strong></p>
<p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Advanced/PVRScopeExample/OGLES2/OGLES2PVRScopeExample.cpp" target="_blank">OGLES2PVRScopeExample.cpp</a> | <a href="../../Examples/Advanced/PVRScopeExample/OGLES2/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="PVRScopeRemote">
<div class="title">
<a href="../../Examples/Advanced/PVRScopeRemote/PVRScopeRemote.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Advanced/PVRScopeRemote/PVRScopeRemote.png" alt="PVRScopeRemote" /></a>
<input type="checkbox" id="PVRScopeRemoteFull2">
<label for="PVRScopeRemoteFull2" title="Click for more information"><h3>PVRScopeRemote</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>Demonstrates the use of PVRScope's remote communication features.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This example shows how to use the editable data and custom mark functionality of PVRScope. PVRTune must be running and connected to an instance of PVRPerfServer running on the target device for this demo to function.
</p></p>
<p><strong>Controls:</strong></p>
<p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Advanced/PVRScopeRemote/OGLES2/OGLES2PVRScopeRemote.cpp" target="_blank">OGLES2PVRScopeRemote.cpp</a> | <a href="../../Examples/Advanced/PVRScopeRemote/OGLES2/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="ParticleSystem">
<div class="title">
<a href="../../Examples/Advanced/ParticleSystem/ParticleSystem.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Advanced/ParticleSystem/ParticleSystem.png" alt="ParticleSystem" /></a>
<input type="checkbox" id="ParticleSystemFull2">
<label for="ParticleSystemFull2" title="Click for more information"><h3>ParticleSystem</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>Shows how to implement a simple particle system using OpenCL and the GPU.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>The demo utilises OpenCL to implement a particle system. Particle systems are techniques that use a large amount of sprites to simulate phenomena that would be difficult to reproduce with conventional rendering techniques. Furthermore, it also highlights the interaction between OpenCL and OpenGL (plus OpenGL ES 2).
</p><p>- left and right arrows - Decrease and increase number of particles
</p><p>- up and down arrows - Switch between OpenCL and CPU Particle System implementation.
</p></p>
<p><strong>Controls:</strong></p>
<p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Advanced/ParticleSystem/OGLES2/OGLES2ParticleSystem.cpp" target="_blank">OGLES2ParticleSystem.cpp</a> | <a href="../../Examples/Advanced/ParticleSystem/OGLES2/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="PhantomMask">
<div class="title">
<a href="../../Examples/Advanced/PhantomMask/PhantomMask.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Advanced/PhantomMask/PhantomMask.png" alt="PhantomMask" /></a>
<input type="checkbox" id="PhantomMaskFull2">
<label for="PhantomMaskFull2" title="Click for more information"><h3>PhantomMask</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This demonstration shows a mask lit using spherical harmonics and regular diffuse vertex lighting.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>Spherical Harmonic lighting is a real-time rendering technique that uses a pre-processing step to realistically render scenes using any type of light source. It is primarily used to reproduce diffuse lighting. The diffuse vertex lighting requires at least four light sources to to be roughly equivalent to the spherical harmonics lighting for this scene. Implementing four diffuse lights requires more vertex shader instructions than the spherical harmonics calculations.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> 1 : Toggle Spherical Harmonics/Vertex Lighting</p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Advanced/PhantomMask/OGLES2/OGLES2PhantomMask.cpp" target="_blank">OGLES2PhantomMask.cpp</a> | <a href="../../Examples/Advanced/PhantomMask/OGLES2/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="Shaders">
<div class="title">
<a href="../../Examples/Advanced/Shaders/Shaders.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Advanced/Shaders/Shaders.png" alt="Shaders" /></a>
<input type="checkbox" id="ShadersFull2">
<label for="ShadersFull2" title="Click for more information"><h3>Shaders</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>A demonstration of a variety of different shaders implemented on a selection of meshes.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>The Shader demo presents a variety of shaders that can be applied to a scene, such as Environment Mapping and Phong Lighting. The demo also features a selection of surfaces to display the shaders on.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Left/Right : Cycle backwards/forwards through the list of shaders</p><p> Up/Down : Cycle backwards/forwards through the list of objects</p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Advanced/Shaders/OGLES2/OGLES2Shaders.cpp" target="_blank">OGLES2Shaders.cpp</a> | <a href="../../Examples/Advanced/Shaders/OGLES2/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="Skybox2">
<div class="title">
<a href="../../Examples/Advanced/Skybox2/Skybox2.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Advanced/Skybox2/Skybox2.png" alt="Skybox2" /></a>
<input type="checkbox" id="Skybox2Full2">
<label for="Skybox2Full2" title="Click for more information"><h3>Skybox2</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This demo is a shader based version of the original OpenGL ES Skybox demo. This time it shows various shaders applied to the balloon.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This demo is a shader based version of the original OpenGL ES Skybox demo. It shows various shaders applied to the balloon, and is compressed using PVRTC4 using the PVRTexTool skybox compression feature.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Advanced/Skybox2/OGLES2/OGLES2Skybox2.cpp" target="_blank">OGLES2Skybox2.cpp</a> | <a href="../../Examples/Advanced/Skybox2/OGLES2/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="TextureStreaming">
<div class="title">
<a href="../../Examples/Advanced/TextureStreaming/TextureStreaming.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Advanced/TextureStreaming/TextureStreaming.png" alt="TextureStreaming" /></a>
<input type="checkbox" id="TextureStreamingFull2">
<label for="TextureStreamingFull2" title="Click for more information"><h3>TextureStreaming</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This example demonstrates texture streaming using platform-specific functionality.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>Streaming texture data from a camera source to a graphics API is a technique which can be very costly if hardware and software optimisations are not used correctly. This example demonstrates the correct usage for platform-specific texture streaming using native APIs relevant for each platform.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Advanced/TextureStreaming/OGLES2/OGLES2TextureStreaming.cpp" target="_blank">OGLES2TextureStreaming.cpp</a> | <a href="../../Examples/Advanced/TextureStreaming/OGLES2/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="Water">
<div class="title">
<a href="../../Examples/Advanced/Water/Water.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Advanced/Water/Water.png" alt="Water" /></a>
<input type="checkbox" id="WaterFull2">
<label for="WaterFull2" title="Click for more information"><h3>Water</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This demo shows how to render a water effect on a given plane
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This demo utilises a combination of different techniques to produce a water effect. User input controls the elements that are implemented in the effect so that users can determine the effect that would best suit their needs. When reflection, refraction and depth effects are off, the water colours alpha value is used to blend the plane in with the rest of the rendered world. This adds to the quality of the basic effect for very little cost.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Left/Right : Cycle backwards/forwards through available options</p><p> Up/Down : Change (Toggle or Increase/Decrease) the currently selected option</p><p> 1/Space : Toggle Pause/Unpause</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Advanced/Water/OGLES2/OGLES2Water.cpp" target="_blank">OGLES2Water.cpp</a> | <a href="../../Examples/Advanced/Water/OGLES2/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li></div></ul> </div>
</div>
<div id="FooterMainContainer">
<div id="FooterContainer">
<div class="footerlogo">
<a href="http://www.imgtec.com" target="_blank"><img src="./images/img-footer-logo-grey.png" width="100%" height="100%" /></a>
</div>
<div class="copyright">&copy; Imagination Technologies Limited<br> All rights reserved</div>
</div>
</div>
</body>
</html>
\ No newline at end of file
Documentation/SDKBrowser/OGLES3.html 0 → 100644
<!DOCTYPE html>
<html lang="en">
<head>
<title>The PowerVR SDK Browser</title>
<meta charset="UTF-8" />
<link rel="stylesheet" type="text/css" href="style.css">
<link rel="icon" type="image/png" href="./images/img-icon.png">
</head>
<body>
<div id="GlobalHeaderContainer">
<div id="GlobalHeader">
<div class="logo">
<a href="http://www.powervrinsider.com" target="_blank"><img src="./images/PVRlogo.png" width="40%" height="40%" /></a>
</div>
<div class="sitetitle">PowerVR SDK Browser</div>
</div>
</div>
<div id="NavContainer">
<nav>
<div class="navlink">
<a href="Home.html">Home</a>
</div>
<div class="navlink">
<a href="GettingStarted.html">Getting Started</a>
</div>
<div class="navlink">
<a href="Examples.html" class="current">Examples</a>
</div>
<div class="navlink">
<a href="Framework.html">Framework</a>
</div>
<div class="navlink">
<a href="Documentation.html">Documentation</a>
</div>
<div class="navlink">
<a href="PowerVRTools.html">PowerVR Tools</a>
</div>
<div class="navlink">
<a href="ReleaseNotes.html">Release Notes</a>
</div>
<div class="navlink">
<a href="Contact.html">Contact Us</a>
</div>
</nav>
</div>
<!--API_TAB-->
<div id="SubNavContainer"><nav><div class="subnavlink"><a href="./OGLES.html">OpenGL ES 1.x</a></div>
<div class="subnavlink"><a href="./OGLES2.html">OpenGL ES 2.0</a></div>
<div class="subnavlink"><a href="./OGLES3.html">OpenGL ES 3.x</a></div>
</nav></div>
<div class="content">
<div id="Section" class="section">
<!--API_DESCRIPTION-->
<h1>OpenGL ES 3.x Examples</h1>
<p>
OpenGL ES is a cross-platform API for 2D and 3D graphics on embedded systems such as mobile phones, tablets, vehicles and appliances. It is a subset of desktop OpenGL, tuned to expose the most efficient features of embedded GPUs. OpenGL ES 3.x adds to the already powerful OpenGL ES 2.0 with things such as multiple render targets, standardised texture compression, a new shading language and far more control over texturing. OpenGL ES 3.1 also adds compute shaders and advanced compute functionality, allowing General Purpose on GPU (GPGPU) processing. OpenGL ES 3.x is the most advanced embedded graphics API available today, and provides many features previously only found on desktop systems. This API is used by developers who want to target cutting edge devices and provide console quality entertainment on mobile systems. This API is available on PowerVR Series6 GPUs and later.
</p>
</OGLES3>
<p><a href="#Beginner" class="link">Beginner</a> | <a href="#Intermediate" class="link">Intermediate</a> | <a href="#Advanced" class="link">Advanced</a></p>
<!--EXAMPLE_TEMPLATE-->
<div id="Beginner""><h2>Beginner</h2><ul class="accordion">
<li id="HelloAPI">
<div class="title">
<a href="../../Examples/Beginner/01_HelloAPI/HelloAPI.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Beginner/01_HelloAPI/HelloAPI.png" alt="HelloAPI" /></a>
<input type="checkbox" id="HelloAPIFull2">
<label for="HelloAPIFull2" title="Click for more information"><h3>HelloAPI</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>Draw a triangle to the screen using hardware acceleration.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>A basic tutorial that guides the user, step-by-step, through the process of initializing a window using :API:, drawing a triangle in it using hardware acceleration, and then terminating the window.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Beginner/01_HelloAPI/OGLES3/OGLES3HelloAPI_Windows.cpp" target="_blank">OGLES3HelloAPI_Windows.cpp</a> | <a href="../../Examples/Beginner/01_HelloAPI/OGLES3/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="IntroducingPVRShell">
<div class="title">
<a href="../../Examples/Beginner/02_IntroducingPVRShell/IntroducingPVRShell.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Beginner/02_IntroducingPVRShell/IntroducingPVRShell.png" alt="IntroducingPVRShell" /></a>
<input type="checkbox" id="IntroducingPVRShellFull2">
<label for="IntroducingPVRShellFull2" title="Click for more information"><h3>IntroducingPVRShell</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course introduces the PVRShell library.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This demo deals with the PVRShell library. The PowerVR shell handles all OS specific initialisation code, and has several built in command line features which allow for the specifying of attributes. The library is constructed around a 'PVRShell' base class, and object of which is constructed and returned from a 'NewDemo' function.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Beginner/02_IntroducingPVRShell/OGLES3/OGLES3IntroducingPVRShell.cpp" target="_blank">OGLES3IntroducingPVRShell.cpp</a> | <a href="../../Examples/Beginner/02_IntroducingPVRShell/OGLES3/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="Texturing">
<div class="title">
<a href="../../Examples/Beginner/03_Texturing/Texturing.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Beginner/03_Texturing/Texturing.png" alt="Texturing" /></a>
<input type="checkbox" id="TexturingFull2">
<label for="TexturingFull2" title="Click for more information"><h3>Texturing</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates how to apply a texture to a polygon in :API:.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course demonstrates how to apply a texture to a polygon in :API:. The texture is generated procedurally during initialisation and then loaded into :API:. The triangle is then drawn with UV values so that the texture can be applied to it.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Beginner/03_Texturing/OGLES3/OGLES3Texturing.cpp" target="_blank">OGLES3Texturing.cpp</a> | <a href="../../Examples/Beginner/03_Texturing/OGLES3/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="BasicTnL">
<div class="title">
<a href="../../Examples/Beginner/04_BasicTnL/BasicTnL.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Beginner/04_BasicTnL/BasicTnL.png" alt="BasicTnL" /></a>
<input type="checkbox" id="BasicTnLFull2">
<label for="BasicTnLFull2" title="Click for more information"><h3>BasicTnL</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course consists of a demonstration of basic transformation and lighting.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course consists of a demonstration of basic transformation and lighting, growing on the basic drawing techniques learnt in HelloTriangle.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Beginner/04_BasicTnL/OGLES3/OGLES3BasicTnL.cpp" target="_blank">OGLES3BasicTnL.cpp</a> | <a href="../../Examples/Beginner/04_BasicTnL/OGLES3/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="IntroducingPVRTools">
<div class="title">
<a href="../../Examples/Beginner/05_IntroducingPVRTools/IntroducingPVRTools.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Beginner/05_IntroducingPVRTools/IntroducingPVRTools.png" alt="IntroducingPVRTools" /></a>
<input type="checkbox" id="IntroducingPVRToolsFull2">
<label for="IntroducingPVRToolsFull2" title="Click for more information"><h3>IntroducingPVRTools</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course introduces the PVRTools libraries.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course introduces the PVRTools libraries. These libraries provide various modules to help developers perform many of the common tasks associated with hardware accelerated graphics rendering.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Beginner/05_IntroducingPVRTools/OGLES3/OGLES3IntroducingPVRTools.cpp" target="_blank">OGLES3IntroducingPVRTools.cpp</a> | <a href="../../Examples/Beginner/05_IntroducingPVRTools/OGLES3/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="IntroducingPrint3D">
<div class="title">
<a href="../../Examples/Beginner/06_IntroducingPrint3D/IntroducingPrint3D.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Beginner/06_IntroducingPrint3D/IntroducingPrint3D.png" alt="IntroducingPrint3D" /></a>
<input type="checkbox" id="IntroducingPrint3DFull2">
<label for="IntroducingPrint3DFull2" title="Click for more information"><h3>IntroducingPrint3D</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course introduces the Print3D class featured within the PVRTools library.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course introduces the Print3D class from the PVRTools library. Print3D can be used to display text in both 2D and 3D modes. The default projection mode is 2D but supplying a modelview and projection matrices allow the user to render the text in 3D. Text in different colours is also possible.
</p></p>
<p><strong>Controls:</strong></p>
<p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Beginner/06_IntroducingPrint3D/OGLES3/OGLES3IntroducingPrint3D.cpp" target="_blank">OGLES3IntroducingPrint3D.cpp</a> | <a href="../../Examples/Beginner/06_IntroducingPrint3D/OGLES3/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="IntroducingPOD">
<div class="title">
<a href="../../Examples/Beginner/07_IntroducingPOD/IntroducingPOD.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Beginner/07_IntroducingPOD/IntroducingPOD.png" alt="IntroducingPOD" /></a>
<input type="checkbox" id="IntroducingPODFull2">
<label for="IntroducingPODFull2" title="Click for more information"><h3>IntroducingPOD</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course introduces the PowerVR Object Data (.pod) format.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course introduces the PowerVR Object Data (.pod) format. It goes into detail on how to open .pod files, load any .pfx and .pvr files that have been referenced, and set up the cameras and lights from the .pod file.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Beginner/07_IntroducingPOD/OGLES3/OGLES3IntroducingPOD.cpp" target="_blank">OGLES3IntroducingPOD.cpp</a> | <a href="../../Examples/Beginner/07_IntroducingPOD/OGLES3/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="IntroducingPFX">
<div class="title">
<a href="../../Examples/Beginner/08_IntroducingPFX/IntroducingPFX.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Beginner/08_IntroducingPFX/IntroducingPFX.png" alt="IntroducingPFX" /></a>
<input type="checkbox" id="IntroducingPFXFull2">
<label for="IntroducingPFXFull2" title="Click for more information"><h3>IntroducingPFX</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates how to use the PVRTools library to load and use .pfx files.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course demonstrates how to use the PVRTools library to load and use .pfx files. PFX is both a file format and an API, and stands for PowerVR Effects.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Beginner/08_IntroducingPFX/OGLES3/OGLES3IntroducingPFX.cpp" target="_blank">OGLES3IntroducingPFX.cpp</a> | <a href="../../Examples/Beginner/08_IntroducingPFX/OGLES3/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li></div></ul><div id="Intermediate""><h2>Intermediate</h2><ul class="accordion">
<li id="AlphaBlend">
<div class="title">
<a href="../../Examples/Intermediate/AlphaBlend/AlphaBlend.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/AlphaBlend/AlphaBlend.png" alt="AlphaBlend" /></a>
<input type="checkbox" id="AlphaBlendFull2">
<label for="AlphaBlendFull2" title="Click for more information"><h3>AlphaBlend</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course illustrates how transparency effects can be achieved with blending and the use of some common blending modes.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>Blending is a fragment operation that combines the colour value of fragments as they are drawn with values that are already present in the colour buffer. This allows transparent objects to be simulated. This training course shows how to draw blended geometry using four different types of blending modes set with glBlendFunc().
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/AlphaBlend/OGLES3/OGLES3AlphaBlend.cpp" target="_blank">OGLES3AlphaBlend.cpp</a> | <a href="../../Examples/Intermediate/AlphaBlend/OGLES3/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="AlphaTest">
<div class="title">
<a href="../../Examples/Intermediate/AlphaTest/AlphaTest.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/AlphaTest/AlphaTest.png" alt="AlphaTest" /></a>
<input type="checkbox" id="AlphaTestFull2">
<label for="AlphaTestFull2" title="Click for more information"><h3>AlphaTest</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course illustrates how to perform alpha testing and provides a visual comparison between alpha blending and alpha testing.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>Alpha testing is a technique through which a test is conducted on a per-fragment basis to determine whether that fragment should be discarded and not contribute to the final scene. This can allow complex shapes to be drawn using very simple geometries, but often at the price of hardware optimisations in the graphics pipeline. In programmable graphics pipelines supporting GLSL this is done through the use of the 'discard' keyword in the fragment shader while in the fixed function pipeline API OpenGL ES 1.x this is performed by calling either glEnable(GL_BLEND) or glEnable(GL_ALPHA_TEST).
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/AlphaTest/OGLES3/OGLES3AlphaTest.cpp" target="_blank">OGLES3AlphaTest.cpp</a> | <a href="../../Examples/Intermediate/AlphaTest/OGLES3/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="AnisotropicLighting">
<div class="title">
<a href="../../Examples/Intermediate/AnisotropicLighting/AnisotropicLighting.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/AnisotropicLighting/AnisotropicLighting.png" alt="AnisotropicLighting" /></a>
<input type="checkbox" id="AnisotropicLightingFull2">
<label for="AnisotropicLightingFull2" title="Click for more information"><h3>AnisotropicLighting</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>In this training course two techniques are shown for generating an anisotropic lighting effect, one technique using per vertex/pixel calculations, and the other using a texture lookup.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>In this training course two techniques are shown for generating an anisotropic lighting effect (the effect of surface grain on materials such as brushed metal, velvet etc.). The first technique uses per vertex and pixel calculations to calculate the shading and thus generate the effect on the fly. The second technique uses a texture lookup to determine the shading and would be useful in situations where bandwidth was more readily available than processing time.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Left/Right Arrow : Toggle effect</p><p> Esc : Close application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/AnisotropicLighting/OGLES3/OGLES3AnisotropicLighting.cpp" target="_blank">OGLES3AnisotropicLighting.cpp</a> | <a href="../../Examples/Intermediate/AnisotropicLighting/OGLES3/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="Bloom">
<div class="title">
<a href="../../Examples/Intermediate/Bloom/Bloom.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/Bloom/Bloom.png" alt="Bloom" /></a>
<input type="checkbox" id="BloomFull2">
<label for="BloomFull2" title="Click for more information"><h3>Bloom</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates a simple implementation of a 'bloom' effect.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course demonstrates a simple implementation of a 'bloom' post processing effect. The bright parts of the picture are extracted in a post processing step, blurred and added over the final image to create a glow around the object's borders.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Up/Down : Toggle the bloom effect On/Off</p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/Bloom/OGLES3/OGLES3Bloom.cpp" target="_blank">OGLES3Bloom.cpp</a> | <a href="../../Examples/Intermediate/Bloom/OGLES3/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="Bumpmap">
<div class="title">
<a href="../../Examples/Intermediate/Bumpmap/Bumpmap.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/Bumpmap/Bumpmap.png" alt="Bumpmap" /></a>
<input type="checkbox" id="BumpmapFull2">
<label for="BumpmapFull2" title="Click for more information"><h3>Bumpmap</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates an example of using a normal map to implement bump mapping.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>Bump mapping is a technique for simulating bumps and wrinkles on the surface of an object. This is achieved by perturbing the surface normals of the object and using the perturbed normal during the illumination calculations. The result is an apparently bumpy surface rather than a perfectly smooth surface although the surface of the underlying object is not actually changed. This technique is used extensively in graphics applications to add perceived detail to models without adding further geometry.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/Bumpmap/OGLES3/OGLES3Bumpmap.cpp" target="_blank">OGLES3Bumpmap.cpp</a> | <a href="../../Examples/Intermediate/Bumpmap/OGLES3/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="CellShading">
<div class="title">
<a href="../../Examples/Intermediate/CellShading/CellShading.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/CellShading/CellShading.png" alt="CellShading" /></a>
<input type="checkbox" id="CellShadingFull2">
<label for="CellShadingFull2" title="Click for more information"><h3>CellShading</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates how to implement cell shading.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course demonstrates how to implement cell shading. Cell-shaded animation (also known as Cell shading or Toon shading) is a type of non-photorealistic rendering designed to make computer graphics appear to be hand-drawn. Cell-shading is often used to mimic the style of a comic book or cartoon and is predominantly used in video games.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/CellShading/OGLES3/OGLES3CellShading.cpp" target="_blank">OGLES3CellShading.cpp</a> | <a href="../../Examples/Intermediate/CellShading/OGLES3/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="ColourGrading">
<div class="title">
<a href="../../Examples/Intermediate/ColourGrading/ColourGrading.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/ColourGrading/ColourGrading.png" alt="ColourGrading" /></a>
<input type="checkbox" id="ColourGradingFull2">
<label for="ColourGradingFull2" title="Click for more information"><h3>ColourGrading</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This example demonstrates using 3D textures to perform colour grading.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>Colour grading is the act of enhancing the colour of a scene. This example demonstrates colour grading using a 3D texture as a look up table in a post process stage of the render.
</p></p>
<p><strong>Controls:</strong></p>
<p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/ColourGrading/OGLES3/OGLES3ColourGrading.cpp" target="_blank">OGLES3ColourGrading.cpp</a> | <a href="../../Examples/Intermediate/ColourGrading/OGLES3/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="ComplexLighting">
<div class="title">
<a href="../../Examples/Intermediate/ComplexLighting/ComplexLighting.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/ComplexLighting/ComplexLighting.png" alt="ComplexLighting" /></a>
<input type="checkbox" id="ComplexLightingFull2">
<label for="ComplexLightingFull2" title="Click for more information"><h3>ComplexLighting</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates how to implement complex lighting techniques.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course demonstrates how to implement various forms of more complex lighting techniques than the basic lighting training courses. Specifically, it shows how to implement directional, point and spot lighting with a diffuse and a specular component using branching in the vertex shader.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Left/Right : Cycle through the available modes</p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/ComplexLighting/OGLES3/OGLES3ComplexLighting.cpp" target="_blank">OGLES3ComplexLighting.cpp</a> | <a href="../../Examples/Intermediate/ComplexLighting/OGLES3/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="CubeShadowMapping">
<div class="title">
<a href="../../Examples/Intermediate/CubeShadowMapping/CubeShadowMapping.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/CubeShadowMapping/CubeShadowMapping.png" alt="CubeShadowMapping" /></a>
<input type="checkbox" id="CubeShadowMappingFull2">
<label for="CubeShadowMappingFull2" title="Click for more information"><h3>CubeShadowMapping</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>Shows how to use cube shadow maps for point light sources.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>Shows how to dynamically update the cube shadow map for a point light source and cast shadows using that cube shadow map. Shadow Mapping is a process by which shadows are added to 3D computer graphics by testing whether a pixel is visible from the light source, and comparing it to a z-buffer or depth image of the light source's view.</p></p>
<p><strong>Controls:</strong></p>
<p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/CubeShadowMapping/OGLES3/OGLES3CubeShadowMapping.cpp" target="_blank">OGLES3CubeShadowMapping.cpp</a> | <a href="../../Examples/Intermediate/CubeShadowMapping/OGLES3/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="DisplacementMap">
<div class="title">
<a href="../../Examples/Intermediate/DisplacementMap/DisplacementMap.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/DisplacementMap/DisplacementMap.png" alt="DisplacementMap" /></a>
<input type="checkbox" id="DisplacementMapFull2">
<label for="DisplacementMapFull2" title="Click for more information"><h3>DisplacementMap</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates displacement mapping using a texture read from the vertex shader.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>Displacement mapping is an alternative to bump mapping, normal mapping, and parallax mapping, that causes the actual geometric position of points over a textured surface to be displaced, often along the local surface normal, according to the value the texture function evaluates to at each point on the surface.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/DisplacementMap/OGLES3/OGLES3DisplacementMap.cpp" target="_blank">OGLES3DisplacementMap.cpp</a> | <a href="../../Examples/Intermediate/DisplacementMap/OGLES3/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="EdgeDetection">
<div class="title">
<a href="../../Examples/Intermediate/EdgeDetection/EdgeDetection.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/EdgeDetection/EdgeDetection.png" alt="EdgeDetection" /></a>
<input type="checkbox" id="EdgeDetectionFull2">
<label for="EdgeDetectionFull2" title="Click for more information"><h3>EdgeDetection</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates a means of simple edge detection.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>Four highlighting modes for edge detection are available in this demonstration.'Edge Detection' mode locates the edges of each object and highlights them with a black line. 'Edge Detection: Inverse' mode locates the edge of each object and highlights them with an inverted colour, all other areas are coloured black. 'Edge Detection: Blur' mode locates the edge of each object and sets the colour of the edge to be a mixture of the surrounding fragments to produce a blur effect.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Up/Down : Cycle through highlighting modes</p><p> Left : Decrease the width of edge highlights</p><p> Right : Increase the width of edge highlights</p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/EdgeDetection/OGLES3/OGLES3EdgeDetection.cpp" target="_blank">OGLES3EdgeDetection.cpp</a> | <a href="../../Examples/Intermediate/EdgeDetection/OGLES3/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="FastTnL">
<div class="title">
<a href="../../Examples/Intermediate/FastTnL/FastTnL.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/FastTnL/FastTnL.png" alt="FastTnL" /></a>
<input type="checkbox" id="FastTnLFull2">
<label for="FastTnLFull2" title="Click for more information"><h3>FastTnL</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course serves as an example of a fast transformation and lighting vertex shader.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course shows how to use a fast transformation and lighting vertex shader. This technique is appropriate for situations when a high performance shader is required.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/FastTnL/OGLES3/OGLES3FastTnL.cpp" target="_blank">OGLES3FastTnL.cpp</a> | <a href="../../Examples/Intermediate/FastTnL/OGLES3/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="Fog">
<div class="title">
<a href="../../Examples/Intermediate/Fog/Fog.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/Fog/Fog.png" alt="Fog" /></a>
<input type="checkbox" id="FogFull2">
<label for="FogFull2" title="Click for more information"><h3>Fog</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates how to create a fog effect using shaders.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course demonstrates how to create a fog effect using shaders. Fog is used to help with the perception of distance in a 3D world - objects that are further way are increasingly coloured with a fog colour.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Left/Right : Cycle fog mode</p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/Fog/OGLES3/OGLES3Fog.cpp" target="_blank">OGLES3Fog.cpp</a> | <a href="../../Examples/Intermediate/Fog/OGLES3/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="FresnelReflections">
<div class="title">
<a href="../../Examples/Intermediate/FresnelReflections/FresnelReflections.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/FresnelReflections/FresnelReflections.png" alt="FresnelReflections" /></a>
<input type="checkbox" id="FresnelReflectionsFull2">
<label for="FresnelReflectionsFull2" title="Click for more information"><h3>FresnelReflections</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates an implementation of Fresnel reflection.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course demonstrates an implementation of Fresnel reflection. The Fresnel equations (or Fresnel conditions) describe the behaviour of light when moving between media of differing refractive indices. The reflection of light that the equations predict is known as Fresnel reflection.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Up/Down : Increase/Decrease the refractive index of the surface material</p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/FresnelReflections/OGLES3/OGLES3FresnelReflections.cpp" target="_blank">OGLES3FresnelReflections.cpp</a> | <a href="../../Examples/Intermediate/FresnelReflections/OGLES3/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="ImageConvolution">
<div class="title">
<a href="../../Examples/Intermediate/ImageConvolution/ImageConvolution.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/ImageConvolution/ImageConvolution.png" alt="ImageConvolution" /></a>
<input type="checkbox" id="ImageConvolutionFull2">
<label for="ImageConvolutionFull2" title="Click for more information"><h3>ImageConvolution</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>Introduction to image processing using GLSL Compute.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This demonstration deals with image processing. It illustrates the usage of GLSL Compute to write linear and non-linear filter kernels.
</p></p>
<p><strong>Controls:</strong></p>
<p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/ImageConvolution/OGLES3/OGLES3ImageConvolution.cpp" target="_blank">OGLES3ImageConvolution.cpp</a> | <a href="../../Examples/Intermediate/ImageConvolution/OGLES3/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="Instancing">
<div class="title">
<a href="../../Examples/Intermediate/Instancing/Instancing.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/Instancing/Instancing.png" alt="Instancing" /></a>
<input type="checkbox" id="InstancingFull2">
<label for="InstancingFull2" title="Click for more information"><h3>Instancing</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>Shows how to use instancing to draw several instances of the same mesh with a single draw call.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This example shows how to use instancing to draw several instances of the same mesh with a single draw call.
</p></p>
<p><strong>Controls:</strong></p>
<p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/Instancing/OGLES3/OGLES3Instancing.cpp" target="_blank">OGLES3Instancing.cpp</a> | <a href="../../Examples/Intermediate/Instancing/OGLES3/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="Iridescence">
<div class="title">
<a href="../../Examples/Intermediate/Iridescence/Iridescence.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/Iridescence/Iridescence.png" alt="Iridescence" /></a>
<input type="checkbox" id="IridescenceFull2">
<label for="IridescenceFull2" title="Click for more information"><h3>Iridescence</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates how to implement an iridescence effect.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course demonstrates how to implement an iridescence effect. Iridescence (also known as goniochromism) is generally known as the property of certain surfaces which appear to change colour as the angle of view or the angle of illumination changes. Iridescence is commonly seen in items such as soap bubbles, butterfly wings, and sea shells. The effect demonstrated in this training course mimics the behaviour of light reflecting off a surface covered by a translucent film of variable thickness.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Up/Down : Increase/Decrease the maximum variation</p><p> Left/Right : Decrease/Increase the maximum thickness</p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/Iridescence/OGLES3/OGLES3Iridescence.cpp" target="_blank">OGLES3Iridescence.cpp</a> | <a href="../../Examples/Intermediate/Iridescence/OGLES3/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="LevelOfDetail">
<div class="title">
<a href="../../Examples/Intermediate/LevelOfDetail/LevelOfDetail.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/LevelOfDetail/LevelOfDetail.png" alt="LevelOfDetail" /></a>
<input type="checkbox" id="LevelOfDetailFull2">
<label for="LevelOfDetailFull2" title="Click for more information"><h3>LevelOfDetail</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates a switch in the detail of an object based on its distance from the camera.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course demonstrates a switch in the detail of an object based on its distance from the camera. The vertex and fragment shaders implement two techniques for reflections. Which technique is used depends on the value of bHighDetail (which varies based on distance). If bHighDetail is true the method described in OGLES2PerturbedUVs is used; if bHighDetail is false the method described in OGLES2Reflections is used. Additionally, when the training course is in 'low detail' mode it uses a different mesh, this mesh contains only 7% of the original meshes vertices.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/LevelOfDetail/OGLES3/OGLES3LevelOfDetail.cpp" target="_blank">OGLES3LevelOfDetail.cpp</a> | <a href="../../Examples/Intermediate/LevelOfDetail/OGLES3/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="LightMap">
<div class="title">
<a href="../../Examples/Intermediate/LightMap/LightMap.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/LightMap/LightMap.png" alt="LightMap" /></a>
<input type="checkbox" id="LightMapFull2">
<label for="LightMapFull2" title="Click for more information"><h3>LightMap</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course shows how to use light maps.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course demonstrates how to use light mapping to project a shadow texture from an arbitrary point, in an arbitrary direction, onto a model which has a base and reflection texture.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/LightMap/OGLES3/OGLES3LightMap.cpp" target="_blank">OGLES3LightMap.cpp</a> | <a href="../../Examples/Intermediate/LightMap/OGLES3/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="MultipleRenderTargets">
<div class="title">
<a href="../../Examples/Intermediate/MultipleRenderTargets/MultipleRenderTargets.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/MultipleRenderTargets/MultipleRenderTargets.png" alt="MultipleRenderTargets" /></a>
<input type="checkbox" id="MultipleRenderTargetsFull2">
<label for="MultipleRenderTargetsFull2" title="Click for more information"><h3>MultipleRenderTargets</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>Shows how to use multiple render targets to output data to several different surfaces within a single pass.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>Multiple Render Targets is a technique utilised in modern graphics processing that allows the rendering of multiple images to multiple render targets simultaneously. These textures can then be used as texture maps applied to 3D models, or as inputs for other shaders.
</p></p>
<p><strong>Controls:</strong></p>
<p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/MultipleRenderTargets/OGLES3/OGLES3MultipleRenderTargets.cpp" target="_blank">OGLES3MultipleRenderTargets.cpp</a> | <a href="../../Examples/Intermediate/MultipleRenderTargets/OGLES3/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="OcclusionQueries">
<div class="title">
<a href="../../Examples/Intermediate/OcclusionQueries/OcclusionQueries.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/OcclusionQueries/OcclusionQueries.png" alt="OcclusionQueries" /></a>
<input type="checkbox" id="OcclusionQueriesFull2">
<label for="OcclusionQueriesFull2" title="Click for more information"><h3>OcclusionQueries</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>Shows how to use occlusion queries to determine visible objects.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>Shows how to use occlusion queries to determine visible objects and cull invisible ones to increase run-time performance.
</p></p>
<p><strong>Controls:</strong></p>
<p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/OcclusionQueries/OGLES3/OGLES3OcclusionQueries.cpp" target="_blank">OGLES3OcclusionQueries.cpp</a> | <a href="../../Examples/Intermediate/OcclusionQueries/OGLES3/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="ParallaxBumpMap">
<div class="title">
<a href="../../Examples/Intermediate/ParallaxBumpMap/ParallaxBumpMap.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/ParallaxBumpMap/ParallaxBumpMap.png" alt="ParallaxBumpMap" /></a>
<input type="checkbox" id="ParallaxBumpMapFull2">
<label for="ParallaxBumpMapFull2" title="Click for more information"><h3>ParallaxBumpMap</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course serves as an example of implementing the parallax bump mapping effect.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>Parallax bump mapping is a technique for simulating bumps and wrinkles on the surface of an object. This is very similar to normal bump mapping but with the addition of a parallax effect based on the view vector. This training course serves as an example of implementing the parallax bump mapping effect.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/ParallaxBumpMap/OGLES3/OGLES3ParallaxBumpMap.cpp" target="_blank">OGLES3ParallaxBumpMap.cpp</a> | <a href="../../Examples/Intermediate/ParallaxBumpMap/OGLES3/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="PerturbedUvs">
<div class="title">
<a href="../../Examples/Intermediate/PerturbedUvs/PerturbedUvs.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/PerturbedUvs/PerturbedUvs.png" alt="PerturbedUvs" /></a>
<input type="checkbox" id="PerturbedUvsFull2">
<label for="PerturbedUvsFull2" title="Click for more information"><h3>PerturbedUvs</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates the use of environment mapping with perturbed UVs.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course demonstrates the use of environment mapping with perturbed UVs. For any given surface on the object a normal map value is read, an angle of reflection between that normal and the eye direction is used to generate a new UV co-ordinate and finally, this UV co-ordinate is used to find the correct colour to reflect from the environment map.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/PerturbedUvs/OGLES3/OGLES3PerturbedUvs.cpp" target="_blank">OGLES3PerturbedUvs.cpp</a> | <a href="../../Examples/Intermediate/PerturbedUvs/OGLES3/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="Reflections">
<div class="title">
<a href="../../Examples/Intermediate/Reflections/Reflections.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/Reflections/Reflections.png" alt="Reflections" /></a>
<input type="checkbox" id="ReflectionsFull2">
<label for="ReflectionsFull2" title="Click for more information"><h3>Reflections</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates the creation of a reflection effect from a 2D map and a cube map.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course demonstrates the creation of a reflection effect from a 2D map and a cube map. This technique is also known as environment mapping in that the environment around an object is rendered into a texture (in this case as a pre-baked step) and then this environment is sampled per fragment in order to simulate the effect of light from the environment being reflected from the object. Two variations on the technique are shown using either a 2D map or a cube map.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Left/Right : Swap mapping type</p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/Reflections/OGLES3/OGLES3Reflections.cpp" target="_blank">OGLES3Reflections.cpp</a> | <a href="../../Examples/Intermediate/Reflections/OGLES3/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="Refraction">
<div class="title">
<a href="../../Examples/Intermediate/Refraction/Refraction.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/Refraction/Refraction.png" alt="Refraction" /></a>
<input type="checkbox" id="RefractionFull2">
<label for="RefractionFull2" title="Click for more information"><h3>Refraction</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates a simulation of glass-like materials.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course combines an object with a background in order to achieve a refraction effect. The background texture is applied to the model but the sample coordinates are affected by the normals of the geometry in order to simulate how light would be bent through a material with differing refractive index to the air around it.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Left/Right : Cycle Specular reflection on or off</p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/Refraction/OGLES3/OGLES3Refraction.cpp" target="_blank">OGLES3Refraction.cpp</a> | <a href="../../Examples/Intermediate/Refraction/OGLES3/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="RenderToTexture">
<div class="title">
<a href="../../Examples/Intermediate/RenderToTexture/RenderToTexture.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/RenderToTexture/RenderToTexture.png" alt="RenderToTexture" /></a>
<input type="checkbox" id="RenderToTextureFull2">
<label for="RenderToTextureFull2" title="Click for more information"><h3>RenderToTexture</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates the use of rendering to a texture.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course demonstrates rendering a scene to a pBuffer surface or FBO, then binding and applying that render to an object in an additional render pass.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Left : Toggles multisampling of the FBOs</p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/RenderToTexture/OGLES3/OGLES3RenderToTexture.cpp" target="_blank">OGLES3RenderToTexture.cpp</a> | <a href="../../Examples/Intermediate/RenderToTexture/OGLES3/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="ShadowMapping">
<div class="title">
<a href="../../Examples/Intermediate/ShadowMapping/ShadowMapping.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/ShadowMapping/ShadowMapping.png" alt="ShadowMapping" /></a>
<input type="checkbox" id="ShadowMappingFull2">
<label for="ShadowMappingFull2" title="Click for more information"><h3>ShadowMapping</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates a shadow mapping technique.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course demonstrates a shadow mapping technique. This technique begins by determining whether a given area can be seen from the light. Each fragment that is not visible is marked in one render pass and used to create a texture. In a second render pass this texture is applied to the scene to create the shadow effect.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/ShadowMapping/OGLES3/OGLES3ShadowMapping.cpp" target="_blank">OGLES3ShadowMapping.cpp</a> | <a href="../../Examples/Intermediate/ShadowMapping/OGLES3/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="ShadowVolume">
<div class="title">
<a href="../../Examples/Intermediate/ShadowVolume/ShadowVolume.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/ShadowVolume/ShadowVolume.png" alt="ShadowVolume" /></a>
<input type="checkbox" id="ShadowVolumeFull2">
<label for="ShadowVolumeFull2" title="Click for more information"><h3>ShadowVolume</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates how to use the PVRTools libraries to create and use shadow volumes.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course demonstrates how to use the PVRTools library to create and use shadow volumes. The process for using this technique involves updating dynamic shadow volumes before drawing the fully lit scene. After that, the stencil test must be enabled, and the shadow volumes must be drawn to fill the stencil buffer. Then draw a full screen quad that will only appear where the stencil buffer is not zero, and finally disable the stencil test.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> 1 : Toggle display of shadow volumes</p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/ShadowVolume/OGLES3/OGLES3ShadowVolume.cpp" target="_blank">OGLES3ShadowVolume.cpp</a> | <a href="../../Examples/Intermediate/ShadowVolume/OGLES3/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="Skinning">
<div class="title">
<a href="../../Examples/Intermediate/Skinning/Skinning.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/Skinning/Skinning.png" alt="Skinning" /></a>
<input type="checkbox" id="SkinningFull2">
<label for="SkinningFull2" title="Click for more information"><h3>Skinning</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates how to implement hardware accelerated skinning using .pod files.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course demonstrates how to implement hardware accelerated skinning using the .pod file loading tools found in the PVRTools library.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Left/Right : Rotate model clockwise/anti-clockwise</p><p> Up/Down : Zoom out/in</p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/Skinning/OGLES3/OGLES3Skinning.cpp" target="_blank">OGLES3Skinning.cpp</a> | <a href="../../Examples/Intermediate/Skinning/OGLES3/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="StencilBuffer">
<div class="title">
<a href="../../Examples/Intermediate/StencilBuffer/StencilBuffer.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/StencilBuffer/StencilBuffer.png" alt="StencilBuffer" /></a>
<input type="checkbox" id="StencilBufferFull2">
<label for="StencilBufferFull2" title="Click for more information"><h3>StencilBuffer</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course demonstrates how to use the stencil buffer to mask areas of the screen when rendering.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course demonstrates how to use the stencil buffer to mask areas of the screen when rendering. A sphere and a cylinder are drawn intersecting. The sphere is drawn first, then a stencil test performed using the cylinder. This test is used to determine what colour should be drawn for a given area of the sphere.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/StencilBuffer/OGLES3/OGLES3StencilBuffer.cpp" target="_blank">OGLES3StencilBuffer.cpp</a> | <a href="../../Examples/Intermediate/StencilBuffer/OGLES3/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="TextureArray">
<div class="title">
<a href="../../Examples/Intermediate/TextureArray/TextureArray.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/TextureArray/TextureArray.png" alt="TextureArray" /></a>
<input type="checkbox" id="TextureArrayFull2">
<label for="TextureArrayFull2" title="Click for more information"><h3>TextureArray</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>Shows how to use the texture array functionality.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This demo shows how to use a texture array in the fragment shader by using three parameters. These are the index of the texture to be sampled, and the sampling coordinates.
</p></p>
<p><strong>Controls:</strong></p>
<p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/TextureArray/OGLES3/OGLES3TextureArray.cpp" target="_blank">OGLES3TextureArray.cpp</a> | <a href="../../Examples/Intermediate/TextureArray/OGLES3/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="TransformFeedback">
<div class="title">
<a href="../../Examples/Intermediate/TransformFeedback/TransformFeedback.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/TransformFeedback/TransformFeedback.png" alt="TransformFeedback" /></a>
<input type="checkbox" id="TransformFeedbackFull2">
<label for="TransformFeedbackFull2" title="Click for more information"><h3>TransformFeedback</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>Shows how to use transform feedback to implement a simple particle system.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>Shows how to use the transform feedback functionality to implement a simple particle system. The particles are animated within a vertex shader and written out to a buffer object. This buffer object is then used to render the particles and used as input for the next frame's animation.
</p></p>
<p><strong>Controls:</strong></p>
<p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/TransformFeedback/OGLES3/OGLES3TransformFeedback.cpp" target="_blank">OGLES3TransformFeedback.cpp</a> | <a href="../../Examples/Intermediate/TransformFeedback/OGLES3/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="UniformBufferObjects">
<div class="title">
<a href="../../Examples/Intermediate/UniformBufferObjects/UniformBufferObjects.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Intermediate/UniformBufferObjects/UniformBufferObjects.png" alt="UniformBufferObjects" /></a>
<input type="checkbox" id="UniformBufferObjectsFull2">
<label for="UniformBufferObjectsFull2" title="Click for more information"><h3>UniformBufferObjects</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>Shows how to use uniform buffer objects.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This demonstration shows how to use uniform buffer objects to set the values of several shader uniforms at once. A uniform buffer object stores uniform data for a shader program, and is often used becuase switching between uniform buffer bindings is faster than swithcing several uniforms in a program. </p></p>
<p><strong>Controls:</strong></p>
<p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Intermediate/UniformBufferObjects/OGLES3/OGLES3UniformBufferObjects.cpp" target="_blank">OGLES3UniformBufferObjects.cpp</a> | <a href="../../Examples/Intermediate/UniformBufferObjects/OGLES3/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li></div></ul><div id="Advanced""><h2>Advanced</h2><ul class="accordion">
<li id="BinaryShader">
<div class="title">
<a href="../../Examples/Advanced/BinaryShader/BinaryShader.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Advanced/BinaryShader/BinaryShader.png" alt="BinaryShader" /></a>
<input type="checkbox" id="BinaryShaderFull2">
<label for="BinaryShaderFull2" title="Click for more information"><h3>BinaryShader</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This training course shows how to save and load binary shaders in a program to avoid recompiling the shaders each time.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This training course demonstrates how to save and load binary shaders at runtime. The code will compile a binary shader on first run, save it to disk and then on subsequent runs it will load in the binary shaders and use these without unnecessary recompilation. This can save time at startup, especially if many complex shaders are used. The triangle will appear red if the original shader is used, and green if the binary shader is used.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p><p>This training course does not use the OGLES2Tools library and will only function on platforms that support the GL_OES_get_program_binary extension.
</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Advanced/BinaryShader/OGLES3/OGLES3BinaryShader.cpp" target="_blank">OGLES3BinaryShader.cpp</a> | <a href="../../Examples/Advanced/BinaryShader/OGLES3/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="ChameleonMan">
<div class="title">
<a href="../../Examples/Advanced/ChameleonMan/ChameleonMan.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Advanced/ChameleonMan/ChameleonMan.png" alt="ChameleonMan" /></a>
<input type="checkbox" id="ChameleonManFull2">
<label for="ChameleonManFull2" title="Click for more information"><h3>ChameleonMan</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This demo shows a matrix skinned character in combination with bump mapping.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>The ChameleonMan demo shows a Matrix Skinned Character in combination with bump mapping. Matrix Skinning is the act of animating a vertex over time given a set (palette) of matrices and a known set of blend weights assigned to those matrices. For each frame the Matrix Palette is recomputed based on time. Per vertex, up to 3 matrices, from the palette, along with 3 weights are used by the vertex shader to update the vertex position to obtain the current animation frame position. Two lighting modes are available; per vertex lighting, and bump mapped lighting.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> 1 : Toggle lighting modes</p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Advanced/ChameleonMan/OGLES3/OGLES3ChameleonMan.cpp" target="_blank">OGLES3ChameleonMan.cpp</a> | <a href="../../Examples/Advanced/ChameleonMan/OGLES3/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="Coverflow">
<div class="title">
<a href="../../Examples/Advanced/Coverflow/Coverflow.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Advanced/Coverflow/Coverflow.png" alt="Coverflow" /></a>
<input type="checkbox" id="CoverflowFull2">
<label for="CoverflowFull2" title="Click for more information"><h3>Coverflow</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>A demonstration of a coverflow style effect.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This demo serves as an example of a coverflow style effect, which is a three dimensional GUI used to display information as a stack of snapshots.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Left/Right : Flow covers left/right</p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Advanced/Coverflow/OGLES3/OGLES3Coverflow.cpp" target="_blank">OGLES3Coverflow.cpp</a> | <a href="../../Examples/Advanced/Coverflow/OGLES3/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="DeferredShading">
<div class="title">
<a href="../../Examples/Advanced/DeferredShading/DeferredShading.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Advanced/DeferredShading/DeferredShading.png" alt="DeferredShading" /></a>
<input type="checkbox" id="DeferredShadingFull2">
<label for="DeferredShadingFull2" title="Click for more information"><h3>DeferredShading</h3></label>
<div class="ShortDescription" id="TexturingShort"><p>../../../Examples/Advanced/DeferredShading/DeferredShading.txt</p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p>ERROR</p>
<p><strong>Controls:</strong></p>
<p>ERROR</p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Advanced/DeferredShading/OGLES3/OGLES3DeferredShading.cpp" target="_blank">OGLES3DeferredShading.cpp</a> | <a href="../../Examples/Advanced/DeferredShading/OGLES3/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="ExampleUI">
<div class="title">
<a href="../../Examples/Advanced/ExampleUI/ExampleUI.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Advanced/ExampleUI/ExampleUI.png" alt="ExampleUI" /></a>
<input type="checkbox" id="ExampleUIFull2">
<label for="ExampleUIFull2" title="Click for more information"><h3>ExampleUI</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>Shows how to efficiently render sprites and interface elements.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>Rendering graphical user interfaces may seem like a trivial exercise, however without careful consideration a simple interface may be unresponsive and sluggish due to poor graphics performance. The purpose of this demo is to highlight and demonstrate techniques that can be used to improve user interface performance for software running on PowerVR platforms. Indeed, any generic 2D sprite-based applications can benefit from the recommendations given in this demo including games, applications and interfaces.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Advanced/ExampleUI/OGLES3/OGLES3ExampleUI.cpp" target="_blank">OGLES3ExampleUI.cpp</a> | <a href="../../Examples/Advanced/ExampleUI/OGLES3/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="FilmTV">
<div class="title">
<a href="../../Examples/Advanced/FilmTV/FilmTV.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Advanced/FilmTV/FilmTV.png" alt="FilmTV" /></a>
<input type="checkbox" id="FilmTVFull2">
<label for="FilmTVFull2" title="Click for more information"><h3>FilmTV</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>A demonstration of a render to texture effect.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>A demonstration of a render to texture effect is shown in this demo. FBOs are used as render targets each frame, with the previous frames FBOs used as the source of the view from the camera.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Advanced/FilmTV/OGLES3/OGLES3FilmTV.cpp" target="_blank">OGLES3FilmTV.cpp</a> | <a href="../../Examples/Advanced/FilmTV/OGLES3/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="Fractal">
<div class="title">
<a href="../../Examples/Advanced/Fractal/Fractal.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Advanced/Fractal/Fractal.png" alt="Fractal" /></a>
<input type="checkbox" id="FractalFull2">
<label for="FractalFull2" title="Click for more information"><h3>Fractal</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>A demonstration of drawing a fractal using render to texture.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>A recursive fractal effect is demonstrated here using the render to texture technique. This technique is a useful method to create a variety of effects. Basically, a scene is rendered as usual, but in a texture for future reuse.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Advanced/Fractal/OGLES3/OGLES3Fractal.cpp" target="_blank">OGLES3Fractal.cpp</a> | <a href="../../Examples/Advanced/Fractal/OGLES3/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="GameOfLife">
<div class="title">
<a href="../../Examples/Advanced/GameOfLife/GameOfLife.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Advanced/GameOfLife/GameOfLife.png" alt="GameOfLife" /></a>
<input type="checkbox" id="GameOfLifeFull2">
<label for="GameOfLifeFull2" title="Click for more information"><h3>GameOfLife</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>Implementation of John Conway's Game of Life using GLSL Compute.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This demo utilises GLSL Compute to take advantage of the GPU computation available in PowerVR Series6 to implement John Conway's Game of Life simulation, updating every aspect of the grid where all the particles are stored. OpenGL then retrieves the result of that computation and presents it on the screen.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Left and right arrows : Switch between evolution functions.</p><p> Up : Pause simulation.</p><p> Down : Generate new population.</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Advanced/GameOfLife/OGLES3/OGLES3GameOfLife.cpp" target="_blank">OGLES3GameOfLife.cpp</a> | <a href="../../Examples/Advanced/GameOfLife/OGLES3/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="MagicLantern">
<div class="title">
<a href="../../Examples/Advanced/MagicLantern/MagicLantern.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Advanced/MagicLantern/MagicLantern.png" alt="MagicLantern" /></a>
<input type="checkbox" id="MagicLanternFull2">
<label for="MagicLanternFull2" title="Click for more information"><h3>MagicLantern</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>A demonstration of dynamic lighting using spherical projection.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>MagicLantern shows how to project a dynamic light-map onto a scene. It uses a cube map to hold the projected image and calculates the mapping coordinates using the direction from the light source to the vertices.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Advanced/MagicLantern/OGLES3/OGLES3MagicLantern.cpp" target="_blank">OGLES3MagicLantern.cpp</a> | <a href="../../Examples/Advanced/MagicLantern/OGLES3/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="Navigation">
<div class="title">
<a href="../../Examples/Advanced/Navigation/Navigation.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Advanced/Navigation/Navigation.png" alt="Navigation" /></a>
<input type="checkbox" id="NavigationFull2">
<label for="NavigationFull2" title="Click for more information"><h3>Navigation</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>A demonstration of how to implement rendering algorithms for Navigation software.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This demo serves as an example of how to implement rendering algorithms for Navigation software. Several techniques such as anti-aliased lines and billboards are employed. The demo also provides an example of how to use culling and batching to optimize rendering.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Up : Toggle pause/un-pause</p><p> Esc : Close the application.</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Advanced/Navigation/OGLES3/OGLES3Navigation.cpp" target="_blank">OGLES3Navigation.cpp</a> | <a href="../../Examples/Advanced/Navigation/OGLES3/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="Navigation3D">
<div class="title">
<a href="../../Examples/Advanced/Navigation3D/Navigation3D.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Advanced/Navigation3D/Navigation3D.png" alt="Navigation3D" /></a>
<input type="checkbox" id="Navigation3DFull2">
<label for="Navigation3DFull2" title="Click for more information"><h3>Navigation3D</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>A demonstration of how to implement rendering algorithms for 3D Navigation software.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This demo serves as an example of how to implement rendering algorithms for 3D Navigation software. Several techniques such as frustrum culling, visibility based culling and dynamic stencil-shadow volumes are employed. The demo also provides an example of how to use culling and batching to optimize rendering.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Advanced/Navigation3D/OGLES3/OGLES3Navigation3D.cpp" target="_blank">OGLES3Navigation3D.cpp</a> | <a href="../../Examples/Advanced/Navigation3D/OGLES3/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="PVRScopeExample">
<div class="title">
<a href="../../Examples/Advanced/PVRScopeExample/PVRScopeExample.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Advanced/PVRScopeExample/PVRScopeExample.png" alt="PVRScopeExample" /></a>
<input type="checkbox" id="PVRScopeExampleFull2">
<label for="PVRScopeExampleFull2" title="Click for more information"><h3>PVRScopeExample</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>Demonstrates the use of PVRScope and the example graphing code.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This demo shows the use of PVRScope and the example graphing code that allows an application to return performance statistics from the GPU in real time. For further details, refer to the PVRScope User Manual.
</p></p>
<p><strong>Controls:</strong></p>
<p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Advanced/PVRScopeExample/OGLES3/OGLES3PVRScopeExample.cpp" target="_blank">OGLES3PVRScopeExample.cpp</a> | <a href="../../Examples/Advanced/PVRScopeExample/OGLES3/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="PVRScopeRemote">
<div class="title">
<a href="../../Examples/Advanced/PVRScopeRemote/PVRScopeRemote.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Advanced/PVRScopeRemote/PVRScopeRemote.png" alt="PVRScopeRemote" /></a>
<input type="checkbox" id="PVRScopeRemoteFull2">
<label for="PVRScopeRemoteFull2" title="Click for more information"><h3>PVRScopeRemote</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>Demonstrates the use of PVRScope's remote communication features.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This example shows how to use the editable data and custom mark functionality of PVRScope. PVRTune must be running and connected to an instance of PVRPerfServer running on the target device for this demo to function.
</p></p>
<p><strong>Controls:</strong></p>
<p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Advanced/PVRScopeRemote/OGLES3/OGLES3PVRScopeRemote.cpp" target="_blank">OGLES3PVRScopeRemote.cpp</a> | <a href="../../Examples/Advanced/PVRScopeRemote/OGLES3/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="ParticleSystem">
<div class="title">
<a href="../../Examples/Advanced/ParticleSystem/ParticleSystem.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Advanced/ParticleSystem/ParticleSystem.png" alt="ParticleSystem" /></a>
<input type="checkbox" id="ParticleSystemFull2">
<label for="ParticleSystemFull2" title="Click for more information"><h3>ParticleSystem</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>Shows how to implement a simple particle system using GLSL Compute.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>The demo utilises GLSL Compute to implement a particle system. Particle systems are techniques that use a large amount of sprites to simulate phenomena that would be difficult to reproduce with conventional rendering techniques.
</p><p>- left and right arrows - Decrease and increase number of particles
</p><p>- up and down arrows - Switch between GLSL Compute and CPU Particle System implementation.
</p></p>
<p><strong>Controls:</strong></p>
<p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Advanced/ParticleSystem/OGLES3/OGLES3ParticleSystem.cpp" target="_blank">OGLES3ParticleSystem.cpp</a> | <a href="../../Examples/Advanced/ParticleSystem/OGLES3/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="PhantomMask">
<div class="title">
<a href="../../Examples/Advanced/PhantomMask/PhantomMask.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Advanced/PhantomMask/PhantomMask.png" alt="PhantomMask" /></a>
<input type="checkbox" id="PhantomMaskFull2">
<label for="PhantomMaskFull2" title="Click for more information"><h3>PhantomMask</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This demonstration shows a mask lit using spherical harmonics and regular diffuse vertex lighting.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>Spherical Harmonic lighting is a real-time rendering technique that uses a pre-processing step to realistically render scenes using any type of light source. It is primarily used to reproduce diffuse lighting. The diffuse vertex lighting requires at least four light sources to to be roughly equivalent to the spherical harmonics lighting for this scene. Implementing four diffuse lights requires more vertex shader instructions than the spherical harmonics calculations.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> 1 : Toggle Spherical Harmonics/Vertex Lighting</p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Advanced/PhantomMask/OGLES3/OGLES3PhantomMask.cpp" target="_blank">OGLES3PhantomMask.cpp</a> | <a href="../../Examples/Advanced/PhantomMask/OGLES3/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="ProceduralTextures">
<div class="title">
<a href="../../Examples/Advanced/ProceduralTextures/ProceduralTextures.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Advanced/ProceduralTextures/ProceduralTextures.png" alt="ProceduralTextures" /></a>
<input type="checkbox" id="ProceduralTexturesFull2">
<label for="ProceduralTexturesFull2" title="Click for more information"><h3>ProceduralTextures</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>Shows how to generate procedural textures using GLSL Compute.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>Utilises GLSL Compute to generate procedural textures using Steven Worley's cellular texture basis functions. Procedural textures are computer-generated images created using an algorithm intended to create a realistic representation of natural elements such as wood or marble.
</p><p>- left and right arrows - Switch between distance metrics
</p><p>- up and down arrows - Switch between linear combination of weights
</p></p>
<p><strong>Controls:</strong></p>
<p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Advanced/ProceduralTextures/OGLES3/OGLES3ProceduralTextures.cpp" target="_blank">OGLES3ProceduralTextures.cpp</a> | <a href="../../Examples/Advanced/ProceduralTextures/OGLES3/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="Shaders">
<div class="title">
<a href="../../Examples/Advanced/Shaders/Shaders.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Advanced/Shaders/Shaders.png" alt="Shaders" /></a>
<input type="checkbox" id="ShadersFull2">
<label for="ShadersFull2" title="Click for more information"><h3>Shaders</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>A demonstration of a variety of different shaders implemented on a selection of meshes.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>The Shader demo presents a variety of shaders that can be applied to a scene, such as Environment Mapping and Phong Lighting. The demo also features a selection of surfaces to display the shaders on.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Left/Right : Cycle backwards/forwards through the list of shaders</p><p> Up/Down : Cycle backwards/forwards through the list of objects</p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Advanced/Shaders/OGLES3/OGLES3Shaders.cpp" target="_blank">OGLES3Shaders.cpp</a> | <a href="../../Examples/Advanced/Shaders/OGLES3/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="Skybox2">
<div class="title">
<a href="../../Examples/Advanced/Skybox2/Skybox2.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Advanced/Skybox2/Skybox2.png" alt="Skybox2" /></a>
<input type="checkbox" id="Skybox2Full2">
<label for="Skybox2Full2" title="Click for more information"><h3>Skybox2</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This demo is a shader based version of the original OpenGL ES Skybox demo. This time it shows various shaders applied to the balloon.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This demo is a shader based version of the original OpenGL ES Skybox demo. It shows various shaders applied to the balloon, and is compressed using PVRTC4 using the PVRTexTool skybox compression feature.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Advanced/Skybox2/OGLES3/OGLES3Skybox2.cpp" target="_blank">OGLES3Skybox2.cpp</a> | <a href="../../Examples/Advanced/Skybox2/OGLES3/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="TextureStreaming">
<div class="title">
<a href="../../Examples/Advanced/TextureStreaming/TextureStreaming.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Advanced/TextureStreaming/TextureStreaming.png" alt="TextureStreaming" /></a>
<input type="checkbox" id="TextureStreamingFull2">
<label for="TextureStreamingFull2" title="Click for more information"><h3>TextureStreaming</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This example demonstrates texture streaming using platform-specific functionality.
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>Streaming texture data from a camera source to a graphics API is a technique which can be very costly if hardware and software optimisations are not used correctly. This example demonstrates the correct usage for platform-specific texture streaming using native APIs relevant for each platform.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Esc : Close the application</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Advanced/TextureStreaming/OGLES3/OGLES3TextureStreaming.cpp" target="_blank">OGLES3TextureStreaming.cpp</a> | <a href="../../Examples/Advanced/TextureStreaming/OGLES3/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li>
<li id="Water">
<div class="title">
<a href="../../Examples/Advanced/Water/Water.png" title="Click to view image" target="_blank"><img class="examplesmall" src="../../Examples/Advanced/Water/Water.png" alt="Water" /></a>
<input type="checkbox" id="WaterFull2">
<label for="WaterFull2" title="Click for more information"><h3>Water</h3></label>
<div class="ShortDescription" id="TexturingShort"><p><p>This demo shows how to render a water effect on a given plane
</p></p></div>
<br>
<div class="FullDescription" id="TexturingFull">
<p><strong>Description:</strong></p>
<p><p>This demo utilises a combination of different techniques to produce a water effect. User input controls the elements that are implemented in the effect so that users can determine the effect that would best suit their needs. When reflection, refraction and depth effects are off, the water colours alpha value is used to blend the plane in with the rest of the rendered world. This adds to the quality of the basic effect for very little cost.
</p></p>
<p><strong>Controls:</strong></p>
<p><p> Left/Right : Cycle backwards/forwards through available options</p><p> Up/Down : Change (Toggle or Increase/Decrease) the currently selected option</p><p> 1/Space : Toggle Pause/Unpause</p></p>
<p><strong>Links:</strong></p>
<p class="source"><a href="../../Examples/Advanced/Water/OGLES3/OGLES3Water.cpp" target="_blank">OGLES3Water.cpp</a> | <a href="../../Examples/Advanced/Water/OGLES3/Build/" target="_blank">Projects</a></p>
</div>
</input>
</div>
</li></div></ul> </div>
</div>
<div id="FooterMainContainer">
<div id="FooterContainer">
<div class="footerlogo">
<a href="http://www.imgtec.com" target="_blank"><img src="./images/img-footer-logo-grey.png" width="100%" height="100%" /></a>
</div>
<div class="copyright">&copy; Imagination Technologies Limited<br> All rights reserved</div>
</div>
</div>
</body>
</html>
\ No newline at end of file
Documentation/SDKBrowser/PowerVRTools.html 0 → 100644
<!DOCTYPE html>
<html lang="en">
<head>
<title>The PowerVR SDK Browser</title>
<meta charset="UTF-8" />
<link rel="stylesheet" type="text/css" href="style.css">
<link rel="icon" type="image/png" href="./images/img-icon.png">
</head>
<body>
<div id="GlobalHeaderContainer">
<div id="GlobalHeader">
<div class="logo">
<a href="http://www.powervrinsider.com" target="_blank"><img src="./images/PVRlogo.png" width="40%" height="40%" /></a>
</div>
<div class="sitetitle">PowerVR SDK Browser</div>
</div>
</div>
<div id="NavContainer">
<nav>
<div class="navlink">
<a href="Home.html">Home</a>
</div>
<div class="navlink">
<a href="GettingStarted.html">Getting Started</a>
</div>
<div class="navlink">
<a href="Examples.html">Examples</a>
</div>
<div class="navlink">
<a href="Framework.html">Framework</a>
</div>
<div class="navlink">
<a href="Documentation.html">Documentation</a>
</div>
<div class="navlink">
<a href="PowerVRTools.html" class="current">PowerVR Tools</a>
</div>
<div class="navlink">
<a href="ReleaseNotes.html">Release Notes</a>
</div>
<div class="navlink">
<a href="Contact.html">Contact Us</a>
</div>
</nav>
</div>
<div class="content">
<h1>PowerVR Tools</h1>
<p>The suite of utilities in the SDK is designed to enable rapid graphics application development. It targets a range of areas including asset exporting and optimization, PC emulation, prototyping environments, online and offline performance analysis tools and many more.</p>
<p>Each utility supports Windows, OS X and Linux. The minimum requirements are as follows (older versions might still work but limited support will be provided):</p>
<ul>
<li>Windows 7</li>
<li>OS X – An Intel based machine with 10.7 (Lion)</li>
<li>Linux – Ubuntu 12.04</li>
</ul>
<p>Some utilities may have additional requirements, such as minimum version of OpenGL. For more information, please refer to the webpage of the utility you are interested in.</p>
<hr/>
<p><a href="#AssetDeployment" class="link">Asset Deployment Utilities</a> | <a href="#Development" class="link">Development Utilities</a> | <a href="#PerformanceAnalysis" class="link">Performance Analysis Utilities</a></p>
<div id="AssetDeployment">
<h2>Asset Deployment Utilities</h2>
<ul class="utility">
<li>
<img src="./images/PVRTexTool_300x182.png"/>
<h3>PVRTexTool</h3>
<p>This is a texture compression tool that supports all OpenGL, OpenGL ES and DirectX formats as well as PowerVR compression formats (PVRTC).</p>
<p><a href="http://community.imgtec.com/developers/powervr/tools/pvrtextool/" target="_blank">Find out more about PVRTexTool</a></p>
</li>
<li>
<img src="./images/PVRGeoPOD_300x182.png"/>
<h3>PVRGeoPOD</h3>
<p>An exporter tool that facilitates exporting 3D scenes and their associated geometry data to the PowerVR Object Data (POD) optimized format.</p>
<p><a href="http://community.imgtec.com/developers/powervr/tools/pvrgeopod/" target="_blank">Find out more about PVRGeoPOD</a></p>
</li>
</ul>
</div>
<div id="Development">
<h2>Development Utilities</h2>
<ul class="utility">
<li>
<img src="./images/PVRShaman_300x182.png"/>
<h3>PVRShaman</h3>
<p>This is a shader composer that uses PowerVR Object Data (POD) files and the PowerVR Effects (PFX) format to enable visual prototyping and profiling of shaders for OpenGL ES 2.0 and 3.0.</p>
<p><a href="http://community.imgtec.com/developers/powervr/tools/pvrshaman/" target="_blank">Find out more about PVRShaman</a></p>
</li>
<li>
<img src="./images/PVRVFrame_300x182.png"/>
<h3>PVRVFrame</h3>
<p>A collection of libraries that emulate OpenGL ES 1.x, 2.0, 3.0 and 3.1 as well as PowerVR extensions on development machines that do not natively support these Khronos APIs.</p>
<p><a href="http://community.imgtec.com/developers/powervr/tools/pvrvframe/" target="_blank">Find out more about PVRVFrame</a></p>
</li>
<li>
<img src="./images/PVRShaderEditor_300x182.png"/>
<h3>PVRShaderEditor</h3>
<p>An editing tool to rapidly develop and optimize shaders for PowerVR graphics cores. PVRShaderEditor integrates our off-line GLSL ES compilers to enable as-you-type performance estimates.</p>
<p><a href="http://community.imgtec.com/developers/powervr/tools/pvrshadereditor/" target="_blank">Find out more about PVRShaderEditor</a></p>
</li>
</ul>
</div>
<div id="PerformanceAnalysis">
<h2>Performance Analysis Utilities</h2>
<ul class="utility">
<li>
<img src="./images/PVRTune_300x182.png"/>
<h3>PVRTune</h3>
<p>This utility is a real-time GPU performance analysis tool. It captures hardware timing data and counters which facilitate the identification of performance bottlenecks.</p>
<p><a href="http://community.imgtec.com/developers/powervr/tools/pvrtune/" target="_blank">Find out more about PVRTune</a></p>
</li>
<li>
<img src="./images/PVRMonitor_300x182.png"/>
<h3>PVRMonitor</h3>
<p>An on-device hardware profiling tool for Android that displays real-time CPU and GPU performance data. PVRMonitor allows rapid visibility of performance fluctuations even at high frame rates.</p>
<p><a href="http://community.imgtec.com/developers/powervr/tools/pvrmonitor/" target="_blank">Find out more about PVRMonitor</a></p>
</li>
<li>
<img src="./images/PVRScope_300x182.png"/>
<h3>PVRScope</h3>
<p>Performance analysis library for developers to retrieve GPU counter data. It also works alongside PVRTune to complement it with custom markers and counters.</p>
<p><a href="http://community.imgtec.com/developers/powervr/tools/pvrscope/" target="_blank">Find out more about PVRScope</a></p>
</li>
<li>
<img src="./images/PVRTrace_300x182.png"/>
<h3>PVRTrace</h3>
<p>An OpenGL ES API recording and analysis utility. PVRTrace GUI provides off-line tools to inspect captured data, identify redundant calls, highlight costly shaders and many more.</p>
<p><a href="http://community.imgtec.com/developers/powervr/tools/pvrtrace/" target="_blank">Find out more about PVRTrace</a></p>
</li>
<li>
<img src="./images/PVRHub_300x182.png"/>
<h3>PVRHub</h3>
<p>This is a PVRTrace and PVRTune configuration tool for Android and Linux, which allows recording and profiling on device.</p>
<p><a href="http://community.imgtec.com/developers/powervr/tools/pvrhub/" target="_blank">Find out more about PVRHub</a></p>
</li>
</ul>
</div>
</div>
<div id="FooterMainContainer">
<div id="FooterContainer">
<div class="footerlogo">
<a href="http://www.imgtec.com" target="_blank"><img src="./images/img-footer-logo-grey.png" width="100%" height="100%" /></a>
</div>
<div class="copyright">&copy; Imagination Technologies Limited<br> All rights reserved</div>
</div>
</div>
</body>
</html>
\ No newline at end of file
Documentation/SDKBrowser/ReleaseNotes.html 0 → 100644
<!DOCTYPE html>
<html lang="en">
<head>
<title>The PowerVR SDK Browser</title>
<meta charset="UTF-8" />
<link rel="stylesheet" type="text/css" href="style.css">
<link rel="icon" type="image/png" href="./images/img-icon.png">
</head>
<body>
<div id="GlobalHeaderContainer">
<div id="GlobalHeader">
<div class="logo">
<a href="http://www.powervrinsider.com" target="_blank"><img src="./images/PVRlogo.png" width="40%" height="40%" /></a>
</div>
<div class="sitetitle">PowerVR SDK Browser</div>
</div>
</div>
<div id="NavContainer">
<nav>
<div class="navlink">
<a href="Home.html">Home</a>
</div>
<div class="navlink">
<a href="GettingStarted.html">Getting Started</a>
</div>
<div class="navlink">
<a href="Examples.html">Examples</a>
</div>
<div class="navlink">
<a href="Framework.html">Framework</a>
</div>
<div class="navlink">
<a href="Documentation.html">Documentation</a>
</div>
<div class="navlink">
<a href="PowerVRTools.html">PowerVR Tools</a>
</div>
<div class="navlink">
<a href="ReleaseNotes.html" class="current">Release Notes</a>
</div>
<div class="navlink">
<a href="Contact.html">Contact Us</a>
</div>
</nav>
</div>
<div class="content">
<h1>Release Notes</h1>
<p><a href="#3.4" class="link">v3.4</a> | <a href="#3.3" class="link">v3.3</a>
<div id="3.4">
<h2>PowerVR Tools and SDK v3.4</h2>
<h3>Overview</h3>
<p>In this release PVRShaderEditor adds the latest compilers for Series6, Series6 FP16, and Series6XT to provide more up-to-date profiling. PVRShaderEditor also adds new functionality to access the GLSL disassembly for these compilers, as well as full instruction set documentation. In addition, several performance optimizations have been made for the different utilities in the PowerVR Tools suite. New SDKs have been added including WebGL, Android 64bit and Linux MIPS. Furthermore, a fully redesigned PowerVR SDK Browser is now supplied with the distribution for improving accessibility of the SDK contents.</p>
<h3>Builds</h3>
<ul>
<li>Added support for Android arm64-v8a, x86_64 and mips64.</li>
</ul>
<h3>Examples</h3>
<ul>
<li>PVRScopeExample and PVRScopeRemote: updated for PVRScope changes.</li>
<li>PVRScopeExample: CPVRScopeGraph::SetActiveGroup() now accepts a group number even if there are no counters in that group, if there are higher groups. This allows PVRScopeExample to pass an empty group, to reach a higher, populated group number. Allows for 'invalid' group numbers – i.e. SW counters.</li>
<li>PVRScopeRemote:</li>
<ul>
<li>Make use of PVRScopeComms new support for nested begin/ends.</li>
<li>Utilise the CPPLProcessingScoped helper class where appropriate.</li>
<li>Use the optional pplWaitForConnection() function.</li>
<li>Instrumented all remaining functions in the app (LoadTextures, LoadShaders, LoadVbos), using CPPLProcessingScoped. Also made use of the __FUNCTION__ define.</li>
</ul>
<li>OGLES3ProceduralTextures: corrected input flags for glMemoryBarrier.</li>
</ul>
<h3>PVRShell</h3>
<ul>
<li>CPVRTPrint3D: Fixed out-of-bounds access.</li>
</ul>
<h3>PVRTools</h3>
<ul>
<li>CPVRTPFXEffect: Fixed the Destroy() function to destroy the texture data.</li>
<li>Fixed a bug in the implementation of PVRTMap where calling ‘Remove’ might have incorrect behaviour.</li>
</ul>
<h3>PVRShaman v2.2.2</h3>
<ul>
<li>Incorporated new icons in the GUI.</li>
</ul>
<h3>PVRTexTool v4.1.4</h3>
<ul>
<li>Increased performance of ETC decompression. It’s now up to about 20% faster per surface, depending on the compression scheme.</li>
<li>Fixed scaling issue. All test cases now work 100% correctly when downscaling.</li>
<li>Fixed crash when saving a texture with MIP Maps to a KTX file.</li>
</ul>
<p>PVRTexToolGUI</p>
<ul>
<li>Updated icons to new consistent style.</li>
</ul>
<p>PVRTexToolCLI</p>
<ul>
<li>Fixed padding argument so that they actually pad the metadata.</li>
<li>Fixed bug with '-squarecanvas +' where size was being set to the largest of width and depth instead of width and height.</li>
</ul>
<p>PVRTexLib</p>
<ul>
<li>Updated PVRTC Compressor to version 1.190, which fixes the single region crash, which caused small PVRTC2 textures (or MIP Maps) to crash the tool.</li>
<li>Fixed bug in PVRTC2 compressor where it won't properly compress textures that generate a single PVRTC region in the Y dimension (i.e. any texture, or MIP Map level in a texture, with a height of 4 or lower).</li>
</ul>
<p>PVRTexTool Plugins</p>
<ul>
<li>Added 2015 versions of Autodesk 3DSMax and Maya.</li>
<li>Fixed channel order when loading PVR files in Maya.</li>
</ul>
<h3>PVRVFrame v10.0</h3>
<ul>
<li>Performance improvements.</li>
<li>Added support for OpenGL ES 3.0 on OSX.</li>
<li>Added Windows XP support.</li>
<li>Added support for KHR_blend_equation_advanced and KHR_blend_equation_advanced_coherent.</li>
<li>Added support for EXT_texture_sRGB_decode.</li>
<li>Added support for GL_EXT_robustness.</li>
<li>Added seamless cube map support for OpenGL ES 3.0+ contexts.</li>
<li>Fixed glTexStorage2D when format GL_DEPTH24_STENCIL8 is used.</li>
<li>Fixed shaders of different versions being linkable.</li>
<li>Fixed GL_DEBUG_NEXT_LOGGED_MESSAGE_LENGTH always returning 0.</li>
<li>Fixed a possible data race situation when using textures in multiple threads.</li>
<li>Fixed a bug in glTranslatex where values were not being converted correctly.</li>
<li>Fixed a possible crash on OSX when sharing contexts.</li>
<li>Fixed STENCIL_INDEX8 format textures not being allowed with an ES 3.1 context.</li>
<li>Fixed a bug in eglCreateWindowSurface where allowed attributes weren't being checked correctly.</li>
<li>Fixed error checking of requested major/minor version in eglCreateContext.</li>
<li>Fixed an issue on Linux where contexts would be initialized incorrectly when using mesa OpenGL drivers.</li>
<li>Fixed gl_FragData in shaders not being translated correctly.</li>
<li>Fixed a bug in GLSL translator where textureCubeLODEXT was not being translated.</li>
</ul>
<h3>PVRVTune v14.88</h3>
<ul>
<li>Renamed TA to Tiler, and 3D to Renderer.</li>
<li>Added counters:</li>
<ul>
<li>Shader proportion: pixel.</li>
<li>Shader proportion: vertex.</li>
<li>Shader proportion: compute.</li>
<li>Vertices per batch.</li>
<li>Shader slot scheduled count: compute.</li>
<li>Shader slot scheduled count: pixel.</li>
<li>Shader slot scheduled count: vertex.</li>
<li>Shader slot size: pixel.</li>
<li>Shader slot size: vertex.</li>
<li>GPU task time per frame: Tiler core.</li>
<li>GPU task time per frame: Renderer core.</li>
<li>GPU task time per frame: 2D core.</li>
<li>GPU task time per frame: Compute core.</li>
</ul>
<li>Complete build and custom counter groups:</li>
<ul>
<li>Custom counters: editable fourth column.</li>
<li>Rename the count modes "unary" and "binary".</li>
<li>Added a filter input box for the first three columns.</li>
<li>Set the stretch factors to give the rightmost two columns more space.</li>
<li>Removed uniformItemSizes for the first list. That also affects width, which means the horizontal scroll bar wasn't appearing soon enough.</li>
<li>Fixed tab order, and put the focus in the filter box by default.</li>
<li>Now saves and restores the dialog's geometry each time.</li>
<li>Now create counters for custom HW sources.</li>
<li>BVNC string parsing. Should now handle V="cb" or V="3p" style BVNCs. When automatically creating per frame and per second counters for HW sources, now also creates a per clock counter.</li>
<li>When automatically creating per frame and per second counters for HW sources, now also creates a raw counter. This lets you see the actual count in the time period. Perhaps useful in the counter table, but not in the graph.</li>
<li>SGX XT counter: "Shader load: Compute".</li>
<li>New counter: Batches per frame.</li>
<li>New counter: Shader proportion: event.</li>
<li>PVRTune regression fix: Counter Table group combo box now correctly displays the chosen group.</li>
<li>Fixed some counter sources not being visible after choosing them in a custom group.</li>
</ul>
</ul>
<p>PVRTuneGUI</p>
<ul>
<li>PID docking-window: fixed occasional disappearance of known application names (they are only received if PVRPerfServer is run with the -pid option).</li>
<li>Monitor docking-window:</li>
<ul>
<li>Data no longer "pauses" during periods of no GPU activity.</li>
<li>Added the missing shader core load, for Rogue.</li>
</ul>
<li>Counter properties docking-window:</li>
<ul>
<li>No longer lets the window size grow due to a long counter Name or Source string.</li>
<li>Also sets the Name and Source strings as StatusTips (ToolTips are too distracting) - allows larger strings be read.</li>
</ul>
<li>Added support for nested user timelines. PVRTune renders these as a "flame graph".</li>
<li>Connection screen:</li>
<ul>
<li>URL buttons now automatically shrink their text to fit (lost during port to Qt).</li>
<li>"Connect To:" box now gets the focus by default, as it should, and as it used to. Can once again simply run and press Enter to go straight to the last connection.</li>
<li>Now convert all file path slashes to '/'. This fixes/removes the possibility of two 'matching' paths in the file history but with different slashes on Windows.</li>
<li>Status bar: now has a visual semaphore indicating connection warnings; click to show the PVRPerfServer Details dialog box.</li>
<li>Added more feedback to PVRPerfServer details: now shows warnings at the bottom.</li>
<li>Complete build: additional info.</li>
<li>Fixed some rare crashes.</li>
<li>Main window: fixed the 'empty window' behind the splash screen during first (no preferences file) start up.</li>
</ul>
<li>Changed the default docking-window layout:</li>
<ul>
<li>Top Dock left to right: counter table (default top-most), search, remote editor.</li>
<li>Bottom: Monitor (default top-most), Props, RS override, PID.</li>
</ul>
<li>Mouse hover over the Monitor now causes counters to highlight. Also, in the bar chart style, empty components will now have a hit-test result.</li>
<li>The Counter Table context menu now has a new option "Properties", which enables and brings the Counter Properties docking window foremost, and sets the focus to the Y-Axis input box.</li>
<li>Graphs:</li>
<ul>
<li>Graphs now scroll more smoothly even when received data is intermittent.</li>
<li>Fixed an issue where start-up with a zoom value of one (1) would mean that the mouse-wheel could not be used to zoom out, but other methods could.</li>
<li>Fixed vertical centering of timeline labels on Windows and Linux.</li>
<li>Renderstate Override: sets vertical policy to preferred, rather than fixed. Makes it a much more polite docking window.</li>
<li>Fixed a case where scrolled graph rendering could show pixel corruption (refresh would fix).</li>
</ul>
<li>PVRTune performance optimisations.</li>
<li>Bug-fix: restore proper counter tool-tips.</li>
<li>Updated PVRTuneComplete's welcome message in light of it being covered by the NDA licence, rather than the DDK source licence.</li>
<li>No longer remember zoom or position between sessions. When loading from a file, automatically "view all" when complete.</li>
<li>New icons.</li>
</ul>
<p>PVRPerfServer</p>
<ul>
<li>PVRPerfServer command-line:</li>
<ul>
<li>All non-single-character commands must now be prefixed with two dashes, e.g. --pid rather than -pid.</li>
<li>Added new command line option quit after time (qat) e.g. "--qat=4.2" which commands PVRPerfServer to auto-quit after a time of 4.2 seconds.</li>
</ul>
<li>PVRPerfServer for Linux, BB10 and Android: made unnecessary and removed command line option "--disable-user-input".</li>
</ul>
<p>PVRScope Library</p>
<ul>
<li>PVRScopeComms.h:</li>
<ul>
<li>Don't prefix strings with psz (thereby specifying NULL-terminated), when in fact there is a string-length parameter. pplSendMark() comment improved: the input string is not time-stamped, it's done internally.</li>
<li>New class: CPPLProcessingScoped. Helper class which will send a processing begin/end pair around its scope. You would typically instantiate these at the top of a function or after the opening curly-brace of a new scope within a function.</li>
<li>PVRScopeComms.h: updated comments; pplSendProcessingBegin() / pplSendProcessingEnd() pairs can now be nested.</li>
</ul>
<li>PVRScope: Headers should work with C code.</li>
<li>PVRScopeReadCountersThenSetGroup(): removed nTimeUS parameter as it is now queried internally.</li>
<li>Split PVRScopeReadCountersThenSetGroup() into two new functions: PVRScopeReadCounters() and PVRScopeSetGroup().</li>
<li>PVRScopeStats: new function PVRScopeFindStandardCounter().</li>
<li>Fix for per-render counters (per-frame were ok).</li>
<li>Fixed a regression in the first SDK 3.3 release that could cause noisy data.</li>
</ul>
<h3>PVRShaderEditor v2.5</h3>
<ul>
<li>Increased stability for heavy use.</li>
<li>Fixed keyboard shortcuts for consistency across Linux, Windows, and OSX.</li>
<li>Added support for new OGLCompiler Performance Simulation flag.</li>
<li>Added support for OCLCompiler flags.</li>
<li>Compiler options layout redesign, adding support to do per-file configuration.</li>
</ul>
<h3>PVRGeoPOD v2.16.3</h3>
<ul>
<li>CLI: Updated the command-line. Old commands will still work for release but are now undocumented.</li>
<li>Blender: Fixed the exporting of cameras that are the children of other objects.</li>
<li>Fixed a bug where meshes were split even if we weren't exporting materials.</li>
<li>Added support for 3ds max 2015 SP 2 (igame version 17.2.259.0).</li>
</ul>
<h3>PVRTrace v3.4</h3>
<ul>
<li>Added data compression for trace files to reduce their size.</li>
<li>PVRTrace will now output an error message if you attempt to load a trace file with a file format newer than the latest format recognised.</li>
<li>PVRTrace files are no longer allowed to have ':' in their name. This caused issues when recording on Android where it is allowed and trying to pull the file on to Windows where it isn't.</li>
<li>glTexEnv and glGetTexEnv now show the enum values as strings where appropriate.</li>
<li>Frame count now begins at 0 to match the recorder.</li>
<li>Export frame stats now exports information from the first frame.</li>
<li>Significantly reduced memory usage.</li>
<li>glStencilMask now shows its mask as a hex value instead of an unsigned int.</li>
<li>Fixed a bug in the renderstate tracking of glCopyBufferSubData.</li>
</ul>
<p>PVRTraceGUI</p>
<ul>
<li>Fixed an issue with the generation of the PowerVR depth complexity for some trace files.</li>
<li>You can now view the attributes of a config used for context and window creation by hovering over the config parameter of their respective eglCreate* functions.</li>
<li>We now display an error message if the profiling compiler fails to compile a shader.</li>
<li>Added the GL_EXT_debug_marker functions.</li>
<li>The image analysis spinning loading symbol now scales with the window.</li>
<li>glIsQueryEXT now loads the return value.</li>
<li>The static analysis now shows errors for shaders that failed to compile and programs that failed to link if and only if the trace was recorded with the latest version. Also, if you hover over the call in the static analysis window it'll mention the compilation/linking information log.</li>
<li>The call summary export now includes lists all API calls instead of just the ones used. This should make is easier to diff application runs.</li>
<li>Fixed call highlighting on Linux.</li>
<li>The "cancel" button has been removed from the search dialog. Now, if a search is running the "find" button becomes the "cancel" button.</li>
<li>Softened the static analysis warning about using scissor rectangles as this only applies to SGX.</li>
<li>If the trace file was recorded with the save framebuffers option you can now export the framebuffers to a folder as separate images.</li>
<li>Fixed a crash that occurred if the statistics dialog was open when exiting.</li>
<li>The call view can now be navigated with the page up and down keys.</li>
<li>Fixed the function quick help which was broken for some functions.</li>
<li>Added the function quick help to extension functions where possible.</li>
<li>Fixed a bug where the thread list would not get cleared when loading multiple trace files.</li>
<li>Play failed calls is now disabled by default.</li>
</ul>
<p>PVRTracePlayback</p>
<ul>
<li>By default we now playback calls that caused errors during recording. This can be disabled within the GUI or in playback via the command-line.</li>
<li>Fixed an issue with playing back uniform blocks.</li>
<li>Added support for the query EXT functions. </li>
<li>Added --robust that will force the use of EGL_EXT_create_context_robustness and GL_EXT_robustness and will check the reset status of the GL context after each call. If you do --robust=0 it will disable the use of those extensions.</li>
<li>Added support for playing back eglCreateImageKHR with targets:</li>
<ul>
<li>EGL_GL_TEXTURE_2D_KHR</li>
<li>EGL_GL_TEXTURE_CUBE_MAP_POSITIVE_X_KHR</li>
<li>EGL_GL_TEXTURE_CUBE_MAP_NEGATIVE_X_KHR</li>
<li>EGL_GL_TEXTURE_CUBE_MAP_POSITIVE_Y_KHR</li>
<li>EGL_GL_TEXTURE_CUBE_MAP_NEGATIVE_Y_KHR</li>
<li>EGL_GL_TEXTURE_CUBE_MAP_POSITIVE_Z_KHR</li>
<li>EGL_GL_TEXTURE_CUBE_MAP_NEGATIVE_Z_KHR</li>
<li>EGL_GL_TEXTURE_3D_KHR</li>
<li>EGL_GL_RENDERBUFFER_KHR</li>
</ul>
</ul>
<p>PVRTrace Recorder</p>
<ul>
<li>Fixed 2x2 texture override when the application is using texture 3D and 2D array.</li>
<li>Fixed force flat colour fragment shader for applications that use GLSL 300 ES shaders.</li>
<li>You can now set the default states of the renderstate overrides in the config.</li>
</ul>
<h3>PVRHub v2.1</h3>
<p>Android</p>
<ul>
<li>Added an option to compress data in trace files.</li>
<li>Added an option to enable/disable the gathering of CPU usage data when profiling is enabled.</li>
<li>The recording output level is now configurable.</li>
<li>You can now set the initial state of the renderstate overrides.</li>
<ul>
<li>Added option to disable the appending of the PVRTrace version to the GL_RENDERER and EGL_VERSION strings.</li>
</ul>
<li>Added the option to send markers to PVRTune when profiling.</li>
<li>The "Application list" gets cached at PVRHub launch time (there is an option to refresh it) decreasing substantially the load time.</li>
<li>User Interface</li>
<ul>
<li>Added new icons.</li>
<li>Other minor UI changes such as simplification.</li>
<li>Added option to share trace files. </li>
<li>Added a "File Manager" option to help developer manage the recordings captured.</li>
</ul>
</ul>
<h3>Documentation</h3>
<ul>
<li>New SDK Browser to make easier to find the material contained in the PowerVR SDK with full explanations, hyperlinks and enhanced installation instructions.</li>
<li>Major styling improvements brought about to the Shell, Tools, PVRTexLib and PVRScope documentation.</li>
<li>Major overhaul of various user manuals in order to better address the needs for the intended audience of developers.</li>
<li>PowerVR Supported Extensions documentation:</li>
<ul>
<li>Added GL_OES_texture_stencil8.</li>
<li>Updated extensions listing to match current driver support. </li>
</ul>
</ul>
<h3>Installer</h3>
<ul>
<li>Added Android OpenGL ES 3.0 SDK.</li>
<li>Fixed all Utilities shortcuts on Windows and Linux.</li>
<li>Fixed file association on Linux.</li>
<li>Added TextureStreaming demo missing from the installer.</li>
<li>Added missing OpenGL ES 3 iOS deliverable.</li>
<li>Fixed VS2010 redistributable install logic and fixed behaviour when Microsoft installation is cancelled.</li>
</ul>
<br>
</div>
<div id="3.3">
<h2>PowerVR Tools and SDK v3.3</h2>
<h3><strong>PowerVR Tools and SDK v3.3 Release 2</strong></h3>
<h3>Overview</h3>
<ul>
<li>New: OpenGL ES 3.0 SDKs for iOS and Android.</li>
<li>New: OpenGL ES 3.1 SDK for Windows and Linux emulation.</li>
<li>New: TextureStreaming demo for iOS and Android. Demonstrates how live camera data can be efficiently uploaded to OpenGL ES.</li>
<li>New: PVRShaderEditor now supports syntax highlighting for GLSL ES 3.10 shaders.</li>
</ul>
<h3>Builds</h3>
<ul>
<li>Added OpenGL ES 3.1 PC Emulation SDK for Windows and Linux.</li>
<li>Added OpenGL ES 3.0 SDK for iOS and Android.</li>
</ul>
<h3>Examples</h3>
<ul>
<li>IntroducingPOD: Always write an alpha value of 1.0 in the fragment shader to avoid potential OS compositor artefacts.</li>
<li>Skybox2: Tweaked the precision modifiers.</li>
<li>Android, OGLES2TextureStreaming: Added Android demo which makes use of the Camera Interface.</li>
<li>iOS, OGLES2TextureStreaming: Added missing CameraInterface dependencies.</li>
<li>iOS, OGLES2TextureStreaming: Changed mapping iOS camera texture to the recommended GL_LUMINANCE and GL_LUMINANCE_ALPHA (which works in OGLES2/3).</li>
<li>iOS, OGLES2MultiThreading: Changed main application file from .cpp to .mm to enable correctly including relevant objective-c style header files.</li>
<li>iOS, OGLES2Glass: Fixed run time error on iOS when binding the default FBO object.</li>
</ul>
<h3>PVRShell</h3>
<ul>
<li>Context creation failures updated to contain requested API version.</li>
</ul>
<h3>PVRTools</h3>
<ul>
<li>Added Android Camera Interface.</li>
</ul>
<h3>PVRShaman v2.2.1</h3>
<ul>
<li>Added missing types, qualifiers & built-ins for GLSL ES 3.00 syntax highlighting.</li>
<li>Added GLSL ES 3.10 syntax highlighting.</li>
</ul>
<h3>PVRTexTool v4.1.2</h3>
<p>PVRTexToolGUI</p>
<ul>
<li>Fixed crash when trying to compare images of different sizes. Error message is now correctly displayed.</li>
<li>Fixed floating point texture loads so that they don't get converted to 8-bit unorm on load.</li>
</ul>
<p>PVRTexLib</p>
<ul>
<li>Fixed shared version of the library's compression algorithm to remove artefacts caused by a VS2010 compiler optimisation gone awry.</li>
<li>Fixed d3d format to PVR format conversion for D3DFMT_A16B16G16R16F.</li>
</ul>
<p>PVRTexTool Plugins</p>
<ul>
<li>Maya: Fixed channel order when loading PVR files in Maya.</li>
</ul>
<h3>PVRVFrame v9.9</h3>
<ul>
<li>Fixed a bug where glGet(GL_NUM_EXTENSIONS) would return the wrong value.</li>
<li>Fixed a bug in GLSL translation where #define may be stripped incorrectly.</li>
<li>No longer erroneously exposes glShaderStorageBlockBinding.</li>
<li>Added support for proper creation of ES 3.1 contexts.</li>
<li>Fixed memory leaks.</li>
<li>Fixed symbols not being exported correctly:</li>
<ul>
<li>glBindVertexBuffer</li>
<li>glVertexAttribBinding</li>
<li>glVertexAttribFormat</li>
<li>glVertexAttribIFormat</li>
<li>glVertexBindingDivisor</li>
<li>glCreateShaderProgramv</li>
<li>glGetBooleani_v</li>
<li>glGetTexLevelParameterfv</li>
<li>glGetTexLevelParameteriv</li>
<li>glMemoryBarrierByRegion</li>
</ul>
<li>Fixed glPointSizePointerOES not being exported on Linux.</li>
</ul>
<h3>PVRTune v14.15.2</h3>
<ul>
<li>Counter renaming: US, USC and USSE to Shader.</li>
<li>Added Rogue counters: Shader load: Compute and Shader ALU efficiency.</li>
<li>Restored some missing counters when running with Series6 HW.</li>
</ul>
<p>PVRTuneGUI</p>
<ul>
<li>Fixed a crash at start-up when the "hide unnecessary tabs" option is disabled.</li>
<li>Counter results in a Search window are now interactive. Hover to highlight; click to select; drag and drop onto graph views, underscore if highlighted elsewhere.</li>
<li>Added counters per PID, per GPU core task time counters, alongside existing task load counters. (BRN47467).</li>
<li>Search and Monitor no longer consume CPU time when their dock window is not topmost.</li>
<li>Counter table: restore old behaviour: Inactive counters now fade before disappearing (if 'hide inactive' is enabled).</li>
<li>"Search" widget dropdown box items should be listed chronologically (BRN45741).</li>
<li>Counter Table and Search windows no longer force themselves to be top-most at app start-up.</li>
<li>Fix for per-core CPU usage on Linux/Android when cores are being enabled/disabled on the fly (BRN47850).</li>
</ul>
<p>PVRPerfServer</p>
<ul>
<li>When the '-pid' option is used, now also send the executable name for all PIDs seen using the GPU.</li>
<li>Fixed a crash when using the ‘-sendto’ option along with applications that use PVRScope (BRN47848).</li>
</ul>
<p>PVRScope Library</p>
<ul>
<li>Fix for per-render counters only (per-frame were ok) that caused the data to be out by a factor of two.</li>
<li>Fix a regression in the first SDK 3.3 release that could cause noisy data.</li>
</ul>
<h3>PVRShaderEditor v2.4</h3>
<ul>
<li>Added missing types, qualifiers & built-ins for GLSL ES 3.00 syntax highlighting.</li>
<li>Shader type is detected by file extension first. If the extension is unknown, fuzzy logic is used to guess the shader type.</li>
<li>Added GLSL ES syntax highlighting for the following extensions:</li>
<ul>
<li>EXT_shader_framebuffer_fetch</li>
<li>EXT_shader_pixel_local_storage</li>
<li>OES_shader_multisample_interpolation</li>
<li>GL_KHR_blend_equation_advanced</li>
<li>EXT_shader_pixel_local_storage</li>
<li>OES_sample_variables</li>
<li>OES_shader_image_atomic</li>
<li>OES_texture_storage_multisample_2d_array</li>
</ul>
<li>Added GLSL ES 3.10 syntax highlighting.</li>
<li>Updated the New File wizard to support GLSL ES 3.10 vertex, fragment and compute shaders.</li>
<li>Added background compilation for GLSL ES 3.10 vertex, fragment and compute shaders when a GLSL ES 3.10 capable compiler is active (a pre-release version of our GLSL ES 3.10 compiler can be downloaded from our support portal: https://pvrsupport.imgtec.com/downloads).</li>
</ul>
<h3>PVRGeoPOD v2.16.2</h3>
<ul>
<li>Added support for IGame version 16.5.277.0 and 17.1.149.0.</li>
<li>Added support for 3DSMax 2015 (IGame 17.0.630.0) and Maya 2015.</li>
<li>The exporter now exports mesh nodes as dummy nodes when the "export geometry" option is unticked. This fixes a crash that can occur if the mesh is the parent of another type of node, e.g., light.</li>
</ul>
<h3>PVRTrace v3.3.1</h3>
<ul>
<li>The image analysis image now uses bilinear filtering when scaling the image below 100%.</li>
<li>These enums are now represented by strings in the GUI:</li>
<ul>
<li>EGL_NATIVE_BUFFER_ANDROID</li>
<li>GL_CONSTANT_COLOR</li>
<li>GL_ONE_MINUS_CONSTANT_COLOR</li>
<li>GL_ONE_MINUS_CONSTANT_COLOR</li>
<li>GL_ONE_MINUS_CONSTANT_ALPHA</li>
</ul>
<li>Added missing types, qualifiers & built-ins for GLSL ES 3.00 syntax highlighting.</li>
<li>Added GLSL ES 3.10 syntax highlighting.</li>
</ul>
<p>PVRTrace Recorder</p>
<ul>
<li>The recording of clientbuffers now supports sampling the data once at time of egl image creation using config value 3.</li>
</ul>
<p>PVRTracePlayback</p>
<ul>
<li>Fixed playback of glVertexAttribDivisor.</li>
<li>Fixed the playback for some traces which would fail to create a window surface if they weren't the first trace file open.</li>
</ul>
<h3>PVRHub v2.0</h3>
<p>Android</p>
<ul>
<li>Added a dialog to help the user kill an already running app.</li>
<li>Changed the PVRHubDaemon backend implementation.</li>
<li>Improved stability and speed.</li>
<li>The backups are now made (and restored) every time the Android build ID changes (i.e. system upgrade).</li>
</ul>
<p>Linux</p>
<ul>
<li>Scripts now generate a pvrtraceconfig.json file.</li>
<li>Added OpenGL ES 3.0 support.</li>
</ul>
<h3>PVRMonitor v1.01</h3>
<ul>
<li>Added a new CPU widget that displays multiple cores as vertical bars on the same lines as PVRTune.</li>
<li>Now the GPU values can be smoothed over 0.5seconds, similar to the CPU values.</li>
<li>Few minor UI tweaks.</li>
</ul>
<h3>Documentation</h3>
<ul>
<li>Extensions: Updated GL_OES_EGL_image/GL_OES_EGL_image_external descriptions to match their actual behaviour.</li>
<li>PVRTrace user manual: Updated the document with revised manual Android installation instructions (rooted).</li>
<li>PVRGeoPOD user manual: Updated compatibility table to show support for new 3dsMax 2014/2015 and Maya 2015 versions.</li>
</ul>
<h3>Installer</h3>
<ul>
<li>Updated InstallBuilder to v9 to solve the problem with cached files after an installation failure.</li>
<li>Removed MSVC2010 redistributable installer as it was causing SDK installations to fail.</li>
<li>Fixed missing PVRTune documentation shortcut.</li>
</ul>
<hr/>
<h3><strong>PowerVR Tools and SDK v3.3 Release 1</strong></h3>
<h3>Overview</h3>
<ul>
<li>The PowerVR Graphics SDK v3.3 includes support for the recently ratified OpenGL ES 3.1 in PVRVFrame, our desktop emulation libraries.</li>
<li>PVRTrace now includes full recording capabilities on Android 4.4 (KiKat) and the handling of Android Native Buffers has been improved. Developers also now benefit from enhanced search and remote recording capabilities and complete support for OpenGL ES 3.0 API.</li>
<li>PVRTune implements a new ‘monitor’ window which provides a simplified and high-level overview of CPU, memory and graphics loading, allowing developers to quickly isolate application bottlenecks. It also has improved highlight and selection capabilities and implements new per-PID stats.</li>
<li>In addition, the SDK’s documentation has been comprehensively reviewed and updated.</li>
</ul>
<h3>Note</h3>
Full support for the recently ratified OpenGL ES 3.1 API has been added to PVRVFrame. Please note that this support is only intended for early development, as an OpenGL ES 3.1 conformance test has not yet been released. To use it, please download the header files from the Khronos website. We will shortly release a full SDK highlighting the most important features of this new API.
<h3>Examples</h3>
<ul>
<li>ToneMapping: Now it uses point sampling for its float texture.</li>
<li>OcclusionQueries: Fixed the name of the texture variable in the effect.pfxs.</li>
<li>ShadowMapping: Fixed a typo in the OGLES3 effect.pfx file which resulted in the texture coordinates being uninitialised.</li>
<li>EdgeDetection: Moved initialisation of timer to InitView so the first value is valid. This fixes the problem using -fft command-line option.</li>
<li>MagicLantern: Moved initialisation of timer to InitView so the first value is valid. This fixes the problem using -fft command-line option.</li>
<li>Water: Updated with new assets including a new skybox, ship and terrain.</li>
<li>Shaders: Improved command-line parsing so it doesn't attempt to match any option that begins with -s or -m.</li>
<li>DeferredShading: Stencil buffer was not requested in the EGLConfig for ES3, but was assumed and used. Now updated to always request a stencil buffer.</li>
<li>TextureStreaming: New example for Android and iOS.</li>
<li>Added OGLES3 iOS project files for all examples capable of running on iOS.</li>
</ul>
<h3>PVRTools</h3>
<ul>
<li>PVRTString: Added positional variants of the format commands.</li>
<li>PVRTTexture: Added PVRTC sRGB texture support.</li>
<li>PVRTPFXParser: Fixed crash while processing texture wrap parameters.</li>
<li>PVRTArray: Changed the Sort() method to use merge sort instead of bubble sort.</li>
<li>PVRTError: Fixed warning in PVRTError.h as the format parameter to printf was not a string literal.</li>
<li>PVRTResourceFile: Added a null pointer check in GetFile.</li>
<li>Added a new CameraInterface library for Android and iOS which allows quick initialisation and usage of hardware cameras to stream textures to OpenGLES.</li>
</ul>
<h3>PVRShell</h3>
<ul>
<li>Improved the Android OS lifecycle.</li>
<li>Modified PVRShellOutputDebug on Windows to dynamically allocate its buffer instead of using a fixed size of 1024</li>
</ul>
<h3>PVRShaman v2.2.0</h3>
<ul>
<li>Fixed bug in which the Save POD icon would be greyed out.</li>
<li>Added the displaying of POD textures such as bump and specular level to the Material Properties dialog.</li>
<li>Fixed bug when using external shader files in a PFX material. The material would fail to pass validation.</li>
</ul>
<h3>PVRTexTool v4.1.3</h3>
<p>PVRTexLib</p>
<ul>
<li>Fixed issue with BC1 Compression producing holes in fully opaque textures when an entire block was the same colour.</li>
<li>Fixed memory leak in ETC2 Codec.</li>
<li>Integrated latest version of PVRTC codec, which should produce generally better quality images, and manages threads a bit more smartly.</li>
<li>Fixed issue with certain ETC textures not compressing correctly under Windows.</li>
</ul>
<p>PVRTexToolGUI</p>
<ul>
<li>Font texture generation now outputs white textures rather than black.</li>
<li>Fixed channel swapping so that when multiple file sources are selected, it correctly copies the channels.</li>
<li>Fixed memory leak when zooming in/out of Diff window.</li>
<li>Added RGBA/RGB distinction for PVRTCv1.</li>
<li>Added PVRTC sRGB support.</li>
<li>"Single" display mode now zooms to/from the mouse position, rather than the corner of the screen.</li>
</ul>
<h3>PVRVFrame v9.8</h3>
<ul>
<li>Added OpenGL ES 3.1 support.</li>
<li>Fixed vertex_array_object extension not being emulated on OSX.</li>
<li>Fixed GLSL translator where reserved identifiers were erroneously added to the GLSL source.</li>
<li>Fixed EGL_SUCCESS not being reported by some EGL functions in cases where it should.</li>
<li>EGL_BAD_ALLOC now reported by eglCreateWindowSurface on Windows platforms if the application attempts to re-use an HWND for which the pixel format has already been set.</li>
<li>Fixed EGL context ids where it would not always be unique.</li>
<li>Fixed GL_LUMINANCE texture data clamping to [0,1].</li>
<li>Fixed glBindRenderbuffer where it would not work with names not generated by glGenRenderbuffer.</li>
<li>Fixed a crash in glDeleteSamplers.</li>
</ul>
<h3>PVRTune v14.73</h3>
<ul>
<li>PVRScope library only: Reduced noise in per-core activity counters.</li>
<li>PVRScopeStats.h, PVRScopeReadCountersThenSetGroup(): Updated comment to consider standalone performance-tracking applications such as PVRMonitor or a logging app.</li>
<li>PVRPerfServer can now send CPU usage info for 'interesting' PIDs that it sees: apps that connect via PVRScope, PIDs shown in HWPerf timing data, and PIDs specified on the command line. To enable it, specify "-pid" on the command line. To additionally watch specific PIDs, specify "-pid=A,B" etc.</li>
<li>Added per-core task time counters.</li>
<li>Added per-PID stats: TA Busy %, 3D Busy %, 2D Busy %, Compute Busy %, 3D SPM %.</li>
<li>Dynamic counters created per PID or CID now place the PID/CID number first; gives easier sorting.</li>
<li>CPU usage can now be sent per core and per PID.</li>
<li>Memory usage can now be sent for the system and per PID. Added counters: Memory use, Memory total, Memory load, PID %u: Memory use.</li>
<li>Added new docking window: Monitor. This gives a simplified 'at a glance' view of the CPU, memory and graphics loading.</li>
<li>Fixed: When connecting, disconnecting and reconnecting, pause was enabled by default.</li>
<li>Search window
<ul>
<li>The "select" tick box has been removed.</li>
<li>Mouse-over search results now highlights the relevant time range (if any) in the graph views.</li>
<li>Single-click on a result now pans the view, rather than panning + zooming.</li>
<li>Double-click on a result now pans and zooms the view.</li>
<li>Holding the Ctrl key while doing either of the above also selects the time range. (Similar to how Ctrl+click in a graph view is used to alter the selected time range).</li>
<li>Hold Ctrl+Shift to extend the existing selection.</li>
<li>Added View\Find - Ctrl+F now works to bring up Search (shows, raises and sets focus to the input box).</li>
</ul>
</li>
<li>Graph Views
<ul>
<li>Now display the highlighted time range.</li>
<li>Ensure selection/highlight range draws are always at least 1 pixel wide.</li>
<li>If there is a task under the mouse, highlight the entire time range.</li>
<li>Ctrl must be held to modify the selection - don't suddenly allow Shift by itself to extend the selection.</li>
<li>Ctrl+clicking on a task now sets the selection to be the entire task time-range - giving 'snap' behaviour. Additionally, hold Shift to instead extend the existing selection.</li>
</ul>
</li>
<li>Counter Table
<ul>
<li>Added a new counter table column: Highlight.</li>
<li>Counter Table default columns are now: 1s, Selected, View.</li>
</ul>
</li>
<li>Counters
<ul>
<li>Enable SPM counter in Developer build.</li>
<li>Renamed some US counters to USC.</li>
<li>Increase the maximum graph y-axis value that may be entered.</li>
</ul>
</li>
</ul>
<h3>PVRShaderEditor v2.3</h3>
<ul>
<li>Performing a search when the ASM Output widget has focus now searches the ASM widget instead of the main editor.</li>
<li>Deleting or moving a file which is currently open in PVRShaderEditor will now correctly prompt whether to discard the file or keep the file in the editor.</li>
<li>Fixed bug in which re-opening the editor when closed with a blank file and the option 'Save Session' selected would display an IOError.</li>
<li>Fixed bug which meant that PFX line cycle counts and errors were only being displayed for the entire GLSL block, rather than per-line, if the GLSL code is embedded.</li>
</ul>
<h3>PVRGeoPOD v2.16</h3>
<ul>
<li>Fixed the exporting of .h/.cpp files from Maya and Max.</li>
</ul>
<h3>PVRTrace v3.3</h3>
<p>PVRTraceGUI</p>
<ul>
<li>Fixed the saving of the wireframe colour to the preferences.</li>
<li>The call summary now allows the addition of highlights to the calls in the call viewer, as well as to find all occurrences of that call using the search feature.</li>
<li>The call summary now supports multiple selection of calls using Ctrl+left mouse click and Shift+left mouse click.</li>
<li>It is now possible to search calls within a specific frame range and by thread.</li>
<li>Status bar messages no longer timeout.</li>
<li>The minimum number of characters that can now be searched for is 1.</li>
<li>Search results can now be selected with Enter when navigating with arrow keys.</li>
<li>Tidied up/simplified the Remote Controller interface.</li>
<li>The default for the number of search results has been raised from 100 to 500</li>
<li>Added the EGL_CONTEXT_PRIORITY enums as recognised values.</li>
<li>Tweaked the Find functionality.</li>
<li>Render targets are now listed in chronological order.</li>
<li>The Android version of the PVRTrace libraries now export a subset of the extensions that the NDK's version of libGLESv1_CM and libGLESv2 export.</li>
<li>Added an extra counter to the profiling that shows the total number of API calls in a frame.</li>
<li>Modified the call summary export so the rows and columns are switched.</li>
</ul>
<p>PVRTrace Recorder</p>
<ul>
<li>Added support for recording on Android 4.4, KitKat.</li>
<li>Added support for recording eglImages created from EGL_NATIVE_BUFFER_ANDROID client buffers.</li>
<li>Supports JSON-formatted configuration files.</li>
<li>It is no longer needed to specify the Android drivers to use when recording in the config file as the recording libraries will locate them as long as they are located in /system/lib/egl or /vendior/lib/egl.</li>
<li>Fixed a failure to open the recording file on Android if %pname is used and the process name has slashes in.</li>
<li>Renamed some command-line options: --windowsToUse becomes --window, --delayRenderFrame becomes --delay and --iterations becomes --repeat.</li>
<li>Fixed multidraw support.</li>
<li>Added missing ES3.0 functionality.</li>
</ul>
<h3>Documentation</h3>
<ul>
<li>Extensions: Added GL_EXT_shader_framebuffer_fetch and added EXT_separate_shader_objects.</li>
<li>Fixed an error in the User Guide where it incorrectly stated the FSAA command for the PVRShell as "-FSAAMode=N" instead of the new "-aasamples=N".</li>
<li>Fixed an error in the network recording instructions that specified to use 'Network Panel' to now correctly reference the 'Remote Controller'.</li>
<li>Fixed an error in the instructions for Installation on Linux where the Scripts folder was not correctly capitalised.</li>
<li>Fixed an error in the instructions for Installation on Linux where a space was missing before a closing square bracket in the .bashrc entry.</li>
<li>Updated PVRTexTool User Manual.</li>
<li>Enhanced PVRScope User Manual.</li>
<li>Enhanced PVRTrace User Manual and Quick Start Guide.</li>
<li>Enhanced PVRTune User Manual and Quick Start Guide.</li>
<li>Enhanced PVRHub User Manual.</li>
</ul>
</div>
</div>
<br>
<div id="FooterMainContainer">
<div id="FooterContainer">
<div class="footerlogo">
<a href="http://www.imgtec.com" target="_blank"><img src="./images/img-footer-logo-grey.png" width="100%" height="100%" /></a>
</div>
<div class="copyright">&copy; Imagination Technologies Limited<br> All rights reserved</div>
</div>
</div>
</body>
</html>
\ No newline at end of file
Documentation/SDKBrowser/style.css 0 → 100644
/*---------------------------------------------------------------*/
/* Global Style
/*---------------------------------------------------------------*/
html,body {width:100%;}
body {
margin: 0px;
font-family: HelvNeuRoman, Arial, Gotham, "Helvetica Neue", Helvetica, sans-serif;
font-size: 13px;
color: #555;
}
h1 {
font-family: HelvNeuMed, Arial, Gotham, "Helvetica Neue", Helvetica, sans-serif;
font-weight: normal;
font-size: 34px;
letter-spacing: -0.01em;
color: #000;
}
h2 {
font-size: 20px;
font-family: HelvNeuBold, Arial, Gotham, "Helvetica Neue", Helvetica, sans-serif;
font-weight: normal;
background-color: #eee;
color: #222;
padding: 15px;
}
h3 {
font-size: 16px;
font-family: HelvNeuRoman, Arial, Gotham, "Helvetica Neue", Helvetica, sans-serif;
font-weight: normal;
color: #222;
}
p {
font-size: 13px;
line-height: 18px;
}
a {
color: #cd239d;
text-decoration: none;
}
a:hover {
color: #555;
}
.content {
max-width: 960px;
position: relative;
margin: 0 auto;
}
.code
{
font-family: monospace;
background-color: #eee;
}
i {
color: #cd239d;
}
.link
{
color: #555;
}
.link:hover
{
color: #cd239d;
}
img {
border: none;
max-width: 100%;
height: auto;
}
table {
margin-top: 20px;
margin-bottom: 20px;
border-bottom: 1px solid #dddddd;
}
th {
background: #eee;
color:#222;
padding: 10px 10px;
text-align: left;
}
table tbody tr:nth-child(even) {
background: #f9f9f9;
}
table tbody td {
color: #555;
padding: 10px 10px;
}
hr {
border: none;
height: 1px;
background: #eaeaea;
margin: 40px 0px 0px 0px;
display: block;
}
/*---------------------------------------------------------------*/
/* Header
/*---------------------------------------------------------------*/
#GlobalHeaderContainer {
background: #4f1455; /* Old browsers */
/* IE9 SVG, needs conditional override of 'filter' to 'none' */
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzRmMTQ1NSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMzMDBiMzMiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
background: -moz-linear-gradient(top, #4f1455 0%, #300b33 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#4f1455), color-stop(100%,#300b33)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #4f1455 0%,#300b33 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #4f1455 0%,#300b33 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #4f1455 0%,#300b33 100%); /* IE10+ */
background: linear-gradient(to bottom, #4f1455 0%,#300b33 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4f1455', endColorstr='#300b33',GradientType=0 ); /* IE6-8 */
}
#GlobalHeader {
max-width: 960px;
height: 83px;
margin: 0px auto;
display: block;
overflow: hidden;
}
#GlobalHeader .logo {
float: left;
margin-top: 20px;
}
#GlobalHeader .sitetitle {
font-family: HelvNeuMed, Arial, Gotham, "Helvetica Neue", Helvetica, sans-serif;
font-weight: normal;
font-size: 34px;
letter-spacing: -0.01em;
color: white;
float: right;
margin-top: 20px;
}
/*---------------------------------------------------------------*/
/* Tab Navigation
/*---------------------------------------------------------------*/
#NavContainer {
width: 100%;
background-color: #650f4d;
border-top: 1px solid #300b33;
}
nav {
width: 960px;
margin: 0px auto;
min-height: 41px;
border-left: 1px solid #510c3e;
}
nav .navlink {
float: left;
font-family: HelvNeuRoman, Arial, Gotham, "Helvetica Neue", Helvetica, sans-serif;
font-weight: normal;
font-size: 13px;
text-decoration: none;
border-left: 1px solid #75275f;
border-right: 1px solid #510c3e;
position: relative;
height: 41px;
}
.navlink:hover {
background-color: #fff;
color: #222;
box-shadow: 0 -5px 0 #cd2da0;
}
.navlink a {
color: #fff;
text-decoration: none;
display: block;
padding: 12px 15px 3px 15px !important;
height: 41px;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
}
.navlink:hover a {
color: #222;
}
.navlink a.current {
background-color: #300b33;
color: #fff;
box-shadow: 0 -5px 0 #cd2da0;
}
.navlink:hover a.current {
background-color: #fff;
color: #222;
box-shadow: 0 -5px 0 #cd2da0;
}
/* Subnavigation Styles */
#SubNavContainer {
width: 100%;
background-color: #650f4d;
border-top: 1px solid #fff;
}
nav .subnavlink {
float: left;
font-family: HelvNeuRoman, Arial, Gotham, "Helvetica Neue", Helvetica, sans-serif;
font-weight: normal;
font-size: 13px;
text-decoration: none;
border-left: 1px solid #75275f;
border-right: 1px solid #510c3e;
position: relative;
height: 41px;
}
.subnavlink:hover {
background-color: #fff;
color: #222;
/*box-shadow: 0 -5px 0 #cd2da0;*/
}
.subnavlink a {
color: #fff;
text-decoration: none;
display: block;
padding: 12px 15px 3px 15px !important;
height: 41px;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
}
.subnavlink:hover a {
color: #222;
}
.subnavlink a.current {
background-color: #300b33;
color: #fff;
/*box-shadow: 0 -5px 0 #cd2da0;*/
}
.subnavlink:hover a.current {
background-color: #fff;
color: #222;
/*box-shadow: 0 -5px 0 #cd2da0;*/
}
/*---------------------------------------------------------------*/
/* Footer
/*---------------------------------------------------------------*/
#FooterMainContainer {
width: 100%;
background-color: #F9F9F9;
border-bottom: 10px solid #999;
border-top: 1px solid #e4e4e4
}
#FooterContainer {
max-width: 960px;
height: 100px;
margin: 0px auto;
padding-bottom: 20px;
}
#FooterContainer .footerlogo {
float: right;
margin-top: 20px;
}
#FooterContainer .copyright {
font-family: HelvNeuMed, Arial, Gotham, "Helvetica Neue", Helvetica, sans-serif;
font-weight: normal;
letter-spacing: -0.01em;
color: #999;
float: right;
text-align: right;
margin-top: 60px;
margin-right: -136px;
}
/*---------------------------------------------------------------*/
/* General styles for Examples page
/*---------------------------------------------------------------*/
/* Style for the thumbnail of each example */
img.examplesmall
{
float:left;
width: 100px;
height: 75px;
margin-right: 10px;
margin-left: 10px;
}
/* Style for the title section of each example */
.title {
/*background-color: #eee;*/
max-width: 960px;
min-height: 85px;
margin-bottom: 10px;
}
/* Style to use for the full description section of each example */
.FullDescription {
display: none;
border-left: 10px solid #fff;
border-right: 10px solid #fff;
border-bottom: 10px solid #fff;
}
/* Styling the checkbox approach used to simulate a click event */
input[type=checkbox] {
position: absolute;
margin-left: -10px;
display: none;
}
/* Style for the label of each checkbox */
label {
display: block;
cursor: pointer;
}
/* Style for displaying the full description section of each example */
input[type=checkbox]:checked ~ .FullDescription {
display: block;
}
/*---------------------------------------------------------------*/
/* Accordion
/*---------------------------------------------------------------*/
/* Adjusting the position of the full accordion */
ul.accordion {
margin: 0px;
padding: 0px;
}
/* Add bottom border to separate each list item populated within the accordion */
ul.accordion > li {
list-style: none;
margin: 0;
padding: 0;
border-bottom: 3px solid #eee;
}
/* The last child in the list does not have the bottom border */
ul.accordion > li:last-child {
border-bottom: none;
}
/* Sets the margin of h3 to be zero when h3 is used in a list item within the accordion. This aligns the top of the example title with its thumbnail */
ul.accordion > li > div.title h3 {
margin: 0;
}
/* Adjusting the top padding dimension so that example list appears evenly spaced out */
ul.accordion > li > div.title {
padding-top: 17px;
}
/* Toggle the purple colour on hovering over the title of each example */
ul.accordion > li > div.title h3:hover {
color: #cd239d;
}
/*---------------------------------------------------------------*/
/* General styles for Utilities page
/*---------------------------------------------------------------*/
/* Float the utility image to the left */
.utility img{
float: left;
padding-right: 20px;
}
/* Adjusting the position of the list of utilities*/
ul.utility {
margin: 0px;
padding: 0px;
}
/* Add bottom border to separate each list item populated within the list */
ul.utility > li {
list-style: none;
margin: 0;
padding: 0;
border-bottom: 3px solid #eee;
min-height: 200px;
}
/* The last child in the list does not have the bottom border */
ul.utility > li:last-child {
border-bottom: none;
}
/*---------------------------------------------------------------*/
/* Media Queries. These are used for making the page responsive to different screen sizes.
/*---------------------------------------------------------------*/
@media screen and (max-width:720px) {
#GlobalHeader .logo {
display: none;
}
#GlobalHeader .sitetitle {
float: left;
}
#FooterContainer .footerlogo {
float: left;
}
#FooterContainer .copyright {
float: left;
text-align: left;
margin-left: -136px;
}
}
@media screen and (max-width:480px) {
nav {
overflow: hidden;
padding-top: 5px;
}
nav .navlink {
float: center;
}
nav .subnavlink {
float: center;
}
}
@media (max-width: 370px) {
#GlobalHeader .sitetitle {
font-size: 20px;
text-align: center;
margin-top: 30px;
}
}
@media (max-width: 223px) {
#GlobalHeader .sitetitle {
margin-top: 20px;
}
}
SDKBrowser.html 0 → 100644
<META HTTP-EQUIV="Refresh" CONTENT="0; URL=./Documentation/SDKBrowser/Home.html">
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment