Silverlight 3 Shader Effects

Jeff Klawiter — Wed, 18 Mar 2009 23:41:54 GMT

With the release of Silverlight 3 Beta we can now run PixelShader effects on any control. This can produce some powerful stuff as shown during the Mix 09 Keynote this morning. I delved in as fast as I could to find out how to make your own and work with them in VS.

I downloaded the WPF shader library from http://wpffx.codeplex.com/ . I only imported the ShaderEffectLibrary so far, I have not tried the transition one.

I simply copied the EffectFiles, ShaderSource and EffectLibrary.cs files into my project and tried to compile. Issues I ran into

UIPropertyMetadata needs to be replaced with PropertyMetadata
Color.FromScRgb needs to be replaced with Color.FromArgb and it's inputs run through Convert.ToByte
MagnifyEffect.cs and SwirlEffect.cs reference classes that do not exist in Silverlight like the Vector class. I could have got them from reflector but in sake of time I didn't (that and being able to release this code)
Getting the ps resources required a minor change to the Global static class. Basically changing the path to do a Relative URI lookup.

The basics here for doing your own shader effects is included save 1 thing. You need the DirectX SDK to compile your HLSL code. You can add a new build event or do it from the commandline. This is a good tutorial on how to do it http://windowsclient.net/wpf/wpf35/wpf-35sp1-hlsl-primer.aspx.

So the basics of doing your own Pixel shader in Silverlight is damn near identical as WPF. You inherit from the ShaderEffect class, load your compiled HLSL bytecode resource and expose any properties you need to modify as dependency properties.

Attached is my ugly but working example. I couldn't find anyway to bind to properties on an effect so I had to just do it by event.

SlShaderEffectDemo.zip

Where did the time go? - Silverlight 3

Silverlight 3 Shader Effects