Connecting to a QObjects signal with JavaScript slot in Qt WebKit
m (Protected "Connecting to a QObjects signal with JavaScript slot in Qt WebKit" ([edit=sysop] (indefinite) [move=sysop] (indefinite))) |
m |
||
| Line 16: | Line 16: | ||
* Qt is installed on your platform. | * Qt is installed on your platform. | ||
| − | ** S60: | + | ** Symbian S60: |
*** Download Qt for Symbian release from here: [http://qt.nokia.com/downloads Qt Downloads] | *** Download Qt for Symbian release from here: [http://qt.nokia.com/downloads Qt Downloads] | ||
*** Install Qt for Symbian: [[Installing Qt on Symbian]] | *** Install Qt for Symbian: [[Installing Qt on Symbian]] | ||
Revision as of 17:06, 16 December 2009
Article Metadata
Tested with
Devices(s): Nokia N97, Nokia N900
Compatibility
Platform(s): Qt
Article
Keywords: Qt, web, WebKit, HTML, QWebView
Created: (04 Dec 2009)
Last edited: seppo_fn
(16 Dec 2009)
Contents |
Overview
This snippet demonstrates how to connect a exposed QObjects signal to a JavaScript slot with Qt WebKit.
Preconditions
- Qt is installed on your platform.
- Symbian S60:
- Download Qt for Symbian release from here: Qt Downloads
- Install Qt for Symbian: Installing Qt on Symbian
- Maemo:
- More information about Qt on Maemo can be found here: Qt4 Maemo port
- Symbian S60:
- You've exposed the QObject like in this article Exposing QObjects to Qt Webkit.
Code
First we need to reference a html page and JavaScript file with the resource file. Of course the resource file has to be referenced also from the project file.
WebKit_JS_signal.pro
QT += webkit
TARGET = WebKit_JS_slot
TEMPLATE = app
SOURCES += main.cpp \
mainwindow.cpp \
sampleqobject.cpp
HEADERS += mainwindow.h \
sampleqobject.h
FORMS += mainwindow.ui
RESOURCES += resources.qrc
resources.qrc
Here we reference all the needed resources, like the #view.html, jquery.js helper library and #signal.js.
<RCC>
<qresource prefix="/">
<file>view.html</file>
<file>jquery.js</file>
<file>signal.js</file>
</qresource>
</RCC>
view.html
This is the HTML we will be displaying in the QWebView and where we'll reference the JavaScript files.
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<!-- Copyright (c) 2009 Nokia Corporation. -->
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<!-- You reference the resources with qrc:/ -->
<!-- JavaScript includes -->
<!-- jQuery http://jquery.com/ -->
<script type="text/javascript" src="qrc:/jquery.js" />
<!-- signal -->
<script type="text/javascript" src="qrc:/signal.js" />
<title>Signal</title>
</head>
<body>
<h1>Demonstrates signals</h1>
</body>
</html>
signal.js
/**
* This is run after the the web page has been rendered.
* $(document).ready documented here:
* http://docs.jquery.com/Tutorials:Introducing_$(document).ready()
*/
$(document).ready(function() {
try {
/* This connects sampleQObjects signal to our slot */
sampleQObject.signal.connect(slot);
/* This calls a slot which then in turn emits the signal. */
sampleQObject.slotThatEmitsSignal();
}
catch(e) {
alert(e);
}
});
function slot(object) {
var objectString = object.sender +
" has emited signal " +
object.signalsEmited +
" times.";
alert(objectString);
}
Postconditions
You've successfully connected to an exposed QObject signal to a JavaScript slot with Qt WebKit.
