C# How to: Bitmap Colour Shading

Article Purpose

The objective of this article is focussed on exploring the concept of applying to images. The various Bitmap manipulation operations detailed in this article are all exclusively implemented by processing raw pixel data. No traditional GDI+ drawing operations are required in implementing .

Processor10 Processor11 Processor12 Processor13

Sample source code

This article is accompanied by a sample source code Visual Studio project which is available for download here.

Download Sample Source Code

Processor5 Processor6 Processor7 Processor9

Using the sample Application

This article has been written from a practical implementation point of view. The concepts detailed throughout this article are all coupled with a corresponding source code implementation. A sample application has been provided with this article. The  sample application has been implemented in the architecture of a , of which a complete source code implementation has also been provided. The sample application facilitates implementing and testing the concepts surrounding as discussed in this article.

Processor31 Processor22 Processor16 Processor47

In using the Bitmap Shading sample application users have the ability to select a source/input from the local file system. The user interface facilitates implementing through three trackbar controls, each associated with a  colour component. The value range of each trackbar control is defined from 0 to 100 inclusive. A value of 100 equates to no change and a value of 0 equating to the most possible change.

Processor51 Processor50 Processor49 Processor57

Users are able to save to the local file system any modified images by clicking the ‘Save Image’ button and providing a file path and file name.

The screenshot below illustrates the Bitmap Shading application in action:


BitmapShading_Screenshot

Processor25 Processor24 Processor23 Processor22

The ColorShade Extension method

The ColorShade extension method forms the crux of this article. The ColorShade method has been defined as an extension method targeting the class. It is within this method that all raw pixel manipulation occurs. In essence each pixel expressed by the specified image will be extracted upon which calculations are performed updating the value of Alpha, Red, Green and Blue colour components.

Processor28 Processor29 Processor30 Processor31

The following code snippet details the implementation of the ColorShade extension method:

 public static Bitmap ColorShade(this Bitmap sourceBitmap, float blueShade, 
                                float greenShade, float redShade) 
{
    BitmapData sourceData = sourceBitmap.LockBits(new Rectangle(0, 0, 
                            sourceBitmap.Width, sourceBitmap.Height), 
                            ImageLockMode.ReadOnly, PixelFormat.Format32bppArgb); 

byte[] pixelBuffer = new byte[sourceData.Stride * sourceData.Height];
Marshal.Copy(sourceData.Scan0, pixelBuffer, 0, pixelBuffer.Length);
sourceBitmap.UnlockBits(sourceData);
float blue = 0; float green = 0; float red = 0;
for (int k = 0; k + 4 < pixelBuffer.Length; k += 4) { blue = pixelBuffer[k] * blueShade; green = pixelBuffer[k + 1] * greenShade; red = pixelBuffer[k + 2] * redShade;
if (blue < 0) { blue = 0; }
if (green < 0) { green = 0; }
if (red < 0) { red = 0; }
pixelBuffer[k] = (byte)blue; pixelBuffer[k + 1] = (byte)green; pixelBuffer[k + 2] = (byte)red; }
Bitmap resultBitmap = new Bitmap(sourceBitmap.Width, sourceBitmap.Height);
BitmapData resultData = resultBitmap.LockBits(new Rectangle(0, 0, resultBitmap.Width, resultBitmap.Height), ImageLockMode.WriteOnly, PixelFormat.Format32bppArgb);
Marshal.Copy(pixelBuffer, 0, resultData.Scan0, pixelBuffer.Length); resultBitmap.UnlockBits(resultData);
return resultBitmap; }
Processor26 Processor1 Processor51 Processor24

In order to manipulate pixel colour component values directly we first need to lock the source into memory by invoking the method. Once the source is locked into memory we can copy the underlying pixel buffer using the method.

Processor39 Processor13 Processor64 Processor16

The next step involves iterating through the buffer of colour components. Notice how each iteration modifies an entire pixel by iterating by 4. The formula being implemented can be expressed as:

R = R1 * RS

G = G1 * GS

B = B1 * BS

In the stated equation R1 G1 and B1 represents the original value of a colour component and RS GS and BS equates to the percentage of shading expressed by each colour component. Take note that in this scenario shading percentages are defined in terms of a fractional value. As an example 45% would result in a shading factor of 0.45.

Processor59 Processor60 Processor61 Processor62

Sample Images

The original image file used in this article was authored by Konstantin Lanzet and is licensed under the Creative Commons Attribution-Share Alike 3.0 Unported license, and can be downloaded from Wikipedia.

The Original Image

KL_Intel_D8086

Colour Shaded Images

Processor6
Processor11
Processor38
Processor20
Processor22
Processor31

Related Articles

