[RESOLVED] Color Matrix and Transparency in Images

Ok. I'm creating a "Custom" Panel to serve in displaying images. The purpose of this is to allow the developer to add a "BackImage" and a "Front Image" and then allow them to tweak the Transparency for both the Front Image, Back Image and then the combined images overall.

The way I've got the code set up is to Buffer the BackImage, Buffer the Front Images....Draw both of those images to a single buffer and then draw that "combined" buffer to the control.

Generally, this works just fine. However I'm running into something that I cannot figure out. At design-time, i have properties on my control that can adjust the transparency.... These work just fine. However, at run-time the opacity doesn't really work quite right.

If the "overall" opactiy and "back image" opacity are at 100%, then the front image Opacity works just fine. I can adjust my sliders and it renders as i would have expected. However, if I start tweaking the other sliders for the BackImage and Overall Image, the opacity never changes for those. If i start out at say 10% for all images that no matter if i move the sliders up or down, my images slowly become opaque. And only will the Front image opacity render properly when all other image Alpha levels be at 100%. Very Strange.

Also, if I don't have any back image specified, the front image doesn't change its opacity...

This all did work when i rendered directly to the screen without using a texture brush and buffer. However, when implementing those features to reduce flicker, that is when I started noticing this odd behavior.

I've attached my control and also the implementation of my test harness for review..

I suspect it has to do with the Color Matrix for the individual images....BUT, it works in design time when i set each property in the property grid.. Just not at design time when i adjust my sliders..

Here is how i set my ColorMatrix for each image buffer that gets created...


private ImageAttributes GenerateImageAttributes(int opacity)
{
float[][] ptsArray ={
new float[] {1, 0, 0, 0, 0},
new float[] {0, 1, 0, 0, 0},
new float[] {0, 0, 1, 0, 0},
new float[] {0, 0, 0, (float)((float)opacity/100), 0},
new float[] {0, 0, 0, 0, 1}};

ColorMatrix clrMatrix = new ColorMatrix(ptsArray);


ImageAttributes imgAttributes = new ImageAttributes();
imgAttributes.SetColorMatrix(clrMatrix,ColorMatrixFlag.Default, ColorAdjustType.Bitmap);



return imgAttributes;

}

Ok. I think that i solved the issue. Not sure exactly why it works this way. Maybe someone with more graphic experience can chime in and explain the reasoning... But..

In my Original Post, I put the code files in, so you can reference those.

When creating the Buffer for my "Back Image" and "Front Image", I cannot call the Graphics.Clear() method. It appears to be clearing my buffers or something.. So, I had to add a flag to my method to indicate when i want to clear the graphics...

Code:

---

Bitmap buffer = new Bitmap(imageToUse.Width, imageToUse.Height);
      Graphics g = Graphics.FromImage(buffer);

      if (clearGraphics)
      {
        g.Clear(this.BackColor);
      }

---

Once I've generated my Individual Front and Back Buffers, then I combine them into a single buffer that gets rendered. That is in the CombineBuffers(). Because I wanted an opacity setting for not only the front and back images individually, but overall as a whole image too, I passed in that "Combined" buffer as my "Image to Use" to the CreateBuffer method so I could apply Opacity settings for that "combined Image" too.

When generating that final buffer, that is when i needed to clear the graphics. If i didn't clear the graphics, then the opacity setting didn't seem to work. Seems like it was layering the images or something.