Calculation of the "average" of two colors

Question

This is only minor programming related - it has much more w / colors features and their presentation.

I am working on a very low level application. I have an array of bytes in memory. These are characters. They were processed by smoothing: they have values ​​from 0 to 255, 0 are completely transparent and 255 are completely opaque (alpha, if you want).

I had a problem developing an algorithm to render this font. I do the following for each pixel:

// intensity is the weight I talked about: 0 to 255 intensity = glyphs[text[i]][x + GLYPH_WIDTH*y]; if (intensity == 255) continue; // Don't draw it, fully transparent else if (intensity == 0) setPixel(x + xi, y + yi, color, base); // Fully opaque, can draw original color else { // Here the tricky part // Get the pixel in the destination for averaging purposes pixel = getPixel(x + xi, y + yi, base); // transfer is an int for calculations transfer = (int) ((float)((float) (255.0 - (float) intensity/255.0) * (float) color.red + (float) pixel.red)/2); // This is my attempt at averaging newPixel.red = (Byte) transfer; transfer = (int) ((float)((float) (255.0 - (float) intensity/255.0) * (float) color.green + (float) pixel.green)/2); newPixel.green = (Byte) transfer; // transfer = (int) ((float) ((float) 255.0 - (float) intensity)/255.0 * (((float) color.blue) + (float) pixel.blue)/2); transfer = (int) ((float)((float) (255.0 - (float) intensity/255.0) * (float) color.blue + (float) pixel.blue)/2); newPixel.blue = (Byte) transfer; // Set the newpixel in the desired mem. position setPixel(x+xi, y+yi, newPixel, base); } 

Results, as you can see, are less desirable. This is a very large image, on a 1: 1 scale, it looks like the text has a green “aura”.

Any idea on how to calculate this correctly would be greatly appreciated.

Thank you for your time!

Answer 1

You need to mix the background and foreground colors. A la:

 pixelColour = newColour * intensity + backgroundColour * (1 - intensity) 

By the way, this is a very slow way to render and mix fonts. Instead, you should display all the font characters on the screen surface with all the necessary properties, and then use this as a texture to render to other surfaces when you need text.

Edit:

It doesn’t look like this:

 (255.0 - (float) intensity/255.0) 

It should be:

 (255.0 - (float) intensity)/255.0 

Answer 2

I believe that the "aura" is caused by smoothing. A technique averages pixels with its neighbors.

I understand that you don't seem to be using OpenGL, but this chapter may help explain some of the theories. I wish I had the best answer, but I hope this indicates that you are in the right direction. My first attempt would be to disable Antialiasing, as it seems to do more harm than good. There is probably a better solution than this.

Answer 3

It may be too difficult to perform pixel-by-pixel alpha blending because the current pixel value changes the value of the next pixel.

I would rethink the lateral mixing algorithm.

---

With many getPixel calling to the same glyph, you cannot create the correct target image.