Difference between revisions of "3D Fundamentals Tutorial 9"

From Chilipedia
Jump to: navigation, search
(→‎Video)
(→‎Video)
 
(12 intermediate revisions by the same user not shown)
Line 4: Line 4:
  
 
The tutorial video is on YouTube [https://youtu.be/pef2405M-os here].
 
The tutorial video is on YouTube [https://youtu.be/pef2405M-os here].
−
 
 
<div class="mw-collapsible mw-collapsed"><br />
 
<div class="mw-collapsible mw-collapsed"><br />
 
* What  is a Pixel Shader and why is it used? [https://youtu.be/pef2405M-os?t=0m20s 0:20]
 
* What  is a Pixel Shader and why is it used? [https://youtu.be/pef2405M-os?t=0m20s 0:20]
Line 12: Line 11:
 
:* These functors determine the color of the pixel based on their input
 
:* These functors determine the color of the pixel based on their input
 
</div>
 
</div>
−
* Refactoring of the <code>gfx.PutPixel(...)</code> function in <code>Pipeline.h<code> [https://youtu.be/pef2405M-os?t=2m04s 2:04]
+
* Refactoring of the <code>gfx.PutPixel(...)</code> function in <code>Pipeline.h</code> [https://youtu.be/pef2405M-os?t=2m04s 2:04]
 +
<div class="mw-collapsible-content">
 
:* This is where we are ultimately determining the color of the pixel
 
:* This is where we are ultimately determining the color of the pixel
 
:* Inside the PutPixel function, we want to call a shader object that defines the coloring behavior
 
:* Inside the PutPixel function, we want to call a shader object that defines the coloring behavior
−
* Implementation of the programmable pixel shader stage in the pipeline [https://youtu.be/pef2405M-os?t=3m11s 3:11]
+
</div>
 +
* Implementation of the programmable Pixel Shader in the rendering pipeline [https://youtu.be/pef2405M-os?t=3m11s 3:11]
 +
<div class="mw-collapsible-content">
 
:* We template the pipeline class on an <code><class Effect></code>
 
:* We template the pipeline class on an <code><class Effect></code>
 
:* We will adjust the definition of the <code>Vertex</code> class depending on what effect we are using
 
:* We will adjust the definition of the <code>Vertex</code> class depending on what effect we are using
−
:* We  adjust the PutPixel call as:
+
:* We  adjust <code>gfx.PutPixel(...)</code> to take a pixel shader object, and call the function operator with the interpolated Vertex data:
−
::  
+
::<syntaxhighlight lang="cpp" line>
−
* ... [https://youtu.be/pef2405M-os?t=0m20s 0:20]
+
gfx.PutPixel( x,y,effect.ps( iLine ) );
−
* ... [https://youtu.be/pef2405M-os?t=0m20s 0:20]
+
</syntaxhighlight>
−
* ... [https://youtu.be/pef2405M-os?t=0m20s 0:20]
+
:* Changes to the <code>Pipeline</code> class [https://youtu.be/pef2405M-os?t=5m37s 5:37]
−
* ... [https://youtu.be/pef2405M-os?t=0m20s 0:20]
+
::- The <code>Pipeline</code> object now holds an <code>Effect</code> object (which holds all shader data and methods)
−
* ... [https://youtu.be/pef2405M-os?t=0m20s 0:20]
+
::- Coding the <code>Effect</code> class [https://youtu.be/pef2405M-os?t=6m03s 6:03]
−
* ... [https://youtu.be/pef2405M-os?t=0m20s 0:20]
+
::- Coding the <code>PixelShader</code> class [https://youtu.be/pef2405M-os?t=6m22s 6:22]
−
* ... [https://youtu.be/pef2405M-os?t=0m20s 0:20]
+
:* Putting it all together in a new <code>CubeSkinScene.h</code> class [https://youtu.be/pef2405M-os?t=7m26s 7:26]
−
* ... [https://youtu.be/pef2405M-os?t=0m20s 0:20]
+
::- The code now renders the same scene, but has become completely configurable
−
 
+
</div>
 +
* Making a new <code>Effect</code>: Color Blending [https://youtu.be/pef2405M-os?t=8m31s 8:31]
 +
<div class="mw-collapsible-content">
 +
:* The <code>VertexColorEffect</code> functor will not hold a texture and return interpolated texture coordinates
 +
:* Instead, it interpolates colors operating on a <code>Vec3</code> object that holds RGB values (we encode the Vertex colors as floats)
 +
:* Cube definition now needs to hold color data of each Vertex [https://youtu.be/pef2405M-os?t=10m07s 10:07]
 +
:* We need a conversion operator and a conversion constructor to translate between the <code>Vec3</code> and <code>Color</code> representation of colors [https://youtu.be/pef2405M-os?t=11m12s 11:12]
 +
:* Changes to the <code>Pipeline</code> class: generalizing Vertex transformations (independent of the pixel shader effect) [https://youtu.be/pef2405M-os?t=11m45s 11:45]
 +
:* Adding a static function <code>GetPlain()</code> in <code>Cube.h</code> to get the Vertex colors [https://youtu.be/pef2405M-os?t=13m39s 13:39]
 +
::
 +
::<syntaxhighlight lang="cpp" line>
 +
template<class V>
 +
static IndexedTriangleList<V> GetPlain(float size = 1.0f)
 +
{...}
 +
</syntaxhighlight>
 +
:* Coding the scene class <code>CubeVertexColorScene.h</code> [https://youtu.be/pef2405M-os?t=14m13s 14:13]
 +
</div>
 +
* Making a new <code>Effect</code>: Solid Colors [https://youtu.be/pef2405M-os?t=14m47s 14:47]
 +
<div class="mw-collapsible-content">
 +
:* Need to address the issue: we can't store color data in the 8 unique cube vertices
 +
:* Solution: make the faces of the cube independent (no shared vertices) [https://youtu.be/pef2405M-os?t=16m22s 16:22]
 +
::- This requires 6 faces x 4 vertices per face = 24 vertices
 +
:* Definition of <code>SolidEffect.h</code> (without interpolation of colors)
 +
:* Adding a static function <code>GetPlainIndependentFaces()</code> to <code>Cube.h</code> to get the 24 vertices [https://youtu.be/pef2405M-os?t=18m15s 18:15]
 +
:* Demo [https://youtu.be/pef2405M-os?t=19m19s 19:19]
 +
</div>
 +
* Reflections on our approach to Pixel Shading [https://youtu.be/pef2405M-os?t=19m58s 19:58]
 +
<div class="mw-collapsible-content">
 +
:* With our approach, the sky is the limit in terms of adding options/effects to the Pixel Shader
 +
:* However, because the whole pipeline is templated, each effect requires a pipeline
 +
::- Adantage of using templates: enables aggressive inlining / compiler optimization
 +
::- Disadvantage: we can't switch effects easily at runtime
 +
:* There are differences between this approach and how Hardware 3D APIs (like Direct3D and OpenGL) implement this flexibility
 +
::- These let you switch components (e.g. by binding a different shader dynamically)
 +
::- Another difference: use of texturing units seperate from the shader object [https://youtu.be/pef2405M-os?t=21m14s 21:14]
 +
</div>
 
</div>
 
</div>
  

Latest revision as of 04:28, 4 June 2020

In this tutorial we incorporate our first shader stage into the 3D pipeline: the pixel shader stage. We also explore some basic example pixel shaders (more heavy-duty stuff to come later).

Video

The tutorial video is on YouTube here.


  • What is a Pixel Shader and why is it used? 0:20
  • We want to make color mapping of the triangles in the rendering pipeline configurable
  • One way is to use templated function objects (functors) as "plug-in" code
  • These functors determine the color of the pixel based on their input
  • Refactoring of the gfx.PutPixel(...) function in Pipeline.h 2:04
  • This is where we are ultimately determining the color of the pixel
  • Inside the PutPixel function, we want to call a shader object that defines the coloring behavior
  • Implementation of the programmable Pixel Shader in the rendering pipeline 3:11
  • We template the pipeline class on an <class Effect>
  • We will adjust the definition of the Vertex class depending on what effect we are using
  • We adjust gfx.PutPixel(...) to take a pixel shader object, and call the function operator with the interpolated Vertex data:
gfx.PutPixel( x,y,effect.ps( iLine ) );
  • Changes to the Pipeline class 5:37
- The Pipeline object now holds an Effect object (which holds all shader data and methods)
- Coding the Effect class 6:03
- Coding the PixelShader class 6:22
  • Putting it all together in a new CubeSkinScene.h class 7:26
- The code now renders the same scene, but has become completely configurable
  • Making a new Effect: Color Blending 8:31
  • The VertexColorEffect functor will not hold a texture and return interpolated texture coordinates
  • Instead, it interpolates colors operating on a Vec3 object that holds RGB values (we encode the Vertex colors as floats)
  • Cube definition now needs to hold color data of each Vertex 10:07
  • We need a conversion operator and a conversion constructor to translate between the Vec3 and Color representation of colors 11:12
  • Changes to the Pipeline class: generalizing Vertex transformations (independent of the pixel shader effect) 11:45
  • Adding a static function GetPlain() in Cube.h to get the Vertex colors 13:39
template<class V>
static IndexedTriangleList<V> GetPlain(float size = 1.0f)
{...}
  • Coding the scene class CubeVertexColorScene.h 14:13
  • Making a new Effect: Solid Colors 14:47
  • Need to address the issue: we can't store color data in the 8 unique cube vertices
  • Solution: make the faces of the cube independent (no shared vertices) 16:22
- This requires 6 faces x 4 vertices per face = 24 vertices
  • Definition of SolidEffect.h (without interpolation of colors)
  • Adding a static function GetPlainIndependentFaces() to Cube.h to get the 24 vertices 18:15
  • Demo 19:19
  • Reflections on our approach to Pixel Shading 19:58
  • With our approach, the sky is the limit in terms of adding options/effects to the Pixel Shader
  • However, because the whole pipeline is templated, each effect requires a pipeline
- Adantage of using templates: enables aggressive inlining / compiler optimization
- Disadvantage: we can't switch effects easily at runtime
  • There are differences between this approach and how Hardware 3D APIs (like Direct3D and OpenGL) implement this flexibility
- These let you switch components (e.g. by binding a different shader dynamically)
- Another difference: use of texturing units seperate from the shader object 21:14

Downloads

The GitHub repository for the tutorial code is here.

See also

Retrieved from "https://wiki.planetchili.net/index.php?title=3D_Fundamentals_Tutorial_9&oldid=3281"