Click here to Skip to main content
15,867,686 members
Articles / Desktop Programming / WPF

Image Processing is Done using WPF

Rate me:
Please Sign up or sign in to vote.
4.84/5 (19 votes)
6 Aug 2011CPOL6 min read 104.7K   16.2K   68   13
Image Processing is done in a WPF application with some basic functionalities

Introduction

This is my tenth article in C#. This time, I have tried Image Processing in WPF.

scr1.jpg

Overview

The purpose of the article is to be able to build a class that allows any C# programmer to perform image processing functionality. In my previous similar articles, Image Processing in done in Windows Applications. This time, the purpose is to try by WPF. The reason we are doing it in C# is that it very flexible for me. We can see that the code becomes somewhat more complex when we start moving pixels or changing values based on calculations that take into account all the pixel values.

Application

The application uses WPF. I have handled the images with a separate class called CurrentImageHandler in which all the image related operations are done including Saving, Graphics related operations. The functionality includes getting image information, zooming, color filtering, brightening, contrasting, grayscale filtering, invert filtering, resizing with full resolution, rotating and flipping, cropping and inserting text, any other image and some geometric shapes. The image related functionalities are handled in a separate class library called ImageFunctions.dll. You can download ImageFunctions.dll from my previous article.

What is WPF? (Definition from Wikipedia)

Developed by Microsoft, the Windows Presentation Foundation (or WPF) is a computer-software graphical subsystem for rendering user interfaces in Windows-based applications. WPF, previously known as "Avalon", was initially released as part of .NET Framework 3.0. Rather than relying on the older GDI subsystem, WPF utilizes DirectX. WPF attempts to provide a consistent programming model for building applications and provides a separation between the user interface and the business logic. It resembles similar XML-oriented object models, such as those implemented in XUL and SVG.

WPF employs XAML, a derivative of XML, to define and link various UI elements. WPF applications can also be deployed as standalone desktop programs, or hosted as an embedded object in a website. WPF aims to unify a number of common user interface elements, such as 2D/3D rendering, fixed and adaptive documents, typography, vector graphics, runtime animation, and pre-rendered media. These elements can then be linked and manipulated based on various events, user interactions, and data bindings.

WPF runtime libraries are included with all versions of Microsoft Windows since Windows Vista and Windows Server 2008. Users of Windows XP SP2/SP3 and Windows Server 2003 can optionally install the necessary libraries.

As of 2011, Microsoft has released four major WPF versions:

  • WPF 3.0 (Nov 2006)
  • WPF 3.5 (Nov 2007)
  • WPF 3.5sp1 (Aug 2008)
  • WPF 4 (April 2010)

Microsoft Silverlight utilizes WPF to provide embedded web controls comparable to Adobe Flash, but with more focus on a UI object model and less on animation. 3D runtime rendering is unsupported in Silverlight, but available to embedded WPF applications. However, 3D API will be introduced in Silverlight 5 which is planned to be released in 2011.

Definition from MSDN Microsoft

Windows Presentation Foundation (WPF) is a next-generation presentation system for building Windows client applications with visually stunning user experiences. With WPF, you can create a wide range of both standalone and browser-hosted applications.

The core of WPF is a resolution-independent and vector-based rendering engine that is built to take advantage of modern graphics hardware. WPF extends the core with a comprehensive set of application-development features that include Extensible Application Markup Language (XAML), controls, data binding, layout, 2-D and 3-D graphics, animation, styles, templates, documents, media, text, and typography. WPF is included in the Microsoft .NET Framework, so you can build applications that incorporate other elements of the .NET Framework class library.

WPF exists as a subset of .NET Framework types that are for the most part located in the System.Windows namespace. If you have previously built applications with .NET Framework using managed technologies like ASP.NET and Windows Forms, the fundamental WPF programming experience should be familiar; you instantiate classes, set properties, call methods, and handle events, all using your favorite .NET Framework programming language, such as C# or Visual Basic.

WPF offers additional programming enhancements for Windows client application development. One obvious enhancement is the ability to develop an application using both markup and code-behind, an experience that ASP.NET developers should be familiar with. You generally use Extensible Application Markup Language (XAML) markup to implement the appearance of an application while using managed programming languages (code-behind) to implement its behavior. This separation of appearance and behavior has the following benefits:

  • Development and maintenance costs are reduced because appearance-specific markup is not tightly coupled with behavior-specific code.
  • Development is more efficient because designers can implement an application's appearance simultaneously with developers who are implementing the application's behavior.
  • Multiple design tools can be used to implement and share XAML markup, to target the requirements of the application development contributors; Microsoft Expression Blend provides an experience that suits designers, while Visual Studio 2005 targets developers.
  • Globalization and localization for WPF applications is greatly simplified (see WPF Globalization and Localization Overview).