39 Responses to “C# How to: Bitmap Colour Shading”



  1. 1 C# How to: Bitmap Colour Tint | Software by Default Trackback on April 26, 2013 at 1:07 AM
  2. 2 C# How to: Bitwise Bitmap Blending | Software by Default Trackback on April 26, 2013 at 1:13 AM
  3. 3 C# How to: Image Contrast | Software by Default Trackback on April 26, 2013 at 1:16 AM
  4. 4 C# How to: Image Solarise | Software by Default Trackback on April 26, 2013 at 1:17 AM
  5. 5 C# How to: Bi-tonal Bitmaps | Software by Default Trackback on April 26, 2013 at 1:21 AM
  6. 6 C# How to: Bitmap Colour Balance | Software by Default Trackback on April 26, 2013 at 1:23 AM
  7. 7 C# How to: Image Arithmetic | Software by Default Trackback on April 27, 2013 at 8:21 AM
  8. 8 C# How to: Image Convolution | Software by Default Trackback on May 1, 2013 at 5:42 PM
  9. 9 C# How to: Image filtering implemented using a ColorMatrix | Software by Default Trackback on May 1, 2013 at 9:04 PM
  10. 10 C# How to: Blending Bitmap images using colour filters | Software by Default Trackback on May 1, 2013 at 10:50 PM
  11. 11 C# How to: Decoding/Converting Base64 strings to Bitmap images | Software by Default Trackback on May 2, 2013 at 9:35 PM
  12. 12 C# How to: Image Edge Detection | Software by Default Trackback on May 11, 2013 at 1:23 PM
  13. 13 C# How to: Difference Of Gaussians | Software by Default Trackback on May 18, 2013 at 12:50 AM
  14. 14 C# How to: Image Median Filter | Software by Default Trackback on May 18, 2013 at 4:16 AM
  15. 15 C# How to: Image Unsharp Mask | Software by Default Trackback on May 18, 2013 at 12:18 PM
  16. 16 C# How to: Image Colour Average | Software by Default Trackback on May 18, 2013 at 9:48 PM
  17. 17 C# How to: Image Erosion and Dilation | Software by Default Trackback on May 19, 2013 at 10:24 AM
  18. 18 C# How to: Morphological Edge Detection | Software by Default Trackback on May 25, 2013 at 8:22 AM
  19. 19 C# How to: Boolean Edge Detection | Software by Default Trackback on June 1, 2013 at 2:09 AM
  20. 20 C# How to: Gradient Based Edge Detection | Software by Default Trackback on June 1, 2013 at 4:46 PM
  21. 21 C# How to: Image Cartoon Effect | Software by Default Trackback on June 2, 2013 at 4:13 PM
  22. 22 C# How to: Sharpen Edge Detection | Software by Default Trackback on June 7, 2013 at 5:11 AM
  23. 23 C# How to: Calculating Gaussian Kernels | Software by Default Trackback on June 8, 2013 at 10:58 AM
  24. 24 C# How to: Image Blur | Software by Default Trackback on June 9, 2013 at 10:19 PM
  25. 25 C# How to: Image Transform Rotate | Software by Default Trackback on June 16, 2013 at 10:40 AM
  26. 26 C# How to: Image Transform Shear | Software by Default Trackback on June 16, 2013 at 5:45 PM
  27. 27 C# How to: Compass Edge Detection | Software by Default Trackback on June 22, 2013 at 9:34 PM
  28. 28 C# How to: Oil Painting and Cartoon Filter | Software by Default Trackback on June 30, 2013 at 10:47 AM
  29. 29 C# How to: Stained Glass Image Filter | Software by Default Trackback on June 30, 2013 at 10:50 AM
  30. 30 C# How to: Generate a Web Service from WSDL | Software by Default Trackback on June 30, 2013 at 4:07 PM
  31. 31 C# How to: Bitmap Colour Substitution implementing thresholds | Software by Default Trackback on July 6, 2013 at 4:33 PM
  32. 32 C# How to: Swapping Bitmap ARGB Colour Channels | Software by Default Trackback on July 6, 2013 at 5:01 PM
  33. 33 C# How to: Image filtering by directly manipulating Pixel ARGB values | Software by Default Trackback on July 8, 2013 at 2:57 AM
  34. 34 C# How to: Image ASCII Art | Software by Default Trackback on July 14, 2013 at 7:22 AM
  35. 35 C# How to: Weighted Difference of Gaussians | Software by Default Trackback on July 14, 2013 at 8:11 PM
  36. 36 C# How to: Image Boundary Extraction | Software by Default Trackback on July 21, 2013 at 10:23 AM
  37. 37 C# How to: Image Abstract Colours Filter | Software by Default Trackback on July 28, 2013 at 7:41 PM
  38. 38 C# How to: Fuzzy Blur Filter | Software by Default Trackback on August 9, 2013 at 6:39 AM
  39. 39 C# How to: Image Distortion Blur | Software by Default Trackback on August 9, 2013 at 10:13 PM

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s




about.me :: Dewald Esterhuizen

Dewald Esterhuizen

Blog Stats

  • 172,810 hits

Gravatar :: Dewald Esterhuizen

SoftwareByDefault QR Code

SoftwareByDefault QR Code

I review for the O'Reilly Blogger Review Program

Enter your email address to follow and receive notifications of new posts by email.

Join 152 other followers

Archives

Twitter feed

RSS SoftwareByDefault on MSDN

  • An error has occurred; the feed is probably down. Try again later.

del.icio.us Links

http://softwarebydefault.com
http://softwarebydefault.com
http://softwarebydefault.com
http://softwarebydefault.com
http://softwarebydefault.com

Follow

Get every new post delivered to your Inbox.

Join 152 other followers

%d bloggers like this: