Color overlaying algorithm

Question

I'm looking for an algorithm to overlay a color on top of existing picture. Something similar to the following app (wall painter): http://itunes.apple.com/us/app/wall-painter/id396799182?mt=8

I want a similar functionality so I can paint walls in an existing picture and change them to a different color.

I can work both in yuv or rgb mode.

Answer 1

To successfully paint the walls in a picture, you have to do two steps:

1. Find the boundary of the wall within the picture (select the part of the image to be colored)

2. Apply the desired color to the selected area

The first step is the hard part. It similar to what Photoshop's magic wand tool would do. And indeed a search for magic wand algorithm turns up a few good articles such as this article with Objective-C code.

The second step is much easier and can be achieve with CGContextSetBlendMode and CGContextDrawImage.

Answer 2

You could try drawing into a graphics context with kCGBlendModeColor. From the documentation:

Uses the luminance values of the background with the hue and saturation values of the source image. This mode preserves the gray levels in the image. You can use this mode to color monochrome images or to tint color images.

Experimenting with other blend modes might also do the trick. See the documentation for details (search for "kCGBlendMode").

Answer 3

The RGB and YUV color models are not really great for changing colors in this way. I think the best color model for this is HLS.

Link: RGB to HLS and HLS to RGB conversion source code

• H (hue) will change the base color
• L (luminance) will change the brightness
• S (saturation) will change the amount of color

You can evaluate the effect of these three components in a photo editing app, like Photoshop of The GIMP.