Beginner’s WPF Pixel Shaders.pptVIP

WPF Pixel Shaders Introduction to Nikola Mihaylov, Sep 1, 2008. /nikola What is Pixel Shader? A fantasy creature: male pixie that likes shades Person who likes to cast shadow on computer screens Any of the above All of the above except this answer Not this answer  Pixel Shader Is: A set of software instructions Used to calculate colors of individual pixels on screen Typically executing on the graphics card (Graphics Processing Unit or GPU) Executed very fast on the GPU Primarily used to compute rendering effects Written in shader language, e.g. HLSL – similar to C Can be used for any computation Demo: Grayscale Effect Shader Inputs: Bitmap to be processed (u,v) location of pixel to be processed (u,v) is used instead of (x,y) to mean that the range of values is from 0 to 1 (u,v) is called “texture coordinates” float DesaturationFactor: specifies how much the bitmap is to be saturated Shader Output: pixel color at specified location Grayscale Effect Pixel Shader:grayscale.fx sampler2D implicitInput : register(s0); float factor : register(c0); float4 main(float2 uv : TEXCOORD) : COLOR { float4 color = tex2D(implicitInput, uv); float gray = color.r * 0.3 + color.g * 0.59 + color.b *0.11; float4 result; result.r = (color.r - gray) * factor + gray; result.g = (color.g - gray) * factor + gray; result.b = (color.b - gray) * factor + gray; result.a = color.a; return result; } Input bitmap – sampler register s0 Code-behind: ShaderEffect.RegisterPixelShaderSamplerProperty() Input float in c0 register. Code-behind: PixelShaderConstantCallback(0) Output: R, G, B, A: float4 Color of the pixel at (u,v) Input: (u,v) coordinates of pixel in the bitmap Retrieve pixel color at location (u,v) from bitmap Grayscale code Shader code from /2008/06/grayscale-effect-pixel-shader-effect-in.html Using Shaders in WPF: Overview Install DirectX SDK Create new WPF app and add .fx file containing the shader code Compile .fx file to .ps file. Se