VB Image Processing Sample

Download the Image Processing Sample application (107kb)

This sample requires the SSubTmr.DLL component because it includes an implementation of my Progress Bar control. Make sure you have loaded and registered this before trying the HotKey project.

Download the Image Processing Class Only (4kb)

Now VB can compile applications to native code, there are a whole load of new things you can use VB for which were previously all but practical. Image processing is one of them. Image processing code requires a huge number of bytes to be read and parsed (for example, blurring a 24 bit picture of 640x480 resolution requires 23,040,000 multiplications and additions!). Whilst this sort of thing runs at a hopeless crawl in the VB IDE or in p-code, when you compile to native code it can easily run within a second. Cool!

This sample demonstrates a 24 bit image processor, which implements:

• Blurring and softening
• Sharpening
• Unsharp masking (a method of sharpening where you subtract a blurred version of the image from a multiple of the original)
• Embossing
• Customised filters

It operates at blinding speed when compiled to native code, and is easy to adapt to further image processing types, such as erosion, diffusion, count and averaging filters.

Introduction to the Sample
This sample operates directly on the bitmap bits contained within a PictureBox using a technique described in the Black Belt programming section of VBPJ, which also appears in a number of great samples at David Brebner's Unlimited Realities site. Check the code to see how it works.

I have purposely limited this sample to 24 bit images only. This unfortunately means you have to set your display colour depth to 16 bits or higher, since VB refuses to load a picture with 24 bit colour depth in lower display settings (it converts it down to the display colour depth). I will provide another version of this sample later in the year which uses GDI objects to work around this limitation.

Theory of Image Processing
Standard image processing techniques (blurring, sharpening, embossing, edge detection etc) all operate aby applying a matrix to each pixel which in some way modifies the pixel's value accounting for the neighbouring pixels. In this section I will describe how these standard image processing filters work.

Blurring and Smoothing Filters
Blurring or smoothing filers are known as low-pass filters. These filters add a contribution from the neighbouring pixels and reduce the contribution from the pixel itself. Here is an example blurring filter:

&nbsp &nbsp 1/9 &nbsp &nbsp 1/9 &nbsp &nbsp 1/9
&nbsp &nbsp 1/9 &nbsp &nbsp 1/9 &nbsp &nbsp 1/9
&nbsp &nbsp 1/9 &nbsp &nbsp 1/9 &nbsp &nbsp 1/9

So, say we had a red pixel surrounded by blue pixels in a bitmap:

&nbsp &nbsp .. &nbsp &nbsp (0,0,255) &nbsp &nbsp (0,0,255) &nbsp &nbsp (0,0,255) &nbsp &nbsp ..
&nbsp &nbsp .. &nbsp &nbsp (0,0,255) &nbsp &nbsp (255,0,0) &nbsp &nbsp (0,0,255) &nbsp &nbsp ..
&nbsp &nbsp .. &nbsp &nbsp (0,0,255) &nbsp &nbsp (0,0,255) &nbsp &nbsp (0,0,255) &nbsp &nbsp ..
&nbsp &nbsp ..

The result for the centre pixel will be the sum of 1/9 of each of the pixel's values, i.e.

This is a mostly blue purple colour, so the single red value has been blurred by its blue neighbours to a much bluer shade.

Normally, rather than expressing the filter in terms of floating point values (i.e. 1/9), we use integers to express the filter values and then give the filter an integer weight. The integer matrix is used for multiplication and the final values are divided by the weight. So the 3x3 matrix above is written:

&nbsp &nbsp 1 &nbsp &nbsp 1 &nbsp &nbsp 1 &nbsp &nbsp &nbsp Weight: 9
&nbsp &nbsp 1 &nbsp &nbsp 1 &nbsp &nbsp 1
&nbsp &nbsp 1 &nbsp &nbsp 1 &nbsp &nbsp 1

You can modify the filter to blur more by increasing the number of pixels that are sampled in the matrix (e.g. use a 5x5 or 7x7 matrix rather than a 3x3 one) and by increasing the contribution for the pixels surrounding the central one.

To decrerase the blurring effect and get a softening effect, increase the weight of the contribution from the central pixel:

&nbsp &nbsp 1 &nbsp &nbsp 1 &nbsp &nbsp 1 &nbsp &nbsp &nbsp Weight: 18
&nbsp &nbsp 1 &nbsp &nbsp 10 &nbsp &nbsp 1
&nbsp &nbsp 1 &nbsp &nbsp 1 &nbsp &nbsp 1

Sharpening Filters
A sharpening filter, also called a high-pass filter, emphasizes discontinuities in the pixel values by subtracting a contribution from the surrounding pixels from an increased central pixels. This means that when the surrounding pixels are dark, the central pixel is increased in brightness which enhances the edges of an image. A typical sharpening filter looks like this:

&nbsp &nbsp 0 &nbsp &nbsp -1 &nbsp &nbsp 0 &nbsp &nbsp &nbsp Weight: 2
&nbsp &nbsp -1 &nbsp &nbsp 6 &nbsp &nbsp -1
&nbsp &nbsp 0 &nbsp &nbsp -1 &nbsp &nbsp 0

Other Filters
An unsharp mask filter achieves a sharpening effect by subtracting a blurred version of an image from a multiple of the original. In my sample unsharpening is achieved by subtracting the image filtered using a 3x3 blur matrix from twice the original value.

Embossing is achieved by setting pixels black except where there is a change in intensity. Typical filter matrices for embossing look like this:

&nbsp &nbsp 1 &nbsp &nbsp 0 &nbsp &nbsp 0 &nbsp &nbsp &nbsp Weight: 1
&nbsp &nbsp 0 &nbsp &nbsp 0 &nbsp &nbsp 0
&nbsp &nbsp 0 &nbsp &nbsp 0 &nbsp &nbsp -1

Embossing filter which detects changes in the upper-left direction

&nbsp &nbsp -1 &nbsp &nbsp 0 &nbsp &nbsp 0 &nbsp &nbsp &nbsp Weight: 1
&nbsp &nbsp 0 &nbsp &nbsp 0 &nbsp &nbsp 0
&nbsp &nbsp 0 &nbsp &nbsp 0 &nbsp &nbsp 1

Embossing filter which detects changes in the lower-right direction

About  Contribute  Send Feedback  Privacy

Copyright © 1998-1999, Steve McMahon ( steve@vbaccelerator.com). All Rights Reserved.
Last updated: 24 June 1998