Connecting to a QObjects signal with JavaScript slot in Qt WebKit
hamishwillee
(Talk | contribs) m (Removed protection from "CS001545 - Connecting to a QObjects signal with JavaScript slot in Qt WebKit") |
hamishwillee
(Talk | contribs) m (Hamishwillee - Bot update - Merge KB into wiki) |
||
| Line 1: | Line 1: | ||
| − | [[Category:Code | + | [[Category:Code Snippet]][[Category:Code Snippet]][[Category:Qt WebKit]] |
| − | + | {{ArticleMetaData <!-- v1.2 --> | |
| − | {{ArticleMetaData | + | |
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
|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]]) --> | ||
|installfile= <!-- Link to installation file (e.g. [[Media:The Installation File.sis]]) --> | |installfile= <!-- Link to installation file (e.g. [[Media:The Installation File.sis]]) --> | ||
| − | |sdk=<!-- SDK(s) built and tested against (e.g. [http://linktosdkdownload/ Nokia Qt SDK 1.1]) --> | + | |devices= Nokia N97, Nokia N900 |
| − | |devicecompatability=<!-- Compatible devices (e.g.: All* (must have GPS) ) --> | + | |sdk= <!-- SDK(s) built and tested against (e.g. [http://linktosdkdownload/ Nokia Qt SDK 1.1]) --> |
| − | |signing=<!-- Empty or one of Self-Signed, DevCert, Manufacturer --> | + | |platform= Qt |
| − | |capabilities=<!-- Capabilities required (e.g. Location, NetworkServices. | + | |devicecompatability= <!-- Compatible devices (e.g.: All* (must have GPS) ) --> |
| − | |author=[[User:Taaidant]] | + | |dependencies= <!-- Any other/external dependencies e.g.: Google Maps Api v1.0 --> |
| + | |signing= <!-- Empty or one of Self-Signed, DevCert, Manufacturer --> | ||
| + | |capabilities= <!-- Capabilities required by the article/code example (e.g. Location, NetworkServices. --> | ||
| + | |keywords= Qt, web, WebKit, HTML, QWebView | ||
| + | |language= <!-- Language category code for non-English topics - e.g. Lang-Chinese --> | ||
| + | |translated-by= <!-- [[User:XXXX]] --> | ||
| + | |translated-from-title= <!-- Title only --> | ||
| + | |translated-from-id= <!-- Id of translated revision --> | ||
| + | |review-by= <!-- After re-review: [[User:username]] --> | ||
| + | |review-timestamp= <!-- After re-review: YYYYMMDD --> | ||
| + | |update-by= <!-- After significant update: [[User:username]]--> | ||
| + | |update-timestamp= <!-- After significant update: YYYYMMDD --> | ||
| + | |creationdate= 20091207 | ||
| + | |author= [[User:Taaidant]] | ||
| + | <!-- The following are not in current metadata --> | ||
| + | |subcategory= Browsing, WebKit | ||
| + | |id= CS001545 | ||
}} | }} | ||
| Line 26: | Line 34: | ||
* Qt is installed on your platform. | * Qt is installed on your platform. | ||
** Symbian S60: | ** Symbian S60: | ||
| − | *** Download Qt | + | *** Download Qt release from here: [http://qt.nokia.com/downloads Qt Downloads] |
| − | *** Install Qt | + | *** Install Qt: [[How to Install Qt]] |
** Maemo: | ** Maemo: | ||
*** More information about Qt on Maemo can be found here: [http://qt4.garage.maemo.org/ Qt4 Maemo port] | *** More information about Qt on Maemo can be found here: [http://qt4.garage.maemo.org/ Qt4 Maemo port] | ||
| − | * You've exposed the QObject as demonstrated in the article [[ | + | * You've exposed the QObject as demonstrated in the article [[Exposing QObjects to Qt Webkit]]. |
== Code == | == Code == | ||
| Line 125: | Line 133: | ||
==See also== | ==See also== | ||
| − | * [[ | + | * [[Calling an exposed QObject slot from Qt WebKit with JavaScript]] |
Revision as of 05:04, 14 June 2012
Article Metadata
Tested with
Devices(s): Nokia N97, Nokia N900
Compatibility
Platform(s): Qt
Article
Keywords: Qt, web, WebKit, HTML, QWebView
Created: taaidant
(07 Dec 2009)
Last edited: hamishwillee
(14 Jun 2012)
Contents |
Overview
This snippet demonstrates how to connect an exposed QObjects signal to a JavaScript slot with the Qt WebKit.
Preconditions
- Qt is installed on your platform.
- Symbian S60:
- Download Qt release from here: Qt Downloads
- Install Qt: How to Install Qt
- Maemo:
- More information about Qt on Maemo can be found here: Qt4 Maemo port
- Symbian S60:
- You've exposed the QObject as demonstrated in the article Exposing QObjects to Qt Webkit.
Code
First, we need to reference a HTML page and a JavaScript file with the resource file. The resource file also needs to be referenced 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 required resources, like #view.html, the 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 display 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 an exposed QObject signal with a JavaScript slot with Qt WebKit.
