QML Maps with Pinch Zoom/bg

Български | English

Използване на PinchArea за увеличение и MouseArea за движение в карти на QML

Плъгина на Qt Mobility за географски карти предоставя много удобен QML елемент "Map:"http://doc.qt.nokia.com/qtmobility-1.2/qml-map.html , но оставя навигирането в ръцете на разработчика. Два често срещани методи за навигация са използването на бутане с пръст, за да се придвижите по картата, и приближаване/отдалечеване на два пръста, за да увеличите/намалите картата.

Тъй като не съм намерил никакви добри примери как да се направят тези две неща заедно, реших да покажа код, който постига това. Той използва "PinchArea:"http://doc.qt.nokia.com/4.7-snapshot/qml-pincharea.html елемента, който съществува от Qt Quick 1.1.

Надявам се, че това ще ви е полезно!

<br />import QtQuick 1.1<br />import QtMobility.location 1.2

Rectangle {<br /> id: pinchmap

property double defaultLatitude: 37.69<br /> property double defaultLongitude: –97.33<br /> property int defaultZoomLevel: 7

property alias mapType: map.mapType

width: 640<br /> height: 350

Map {<br /> id: map

anchors.fill: parent<br /> zoomLevel: pinchmap.defaultZoomLevel<br /> plugin: Plugin { name: &quot;nokia&amp;quot; }<br /> mapType: Map.StreetMap

center: Coordinate {<br /> latitude: pinchmap.defaultLatitude<br /> longitude: pinchmap.defaultLongitude<br /> }<br /> }

PinchArea {<br /> id: pincharea

property double _''oldZoom
<br /> anchors.fill: parent
<br /> function calcZoomDelta(zoom, percent) {<br /> return zoom + Math.log(percent)/Math.log(2)<br /> }
<br /> onPinchStarted: {<br />oldZoom = map.zoomLevel<br /> }
<br /> onPinchUpdated: {<br /> map.zoomLevel = calcZoomDelta(oldZoom, pinch.scale)<br /> }
<br /> onPinchFinished: {<br /> map.zoomLevel = calcZoomDelta(oldZoom, pinch.scale)<br /> }<br /> }
<br /> MouseArea {<br /> id: mousearea
<br /> property boolisPanning: false<br /> property intlastX: –1<br /> property intlastY: –1
<br /> anchors.fill : parent
<br /> onPressed: {<br />isPanning = true<br />lastX = mouse.x<br />lastY = mouse.y<br /> }
<br /> onReleased: {<br />isPanning = false<br /> }
<br /> onPositionChanged: {<br /> if (isPanning) {<br /> var dx = mouse.x -lastX<br /> var dy = mouse.y -lastY<br /> map.pan(-dx, -dy)<br />lastX = mouse.x<br />lastY = mouse.y<br /> }<br /> }
<br /> onCanceled: {<br />''_isPanning = false;<br /> }<br /> }<br />}<br />