Archived:Overlaying text and image using QImage

From Nokia Developer Wiki
Jump to: navigation, search

Archived.pngArchived: This article is archived because it is not considered relevant for third-party developers creating commercial solutions today. If you think this article is still relevant, let us know by adding the template {{ReviewForRemovalFromArchive|user=~~~~|write your reason here}}.

Qt Quick should be used for all UI development on mobile devices. The approach described in this article (using C++ for the Qt app UI) is deprecated.

Article Metadata
Tested with
Devices(s): Tested on: Nokia 5800 XpressMusic/N97/N97 mini
Platform(s): All platforms supported by Qt
S60 5th Edition
Keywords: QImage, QPainter
Created: User:Kbwiki (29 Jun 2010)
Last edited: hamishwillee (11 Oct 2012)


Using QPainter and QImage we can overlay any text/image on another image. The source image(s) can be read from any JPG file and the result image can be stored in another JPG file.


Header & Library:

  #include <QPainter>
#include <QImage>
#include <QDateTime>


  void ImageComposition::createImageWithOverlay()
// Input images (from resources)
QImage baseImage(":/images/base.jpg");
QImage overlayImage(":/images/overlay.jpg");
//Allocate Memory which should be least equal to baseImage
QImage imageWithOverlay = QImage(baseImage.size(), QImage::Format_ARGB32_Premultiplied);
QPainter painter(&imageWithOverlay);
painter.fillRect(imageWithOverlay.rect(), Qt::transparent);
// define coordinates
const int px_baseImage=0, py_baseImage = 0;
const int px_overlayImage = 500;
const int py_overlayImage = 0;
// draw baseImage on an empty image
'''painter.drawImage(px_baseImage, py_baseImage, baseImage);'''
// draw the overlay image
'''painter.drawImage(px_overlayImage, py_overlayImage, overlayImage);'''
// draw the text: as an example its taken as Current Date-Time
const int px_text = 20;
const int py_text = 20;
QDateTime dateTime = QDateTime::currentDateTime();
QString dateTimeString = dateTime.toString();
'''painter.drawText(px_text, py_text, dateTimeString);'''
// save the result image
bool errorCode = imageWithOverlay.save("C:\\Data\\result.jpg");

This page was last modified on 11 October 2012, at 04:14.
62 page views in the last 30 days.

Was this page helpful?

Your feedback about this content is important. Let us know what you think.


Thank you!

We appreciate your feedback.