QML Maps with Pinch Zoom/bg: Difference between revisions
Jump to navigation
Jump to search
No edit summary |
(Sub-categorize) |
||
(3 intermediate revisions by 2 users not shown) | |||
Line 1: | Line 1: | ||
[[Category:Snippets]][[Category:Developing with Qt::QtMobility]][[Category:HowTo]] | {{Cleanup | reason=Auto-imported from ExpressionEngine.}} | ||
{{LangSwitch}} | |||
[[Category:Snippets::QML]] | |||
[[Category:Developing with Qt::QtMobility]] | |||
[[Category:HowTo]] | |||
[[Category:Bulgarian]] | |||
= Използване на PinchArea за увеличение и MouseArea за движение в карти на QML = | = Използване на PinchArea за увеличение и MouseArea за движение в карти на QML = | ||
Плъгина на Qt Mobility за географски карти предоставя много удобен 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. | ||
Надявам се, че това ще ви е полезно! | Надявам се, че това ще ви е полезно! | ||
<code> | <code> | ||
import QtQuick 1.1 | |||
import QtMobility.location 1.2 | |||
Rectangle { | Rectangle { | ||
id: pinchmap | |||
property double defaultLatitude: 37.69 | property double defaultLatitude: 37.69 | ||
property double defaultLongitude: –97.33 | |||
property int defaultZoomLevel: 7 | |||
property alias mapType: map.mapType | property alias mapType: map.mapType | ||
width: 640 | width: 640 | ||
height: 350 | |||
Map { | Map { | ||
id: map | |||
anchors.fill: parent | anchors.fill: parent | ||
zoomLevel: pinchmap.defaultZoomLevel | |||
plugin: Plugin { name: "nokia" } | |||
mapType: Map.StreetMap | |||
center: Coordinate { | center: Coordinate { | ||
latitude: pinchmap.defaultLatitude | |||
longitude: pinchmap.defaultLongitude | |||
} | |||
} | |||
PinchArea { | PinchArea { | ||
id: pincharea | |||
property double _''oldZoom | property double _''oldZoom | ||
anchors.fill: parent | |||
function calcZoomDelta(zoom, percent) { | |||
return zoom + Math.log(percent)/Math.log(2) | |||
} | |||
onPinchStarted: { | |||
oldZoom = map.zoomLevel | |||
} | |||
onPinchUpdated: { | |||
map.zoomLevel = calcZoomDelta(oldZoom, pinch.scale) | |||
} | |||
onPinchFinished: { | |||
map.zoomLevel = calcZoomDelta(oldZoom, pinch.scale) | |||
} | |||
} | |||
MouseArea { | |||
id: mousearea | |||
property boolisPanning: false | |||
property intlastX: –1 | |||
property intlastY: –1 | |||
anchors.fill : parent | |||
onPressed: { | |||
isPanning = true | |||
lastX = mouse.x | |||
lastY = mouse.y | |||
} | |||
onReleased: { | |||
isPanning = false | |||
} | |||
onPositionChanged: { | |||
if (isPanning) { | |||
var dx = mouse.x -lastX | |||
var dy = mouse.y -lastY | |||
map.pan(-dx, -dy) | |||
lastX = mouse.x | |||
lastY = mouse.y | |||
} | |||
} | |||
onCanceled: { | |||
''_isPanning = false; | |||
} | |||
} | |||
} | |||
</code> |
Latest revision as of 13:04, 28 November 2016
This article may require cleanup to meet the Qt Wiki's quality standards. Reason: Auto-imported from ExpressionEngine. Please improve this article if you can. Remove the {{cleanup}} tag and add this page to Updated pages list after it's clean. |
Използване на 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.
Надявам се, че това ще ви е полезно!
import QtQuick 1.1
import QtMobility.location 1.2
Rectangle {
id: pinchmap
property double defaultLatitude: 37.69
property double defaultLongitude: –97.33
property int defaultZoomLevel: 7
property alias mapType: map.mapType
width: 640
height: 350
Map {
id: map
anchors.fill: parent
zoomLevel: pinchmap.defaultZoomLevel
plugin: Plugin { name: "nokia" }
mapType: Map.StreetMap
center: Coordinate {
latitude: pinchmap.defaultLatitude
longitude: pinchmap.defaultLongitude
}
}
PinchArea {
id: pincharea
property double _''oldZoom
anchors.fill: parent
function calcZoomDelta(zoom, percent) {
return zoom + Math.log(percent)/Math.log(2)
}
onPinchStarted: {
oldZoom = map.zoomLevel
}
onPinchUpdated: {
map.zoomLevel = calcZoomDelta(oldZoom, pinch.scale)
}
onPinchFinished: {
map.zoomLevel = calcZoomDelta(oldZoom, pinch.scale)
}
}
MouseArea {
id: mousearea
property boolisPanning: false
property intlastX: –1
property intlastY: –1
anchors.fill : parent
onPressed: {
isPanning = true
lastX = mouse.x
lastY = mouse.y
}
onReleased: {
isPanning = false
}
onPositionChanged: {
if (isPanning) {
var dx = mouse.x -lastX
var dy = mouse.y -lastY
map.pan(-dx, -dy)
lastX = mouse.x
lastY = mouse.y
}
}
onCanceled: {
''_isPanning = false;
}
}
}