How to Change Hue Level of an Image in Qt

Qt offers convenient classes for basic image processing and pixel manipulation. In this article I am going to describe how you can change the hue level of a whole image using QImage class in Qt.

It’s quite simple as long as you know what hue is. So to start, let’s look at the following images:

All of these images have the same components in the HSV Color Space except their Hue value.

Below is how you can modify the Hue element of a whole image (QImage) in Qt:

for (int i = 0; i < image.width(); i++)
{
	for (int j = 0; j < image.height(); j++)
	{
		QColor color = image.pixelColor(i, j);

		int hue = color.hue();

		// modify hue as you'd like and write back to the image
		color.setHsv(hue, color.saturation(), color.value(), color.alpha());
		image.setPixelColor(i, j, color);
	}
}


5 Replies to “How to Change Hue Level of an Image in Qt”

  1. Hi amin , can you help in this issue , i want to displat hsv but i can”t get the right displaying , wich format i have to choose in QImage:: ?
    Thank you amin so much.

    if (ui->hsvbutton->isChecked())
    {
    cvtColor(src, img, COLOR_RGB2HSV);

    ui->imglabelout->setPixmap(QPixmap::fromImage(QImage(img.data, img.cols, img.rows, img.step, QImage::XXXXXXXXXXX)
    }

    1. Hi Amine,
      I’m not sure what you mean by “displaying HSV”?!
      QImage::Format is used to set the format of the data stored in the image, not the color space, if you know what I mean.
      If you want to display individual channels of an HSV image, on a QLabel, you can do the following:

      1. Read and convert your image from BGR to HSV.
      2. Split the channels to get 3 single channel Mat objects containing H, S and V channels.
      3. Normalize them to have values between 0 .. 255 using OpenCV normalize function
      3. Convert each one of the normalized Mat objects to RGB (using grayscale to RGB with cvtColor function)
      4. Display them individually as seen in the following post:
      http://amin-ahmadi.com/2015/12/16/how-to-display-a-mat-image-in-qt/

      Hope this helps.

      (In any case, this post is about changing the Hue using Qt only, without using OpenCV 🙂 )

  2. Hello Amin, I see in 3 photos above you made a slider for changing hue. So I would like to ask you about the code of making that slider. Thanks in advance

    1. Hi Snow,
      The slider and the whole window is created using Qt Framework and OpenCV library.
      Are you familiar with Qt framework at all?
      If yes, then simply use a slider widget. Otherwise I will recommend you to grab a book and start reading 😉
      Here’s a book I’ve written on this topic:
      https://www.oreilly.com/library/view/computer-vision-with/9781788472395/

      If you just search around, I’m sure you can find other suitable books as well, about Qt and OpenCV and how to combine them to create computer vision applications.

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.