Archive | June 2014

More Github

I have been experimenting some more with github. As well as uploading some of my own code I have begun to try to contribute to other people’s projects as well. One example is a simple image processing application. After seeing a post on reddit that sounded interesting I asked the author to consider uploading the code so I could contribute.

Before

When I first looked at the project it consisted of lots of separate interfaces which each performed one image manipulation operation. Each image transformation worked well however the UI could be improved. Currently each image transformation was completely compartmentalised and it was possible to crash the program by filling in the parameters incorrectly.

Old Menu

A screenshot of the old menu

Old Image Transformation Screen

A screenshot of the old image transformation screen

I figured the best way i could add value to this project would be to improve the UI and standardise the way the image transformations are defined in order to make it easier to add more in the future.

After

One of the first things I did was to create a new main User Interface with the aim of having one main screen where users could load, save and manipulate their image instead of having to load and save the image at every different screen.

Main UI

The new main user interface

Another feature I implemented was the standardisation of the image transformations. I did this by defining an interface and then refactoring the existing transformations for comply with the new interface. The interface consists of two parts, a method for showing the user a parameter screen and a method for applying the transform.

interface IBitmapTransform
{
    /// <summary>
    /// Launches a dialog box which allows the user to set the transformation's parameters
    /// 
    /// The image is supplied in case any transforms require the source image for parameterisation
    /// (ie for selecting where to insert an image).
    /// </summary>
    void ShowParameterDialog(Bitmap Image);

    /// <summary>
    /// Creates a new image by applying the Transform to the Source
    /// </summary>
    /// <param name="source"></param>
    /// <returns></returns>
    Bitmap Transform(Bitmap Source);
}

Below is an example parameter screen. These are hard coded currently however it might be interesting to create a way of automatically generating them in the future.

Parameter Screen

Parameter Screen

Some of the parameters were straightforward such as numerical or text inputs however others were more complicated such as selecting an of the screen to apply a transformation to. To facilitate this I made a interface for selecting areas and points on an image.

Area Selection

An area selection dialog

Evaluation

Overall I’ve enjoyed playing about with someone else’s code and I think the changes I have made have been worthwhile. In the future I’m looking forward to working on some larger and more difficult projects.