×
Namespaces

Variants
Actions
(Difference between revisions)

Calling Qt class methods from QML

From Nokia Developer Wiki
Jump to: navigation, search
hamishwillee (Talk | contribs)
m (Hamishwillee - Bot update)
hamishwillee (Talk | contribs)
m (Hamishwillee - Add Abstract. Tidy wiki text)
 
(5 intermediate revisions by 2 users not shown)
Line 1: Line 1:
 +
[[Category:Qt]][[Category:Qt Quick]][[Category:Code Snippet]][[Category:MeeGo Harmattan]][[Category:Symbian]][[Category:General Programming]][[Category:S60 5th Edition]]
 +
{{Abstract|This code snippet shows how to call Qt class methods directly from QML.}}
 +
 
{{ArticleMetaData <!-- v1.2 -->
 
{{ArticleMetaData <!-- v1.2 -->
 
|sourcecode= <!-- Link to example source code (e.g. [[Media:The Code Example ZIP.zip]]) -->
 
|sourcecode= <!-- Link to example source code (e.g. [[Media:The Code Example ZIP.zip]]) -->
Line 5: Line 8:
 
|sdk= <!-- SDK(s) built and tested against (e.g. [http://linktosdkdownload/ Nokia Qt SDK 1.1]) -->
 
|sdk= <!-- SDK(s) built and tested against (e.g. [http://linktosdkdownload/ Nokia Qt SDK 1.1]) -->
 
|platform= S60 5th Edition<br>Maemo
 
|platform= S60 5th Edition<br>Maemo
|devicecompatability= <!-- Compatible devices (e.g.: All* (must have GPS) ) -->
+
|devicecompatability= Qt 4.7 and later
|dependencies= <!-- Any other/external dependencies e.g.: Google Maps Api v1.0 -->
+
|dependencies= Qt 4.7 and later
 
|signing= <!-- Empty or one of Self-Signed, DevCert, Manufacturer -->
 
|signing= <!-- Empty or one of Self-Signed, DevCert, Manufacturer -->
 
|capabilities= <!-- Capabilities required by the article/code example (e.g. Location, NetworkServices. -->
 
|capabilities= <!-- Capabilities required by the article/code example (e.g. Location, NetworkServices. -->
Line 21: Line 24:
 
|author= [[User:Kratsan]]
 
|author= [[User:Kratsan]]
 
<!-- The following are not in current metadata -->
 
<!-- The following are not in current metadata -->
|subcategory= Qt Quick
 
 
|id= CS001613
 
|id= CS001613
 
}}
 
}}
  
 
==Overview==
 
==Overview==
 
This code snippet shows how to call Qt class methods directly from QML.
 
  
 
In order to enable the calling of Qt class methods from QML code, the methods must be declared as public slots or conventional methods with the {{Icode|Q_INVOKABLE}} macro. In both cases, Qt methods are available to the Qt Meta-Object system and the methods are callable from QML. One drawback in the public slot method is that the slot cannot return a value. Conversely, the method with the {{Icode|Q_INVOKABLE}} macro is able to do this.
 
In order to enable the calling of Qt class methods from QML code, the methods must be declared as public slots or conventional methods with the {{Icode|Q_INVOKABLE}} macro. In both cases, Qt methods are available to the Qt Meta-Object system and the methods are callable from QML. One drawback in the public slot method is that the slot cannot return a value. Conversely, the method with the {{Icode|Q_INVOKABLE}} macro is able to do this.
Line 38: Line 38:
  
 
* Qt 4.7 or higher is installed on your platform.
 
* Qt 4.7 or higher is installed on your platform.
 +
 +
==Qt Project File==
 +
 +
<code cpp-qt>
 +
#To make sure we use declarative
 +
QT += declarative
 +
 +
#To get files deployed on device / emulator
 +
files.sources += ui.qml
 +
DEPLOYMENT += files
 +
</code>
  
 
==Source==
 
==Source==
Line 43: Line 54:
 
'''stringhelper.h'''
 
'''stringhelper.h'''
  
<code cpp>
+
<code cpp-qt>
 
#ifndef STRINGHELPER_H
 
#ifndef STRINGHELPER_H
 
#define STRINGHELPER_H
 
#define STRINGHELPER_H
Line 79: Line 90:
 
'''ui.qml'''
 
'''ui.qml'''
  
<code cpp>
+
<code cpp-qt>
 
import Qt 4.7
 
import Qt 4.7
  
Line 129: Line 140:
 
'''main.cpp'''
 
'''main.cpp'''
  
<code cpp>
+
<code cpp-qt>
 
#include <QApplication>
 
#include <QApplication>
 
#include <QDeclarativeView>
 
#include <QDeclarativeView>
Line 160: Line 171:
  
 
The code snippet has demonstrated how to call Qt class methods from QML. This required setting the {{Icode|QObject}}-derived object as a context property to the root object of {{Icode|QDeclarativeView}}. The methods of the Qt-derived class had to be either public slots or regular methods declared with the {{Icode|Q_INVOKABLE}} macro.
 
The code snippet has demonstrated how to call Qt class methods from QML. This required setting the {{Icode|QObject}}-derived object as a context property to the root object of {{Icode|QDeclarativeView}}. The methods of the Qt-derived class had to be either public slots or regular methods declared with the {{Icode|Q_INVOKABLE}} macro.
 
[[Category:Qt]][[Category: Qt Quick]][[Category:Code Snippet]][[Category:Code Snippet]][[Category:MeeGo]] [[Category:Symbian]]
 

Latest revision as of 01:24, 18 October 2012

This code snippet shows how to call Qt class methods directly from QML.

Article Metadata
Tested with
Devices(s): Nokia 900
Compatibility
Platform(s): S60 5th Edition
Maemo
Symbian
S60 5th Edition
Device(s): Qt 4.7 and later
Dependencies: Qt 4.7 and later
Article
Keywords: QML, QDeclarativeContext, Q_INVOKABLE
Created: kratsan (24 Jun 2010)
Last edited: hamishwillee (18 Oct 2012)

Contents

[edit] Overview

In order to enable the calling of Qt class methods from QML code, the methods must be declared as public slots or conventional methods with the Q_INVOKABLE macro. In both cases, Qt methods are available to the Qt Meta-Object system and the methods are callable from QML. One drawback in the public slot method is that the slot cannot return a value. Conversely, the method with the Q_INVOKABLE macro is able to do this.

In the following demonstration we define a new Qt class, StringHelper, which has one invokable echo method and one public slot, toggleEcho. The echo method will return the given string as is, or as reversed if the public slot toggleEcho(true) has been called.

The StringHelper class is instantiated in main.cpp. The QObject-derived object stringHelper is then set as a context property to the root element of QDeclarativeView. The result is that the root element rect in the ui.qml document will see StringHelper as its child element.

[edit] Preconditions

  • Qt 4.7 or higher is installed on your platform.

[edit] Qt Project File

#To make sure we use declarative
QT += declarative
 
#To get files deployed on device / emulator
files.sources += ui.qml
DEPLOYMENT += files

[edit] Source

stringhelper.h

#ifndef STRINGHELPER_H
#define STRINGHELPER_H
 
#include <QObject>
#include <QString>
 
class StringHelper : public QObject
{
Q_OBJECT
public:
StringHelper(QObject *parent = 0) : QObject(parent), reverse(false) { }
 
Q_INVOKABLE QString echo(const QString &text) const {
if(reverse == false) { return text; }
 
QString reversed;
for(QString::const_iterator it = text.begin(); it != text.end(); it++) {
reversed.push_front(*it);
}
 
return reversed;
}
 
public slots:
void toggleEcho(bool reverse) { this->reverse = reverse; }
 
protected:
bool reverse;
};
 
#endif // STRINGHELPER_H

ui.qml

import Qt 4.7
 
Rectangle {
id: rect
 
property string text: "Using Qt class to echo this"
 
function updateUI() {
StringHelper.toggleEcho(button.pressed); // calling StringHelper::toggleEcho
text.text = StringHelper.echo(rect.text) // calling StringHelper::echo
}
 
anchors.fill: parent
color: "black"
 
Component.onCompleted: updateUI()
 
Text {
id: text
anchors.centerIn: parent
color: "white"
}
 
Rectangle {
id: button
 
property bool pressed: false
 
width: 100; height: 40
anchors.right: parent.right; anchors.rightMargin: 20
anchors.bottom: parent.bottom; anchors.bottomMargin: 20
radius: 6
color: pressed ? "gray" : "white"
 
Text {
anchors.centerIn: parent
text: "Reverse"
}
 
MouseArea {
anchors.fill: parent
onClicked: { button.pressed = !button.pressed; updateUI() }
}
}
}

main.cpp

#include <QApplication>
#include <QDeclarativeView>
#include <QDeclarativeContext>
#include "stringhelper.h"
 
int main(int argc, char *argv[])
{
QApplication a(argc, argv);
 
StringHelper stringHelper;
 
QDeclarativeView view;
view.setResizeMode(QDeclarativeView::SizeRootObjectToView);
view.rootContext()->setContextProperty("StringHelper", &stringHelper);
view.setSource(QUrl("./ui.qml"));
 
#if defined(Q_WS_S60) || defined(Q_WS_MAEMO)
view.showMaximized();
#else
view.setGeometry(100, 100, 800, 480);
view.show();
#endif
 
return a.exec();
}

[edit] Postconditions

The code snippet has demonstrated how to call Qt class methods from QML. This required setting the QObject-derived object as a context property to the root object of QDeclarativeView. The methods of the Qt-derived class had to be either public slots or regular methods declared with the Q_INVOKABLE macro.

This page was last modified on 18 October 2012, at 01:24.
341 page views in the last 30 days.
×