How to take ScreenShot Qt/QML

Comments

Akinorta - build error

when i try compile this codes i receive this error:

C:\Users\*****\QT\*****\ScreenClass.cpp:11: error: 'FILE_NAME' was not declared in this scope

akinorta 16:42, 13 July 2012 (EEST)

Hamishwillee - Declare it!

FILE_NAME is obviously a variable - so you can define this yourself for whatever you want to call your saved screenshot file.

hamishwillee 04:49, 6 August 2012 (EEST)

Log in or Join to leave comments.

This article explains how to take a screenshot of your view, using QT/QML.

Article Metadata

---

Tested with

Devices(s): Nokia N8, Nokia 701

---

Compatibility

Platform(s): Symbian^3 and later, Qt 4.7 and later

---

Article

Keywords: screenshot,Qt, Qml, screen

Created: manu91 (20 Jun 2012)

Last edited: hamishwillee (11 Oct 2012)

Introduction

In this article we will explain how to take a screenshot of your current view using Qt/QML. To do this we will use the library QPixmap, that provides an easy way to take a snapshot of our current declarative view and then to save it.

In this way it's possible only to take a screenshot of our application!

ScrenClass.h

First of all we have to create a header file for our class

#ifndef SCRENCLASS_H
#define SCRENCLASS_H
 
#include <QDebug>
#include <QPixmap>
#include <qmlapplicationviewer.h>
#include <QDir>
 
class ScreenClass : public QObject
{
 
public:
    ScreenClass(QmlApplicationViewer* currentView);
 
    Q_OBJECT public: Q_INVOKABLE void capture(); 
 
private:
    QmlApplicationViewer* currentView;
};
 
#endif // SCRENCLASS_H

Here we have declared the class constructor to take the QmlApplicationViewer's object named "currentView" as reference. We have also defined the method "capture()" as Q_INVOKABLE, in this way it's possible to call it from QML.

ScreenClass.cpp

Here we implement our class.

#include "ScreenClass.h"
 
ScreenClass::ScreenClass(QmlApplicationViewer *currentView){
    this->currentView = currentView;
}
 
void ScreenClass::capture(){
 
#if defined(Q_OS_SYMBIAN)
 
    QPixmap::grabWidget(currentView).save("E:/Images/" + FILE_NAME + ".png");
    //QPixmap::grabWidget(currentView).save( QDir::currentPath() + "/screenShot/" + FILE_NAME+ ".png");
 
    qDebug() << "Captured on Symbian, here" + "E:/Images/";
#endif // Q_OS_SYMBIAN
 
#if defined(Q_WS_SIMULATOR)
 
    QPixmap::grabWidget(currentView).save( QDir::currentPath() + "/screenShot/" + FILE_NAME+ ".png");
     qDebug() << "Captured on Simulator, here: " +  QDir::currentPath() + "/screenShot/";
#endif // Q_OS_SYMBIAN
 
}

With QDir::currentPath() we can save the image in the default directory of our application, but we can also set an absolute path.

Main.cpp

#include <QtGui/QApplication>
#include "qmlapplicationviewer.h"
#include <QDeclarativeContext>
#include "ScreenClass.h"
 
Q_DECL_EXPORT int main(int argc, char *argv[])
{
    QScopedPointer<QApplication> app(createApplication(argc, argv));
 
    QmlApplicationViewer viewer;
    viewer.setMainQmlFile(QLatin1String("qml/screen/main.qml"));
    viewer.showExpanded();
 
    ScreenClass screenClass(&viewer);
    viewer.rootContext()->setContextProperty("screenObject", &screenClass);
 
    return app->exec();
}

In "main.cpp" we set viewer as reference for ScreenClass, and with "setContextProperty" we make the class visible form QML.

It' almost done, now we can use our method from QML.

QML

Page {
    id: mainPage
 
    Rectangle {
        id: rect; anchors.fill: parent; color: "red"; 
 
       Button {
           id: captureButton; anchors.centerin: parent
           text: "Capture!!!"
           onClicked: screenObject.capture();
       }
    }
}

The image will be saved automatically to the path we have set in the class ScreenClass.cpp.