From 274cb027444e26d465888842310000963b06aae9 Mon Sep 17 00:00:00 2001 From: Warwick Allison Date: Mon, 16 Nov 2009 13:12:53 +1000 Subject: Web service integration example - Google Maps --- .../declarative/webview/content/Mapping/Map.qml | 20 +++++++++ .../declarative/webview/content/Mapping/map.html | 47 ++++++++++++++++++++++ examples/declarative/webview/googleMaps.qml | 31 ++++++++++++++ 3 files changed, 98 insertions(+) create mode 100644 examples/declarative/webview/content/Mapping/Map.qml create mode 100755 examples/declarative/webview/content/Mapping/map.html create mode 100644 examples/declarative/webview/googleMaps.qml diff --git a/examples/declarative/webview/content/Mapping/Map.qml b/examples/declarative/webview/content/Mapping/Map.qml new file mode 100644 index 0000000..9bde031 --- /dev/null +++ b/examples/declarative/webview/content/Mapping/Map.qml @@ -0,0 +1,20 @@ +import Qt 4.6 + +Item { + id: page + property real latitude: -34.397 + property real longitude: 150.644 + property string address: "" + WebView { + id: map + anchors.fill: parent + url: "map.html" + javaScriptWindowObjects: Object { + WebView.windowObjectName: "qml" + property real lat: page.latitude + property real lng: page.longitude + property string address: page.address + onAddressChanged: {map.evaluateJavaScript("goToAddress()")} + } + } +} diff --git a/examples/declarative/webview/content/Mapping/map.html b/examples/declarative/webview/content/Mapping/map.html new file mode 100755 index 0000000..8afa21c --- /dev/null +++ b/examples/declarative/webview/content/Mapping/map.html @@ -0,0 +1,47 @@ + + + + + + + +

+ + diff --git a/examples/declarative/webview/googleMaps.qml b/examples/declarative/webview/googleMaps.qml new file mode 100644 index 0000000..b5b13bb --- /dev/null +++ b/examples/declarative/webview/googleMaps.qml @@ -0,0 +1,31 @@ +// This example demonstrates how Web services such as Google Maps can be +// abstracted as QML types. Here we have a "Mapping" module with a "Map" +// type. The Map type has an address property. Setting that property moves +// the map. The underlying implementation uses WebView and the Google Maps +// API, but users from QML don't need to understand the implementation in +// order to create a Map. + +import Qt 4.6 +import "content/Mapping" + +Map { + id: map + width: 300 + height: 300 + address: "Paris" + Rectangle { + color: "white" + width: input.width + 20 + height: input.height + 4 + radius: 5 + anchors.bottom: parent.bottom + anchors.bottomMargin: 5 + x: 70 + TextInput { + id: input + text: map.address + anchors.centerIn: parent + Keys.onReturnPressed: map.address = input.text + } + } +} -- cgit v0.12