Flash Player 10 came with a set of new classes to load and use Pixel Bender files in our Flash applications. In this tutorial we'll take a look at Pixel bender syntax and how to write your own Pixel Bender files. We will also see how to load Pixel Bender files in Flash and use them in different ways.

First if you still did not download the Pixel Bender Toolkit you should do so here. The Pixel Bender Toolkit comes with a set of Pixel Bender filters so feel free to study them to get a better understanding of Pixel Bender syntax. You can also search the web to find additional Pixel Bender filters.

In this tutorial we'll create some simple filters with the Pixel Bender Toolkit and later on we'll use some existing ones so let's get started.

Start the Pixel Bender toolkit and choose "New Kernel", a complete new working kernel file is automaticaly created for you. You can already run this filter, you'll probably be prompted to load a picture and after doing so, the filter will be running. Of course the only thing this filter is doing so far is copy each pixels from the base image into the output image so that's not that usefull but let's take a look anyway. First you have the kernel description:

kernel NewFilter
< namespace : "Your Namespace";
vendor : "Your Vendor";
version : 1;
description : "your description";

You can give a name to your filter here as well as other information like the version of this filter, a description and so on. Next:

input image4 src;
output pixel4 dst;

You specify an input of type image4 (4 channels) and a name "src". The filter will use this input as a base. You also specify an output of type pixel4 (4 channels) and a name "dst". The filter will pass the result of its calculation to this ouput. Then:

dst = sampleNearest(src,outCoord());

This function (evaluatePixel) will run once for each element (pixel) in your input data. The sampleNearest method is returning a pixel value and this pixel value is assigned to the "dst" output. The sampleNearest method takes a source (in our case an image4 source), and a set of coordinate (outCoord() returns the coordinates of the current element or pixel). If you pass an image4 you get back a pixel4 value, if you were to pass an image3, you would get a pixel3 and so on. The number determines how many values you get or have to set for example:

float myfloat = 1.0;//one value
float2 myotherfoat = float2(1.0,1.0);//two values
float3 mythreefoat = float3(1.0,1.0,1.0);//three values
float4 myfourfoat = float4(1.0,1.0,1.0,1.0);//four values

Casting is possible of course if type are compatible like from int to float for example. Obviously if you try to pass a pixel 3 to an image4 you'll get yourself an error so just be aware of that. Let's modify our code so our output looks different:

dst = pixel4(sin(float4(sampleNearest(src,outCoord()))));

You should get a slight alteration of your picture lightness. You probably know the sin method already and what it does. Here we casted our sampleNearest result into a float4 (so we casted from pixel4 to float4) so we could apply the sin method, then of course we casted back to pixel4 so we could assign the result into our output. Already you can experiment with the numerous math methods and see what result you get. try this one for example:

dst = pixel4(sqrt(float4(sampleNearest(src,outCoord()))));

Moreover we could separate each pixels and apply some calculation on each one of them:

pixel4 temp = sampleNearest(src,outCoord());
dst = temp;

Back to the beginning but here we have our pixels stored in a variable so we can access them individually so let's do that now:

pixel4 temp = sampleNearest(src,outCoord());
temp.r = 0.0;
dst = temp;

Here we basically turned off the red channel so all red is gone from our picture. You could apply numerous math operation on these pixels and get some amazing result. Of course your level in math will determine your ability to create complex filters but this is for you to discover. Now it's time to take a look at what we can do with Pixel Bender filters in Flash and as we go we'll look at more Pixel Bender code of course.