Use ColorToner to make saturation effect

Jul 21, 2009 at 3:38 PM

Hi guys,

I would like to implement saturation effect in my application. As far as I understand, my colorful picture should be rendered as black and white (or grayscale) in case ColorToner effect will be applied as follows:

 <Image.Effect>
<fx:ColorTonerEffect
ColorTonerRedRatio="0"
ColorTonerGreenRatio="0"
ColorTonerBlueRatio="0"/>
</Image.Effect>

However, the picture is rendered as black rectangle in such case. Is that a bug or my assumptions are wrong?

Best regards

Coordinator
Jul 22, 2009 at 8:22 PM
Edited Jul 23, 2009 at 6:44 AM

Hi BorysG,

The ColorToner filter applies a ratio to each rgb component of each pixel by using the following formula :

component = ratio * component

You can see it by looking at the ColorTonerEffect.fx generated file :

float4 main(float2 uv : TEXCOORD) : COLOR
{
    float4 color;
    color = tex2D(Input1, uv);
    color.r *= ColorTonerRedRatio;
    color.g *= ColorTonerGreenRatio;
    color.b *= ColorTonerBlueRatio;
    return color;
}

So if the ratio is zero, the color component is zero. When the r, g and b components are all zero, the resulting image is a black rectangle.

To simulate a hue saturation effect, you could combine a GrayScaler filter and a ColorToner filter in which you can adjust the ratio properties to specify the resulting color :

<pfx:EffectBuilder>
<pfx:GrayScaler FilterName="GrayScaler"/>
<pfx:ColorToner FilterName="ColorToner"/>
</pfx:EffectBuilder>

But we will do some research to bring a real saturation filter.

Olivier

Coordinator
Aug 20, 2009 at 9:45 PM

A new saturation filter, called Saturator, has been added tonight in the source code.

Olivier