Download Source Code: ImageEditor.zip - 515.05KB
 |  |  |
| C# implementation of a simple Image Editor, for local image files. ImageEdit class for the business logic, with operations on image data. ImageControl and ThumbnailControl custom controls, based on ImageEdit. Description of basic operations and transformations of images. | ||
 | |  |
Overview
There may be enough image editors on the market. Some, like Microsoft Paint, are shipped with the operating system itself. But our goal here is to create a simple editor in managed code, open source and available, with image operations you can easily later customize and enhance.
We may need to apply the same set of transformations on hundreds of images, and doing this manually, on each image, one-by-one, is overkilling. With full access to the source code of such editor, you can automate the process, and write your own new features and primitive functions to deliver even more.
Architecture
We tried to make our image editor as modular as possible. Reuse was one of our main goals, as these classes and controls will be also later use to implement additional functionality, such as image extraction from various sources and places, and highly automated processes.
We'll encapsulate the business logic in a ImageEdit class, which is essentially a wrapper around a System.Drawing.Image object, with editing features. ImageEdit is UI-independent, and can be reused in other user interface frameworks with very little changes.
ImageControl is the main control to properly display an image, in a graphical UI. It makes the link between the Image object encapsulated by the ImageEdit class, and a System.Windows.Forms.PictureBox control. A PictureBox already exposes several view modes, but you need additional code to render the image properly, in either Size to Fit mode, with auto-resize, or at its actual size, in a scrolling panel.
ImageControl will also implement the interactive crop area selection functionality, to simply cut a rectangular zone from the image. It can be later enhanced to provide more features, the way professional editors do.
ThumbnailControl has similar functionality, but only to display a small thumbnail of the image, always in Size-to-Fit mode and with no cropping operations.
Operations can be invoked by the user through menu commands or toolbar buttons, but in this prototype we also expose all browsable properties of the ImageEdit object with a PropertyGrid control. Most of these properties, when their values change, trigger some actions and perform simple operations on the image. They act like both configuration parameters and commands. This approach may not look like very user friendly, but offers more flexibility. Changing multiple values, in a different order, may lead to different results. It would take a lot of more user friendly screens to implement all you can do by simply changing some property values in this property grid.
A main goal for the image editor layout was to keep it simple. You can easily identify on screen the main area occupied by the ImageControl, the small thumbnail displayed by the ThumbnailControl and the PropertyGrid control, with properties of the internal ImageEdit instance.
Subscribe and Share: 