1. Thumbnail View

scr2.jpg

C#
ThumbnailViewWindow tvWnd = new ThumbnailViewWindow(currImgHandler);
tvWnd.Show();

2. Color Filter

Color filters are sometimes classified according to their type of spectral absorption: short-wavelength pass, long-wavelength pass or band-pass; diffuse or sharp-cutting; monochromatic or conversion. The short-wavelength pass transmits all wavelengths up to the specified one and then absorbs. The long-wavelength pass is the opposite. Every filter is a band-pass filter when considered generally.

It is very simple - it just adds or subtracts a value to each color. The most useful thing to do with this filter is to set two colors to -255 in order to strip them and see one color component of an image. For example, for red filter, keep the red component as it is and just subtract 255 from the green component and blue component.

scr0.jpgscr3.jpg
scr4.jpgscr5.jpg
C#
currImgHandler.CurrentFilterHandler.SetColorFilter(ColorFilterTypes.Red);
currImgHandler.CurrentFilterHandler.SetColorFilter(ColorFilterTypes.Green);
currImgHandler.CurrentFilterHandler.SetColorFilter(ColorFilterTypes.Blue);

3. Brightness

Brightening images are sometimes needed, it's a personal choice. Sometimes printing needs a lighter image than viewing. It is done just by adjusting the color components as per the user requirement. The input ranges between -255 and 255.

scr0.jpgscr6.jpg
C#
BrightnessWindow bWnd = new BrightnessWindow();
bWnd.BrightnessValue = 0;
if (bWnd.ShowDialog().Value)
{
    currImgHandler.CurrentBrightnessHandler.SetBrightness(bWnd.BrightnessValue);
    PaintImage();
}

4. Contrast

Contrasting of images is certainly a complex processing. The color matrix formed gives a some what a different combination which makes the input image contrast.

scr0.jpgscr7.jpg
C#
ContrastWindow cFrm = new ContrastWindow();
cFrm.ContrastValue = 0;
if (cFrm.ShowDialog().Value)
{
    currImgHandler.CurrentContrastHandler.SetContrast(cFrm.ContrastValue);
    PaintImage();
}

5. Grayscale

Gray scale filtering is in reference to the color mode of a particular image. A gray scale image would, in layman's terms, be a black and white image, any other color would not be included in it.

Basically, it's a black and white image, the colors in that image, if any will be converted to corresponding shade of gray (mid tones between black and white) thus, making each bit of the image still differentiable.

scr0.jpgscr8.jpg
C#
currImgHandler.CurrentGrayscaleHandler.SetGrayscale();

6. Sepia Tone

Sepia Tone filtering is somewhat similar to grayscale.

scr0.jpgscr9.jpg
C#
currImgHandler.CurrentSepiaToneHandler.SetSepiaTone();

7. Invert

This is so simple that it doesn't even matter that the color components are out of order. It is just taking the opposite color of the current component. That is for example, if the color component is 00, then the opposite we get is FF (255-0).

scr0.jpgscr10.jpg
C#
currImgHandler.CurrentInvHandler.SetInversion();

8. Inserting Text, Any Other Images and Shapes with More Features

This is just including any required things in the image. This is achieved by the Graphics object of the image.

scr0.jpgscr14.jpg
scr12.jpgscr13.jpg
C#
//Inserting Text
 InsertImageWindow iiWnd = new InsertImageWindow();
