KDE Rocks!

entries RSS comments RSS

Image transformations using Qt and C++ Written on January 21, 2009, by Milot Shala.

I am studying and experimenting with the framework, I ended up writing an application which applies some image transformations on the current image and displays it below the original image. And I thought it would be great to share this information with anyone who is interested in this stuff. Here I will show just one function, how to flip the image vertically, but I have provided the full source code for the application, so you can experiment with it more. But if you come up with some nicer stuff, feel free to comment .

The logic of transforming the images is simple, you take a source image, you read it, grab its pixels, form new image but… you transform the pixels. Pretty straight forward but how we can achieve the logic in the code?

First we create a function, which will return QImage (a newly created QImage object), then we create an instance of the new QImage object with the same properties as the current image (same width/height and format), then we have a blank image, as we know, the graphics pixels are represented in a matrix, and our algorithm will be using two nested for loops to iterate through, the QImage object has a method called “setPixel” which allows us to create a new image pixel per pixel, we can create it by passing x and y axis of the current image, but what we want to reach, is to transform the picture vertically, so instead we transform our Y axis by subtracting the current height with one and current Y axis value within the loop as shown in the code below which is well commented.

QImage ImageDialog::flipImageVertically(QImage source_image)
{
    // create a new image instance, based on the information from the source image
    QImage new_image(source_image.width(), source_image.height(), source_image.format());
 
    // we need this variable, because when we create our new image
    // we will read each pixel, but instead of placing the same pixels
    // on our newly create one, we will transform our pixels vertically in this
    // function, so we need that Y axis to be subtracted by one and by source image's
    // Y axis, which we can see on our for loop below.
    int height_subtraction = source_image.height() - 1;
 
    for(int x = 0; x < source_image.width(); ++x)
        for(int y = 0; y < source_image.height(); ++y)
            // we create a new image from the pixels of the source image, but
            // as you can see, we are creating it pixel per pixel, so when we need the
            // pixel information, we can play with it, in this function we are transforming
            // the Y axis so we can get negative values and that will produce us
            // a flipped image.
            new_image.setPixel(x, height_subtraction - y, source_image.pixel(x, y));
 
    return new_image;
}

and below I have shown a screenshot how the image will look like after applying the vertical transformation:

And you can download the code for this project here: http://codespartan.org/files/ImageTransformations.tar.gz

The code provided here, shows you how to apply horizontal transformation, and both vertical and horizontal, the logic is the same, but in the setPixel method, you transform the X axis with the formula like this:

int horizontal_subtraction = source_image.width() - 1 - x; // the x is a local for loop variable

but the rest I will leave it to you to experiment with it.

The photo used in this demo application is copyright of Kushtrim Krasniqi (http://www.flickr.com/photos/kushtrimi_k2/3064680407/) which I’ve found it on flickr.

If you have any thoughts, feel free to comment or email me at milot.shala@gmail.com.

UPDATE: I’ve created a Windows binary, but I have tested it only Windows Vista and I don’t know if it would work on Windows XP, it’s located here: http://codespartan.org/files/ImageTransformations(Vista Build).rar.

3,024 views

© Copyright Phalanx Blogosphere - Powered by Wordpress - Phalanx logo is designed by Leopard Cana