iiWnd.DisplayImagePositionX = iiWnd.DisplayImagePositionY = 0;
 if (iiWnd.ShowDialog().Value)
 {
     currImgHandler.CurrentImgInsHandler.Insert
	(iiWnd.DisplayImagePath, iiWnd.DisplayImagePositionX, 
	iiWnd.DisplayImagePositionY, iiWnd.DisplayImageWidth, 
	iiWnd.DisplayImageHeight, iiWnd.DisplayImageAngle, iiWnd.DisplayImageOpacity);
     PaintImage();
}
//Inserting Images
InsertImageWindow iiWnd = new InsertImageWindow();
iiWnd.DisplayImagePositionX = iiWnd.DisplayImagePositionY = 0;
if (iiWnd.ShowDialog().Value)
{
      currImgHandler.CurrentImgInsHandler.Insert
	(iiWnd.DisplayImagePath, iiWnd.DisplayImagePositionX, 
	iiWnd.DisplayImagePositionY, iiWnd.DisplayImageWidth, 
	iiWnd.DisplayImageHeight, iiWnd.DisplayImageAngle, iiWnd.DisplayImageOpacity);
      PaintImage();
}
//Inserting Shapes
InsertShapeWindow isWnd = new InsertShapeWindow();
isWnd.DisplayShapePositionX = isWnd.DisplayShapePositionY = 0;
if (isWnd.ShowDialog().Value)
{
    currImgHandler.CurrentShapeInsHandler.Insert
	(isWnd.DisplayShape, isWnd.DisplayShapePositionX, 
	isWnd.DisplayShapePositionY, isWnd.DisplayShapeWidth, 
	isWnd.DisplayShapeHeight, isWnd.DisplayShapeAngle, 
	isWnd.DisplayShapeOpacity, isWnd.DisplayShapeColor1, 
	isWnd.DisplayShapeColor2, isWnd.DisplayShapeGradientStyle);
     PaintImage();
}

PaintImage() Method

C#
private void PaintImage()
{
     System.IO.MemoryStream stream = new System.IO.MemoryStream();
     currImgHandler.CurrentBitmap.Save(stream, System.Drawing.Imaging.ImageFormat.Bmp);
     stream.Position = 0;
     byte[] data = new byte[stream.Length];
     stream.Read(data, 0, Convert.ToInt32(stream.Length));
     BitmapImage bmapImage = new BitmapImage();
     bmapImage.BeginInit();
     bmapImage.StreamSource = stream;
     bmapImage.EndInit();
     MainImage.Source = bmapImage;
     MainImage.Stretch = Stretch.Uniform;
}

Points of Interest

I have also included Undo Options, Clear Image, Image Information, Resizing, Rotating, Cropping which are quiet simple. Also some other functionalities are similar to my previous article on Image Processing, so I have not included them here. You can get them from the downloads.

See Also

Conclusion

Thanks for viewing this article. I expect feedback from you. You expect more from me.

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)


Written By
India India
This member has not yet provided a Biography. Assume it's interesting and varied, and probably something to do with programming.

Comments and Discussions

 
QuestionMessage Closed Pin
13-Jul-21 13:14
Member 1509148913-Jul-21 13:14 
QuestionCentering Text Pin
nareshr_9916-Oct-13 8:19
nareshr_9916-Oct-13 8:19 
QuestionMy vote of 3 Pin
vdeo119-Jun-13 0:32
vdeo119-Jun-13 0:32 
QuestionInversion is not working Pin
sankar_45122-Apr-13 22:09
sankar_45122-Apr-13 22:09 
GeneralMy vote of 5 Pin
RüdiActivity26-Feb-13 5:43
RüdiActivity26-Feb-13 5:43 
GeneralMy vote of 2 Pin
S.B.2-Dec-12 17:12
S.B.2-Dec-12 17:12 
QuestionExcellent Article, can you elaborate the ImageFunctions.dll Pin
Deb Kumar Ghosal24-Jun-12 20:02
Deb Kumar Ghosal24-Jun-12 20:02 
AnswerRe: Excellent Article, can you elaborate the ImageFunctions.dll Pin
Saleth Prakash26-Jun-12 19:19
Saleth Prakash26-Jun-12 19:19 
Questionhow to download imagefunctions.dll and what it's means????????? Pin
Aswathy Ravi30-Oct-11 19:02
Aswathy Ravi30-Oct-11 19:02 
AnswerRe: how to download imagefunctions.dll and what it's means????????? Pin
Saleth Prakash30-Oct-11 19:07
Saleth Prakash30-Oct-11 19:07 
QuestionWhat? PinPopular
Pete O'Hanlon8-Aug-11 1:20
subeditorPete O'Hanlon8-Aug-11 1:20 
Questionwhat's ImageFunctions.ImageHandler ? Pin
itsho6-Aug-11 11:01
itsho6-Aug-11 11:01 
AnswerRe: what's ImageFunctions.ImageHandler ? Pin
Huisheng Chen6-Aug-11 14:24
Huisheng Chen6-Aug-11 14:24 
GeneralRe: what's ImageFunctions.ImageHandler ? Pin
tlhIn`toq8-Aug-11 11:05
tlhIn`toq8-Aug-11 11:05 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.