在Ubuntu上使用Map和Position APIs

242 阅读2分钟

我们知道Map和Position API是现代手机中非常重要的接口。那么我们如何在Ubuntu手机上使用它们呢?关于更多的Map及Position方面的资料可以在我们的developer网站找到:developer.ubuntu.com/api/qml/sdk…

\

1)使用MAP接口

\

我们可以直接使用如下的QML Map来实现MAP的功能:

\

            Map {
                id: map
                plugin : Plugin {
                    name: "osm"
                }
                anchors.fill: parent
                zoomLevel: 15
                center: QtPositioning.coordinate(39.9289 , 116.3883)

                Label {
                        anchors { top: parent.top; left: parent.left; margins: units.gu(2) }
                        text: "Position is: (" + me.position.coordinate.latitude + ", " +
                                me.position.coordinate.longitude + ")";
                        fontSize: "large"
                        color: "red"
                    }
            }


在这里我们使用了我们伟大祖国的北京地址经纬度坐标(39.9289,116.3883)。同时我们必须指出的是,我们必须使用名叫"osm"的plugin接口。以前一下诺基亚的手机,使用的是名为"nokia"的plugin。为了正确使用这个接口,我们必须在QML文件中调用如下的库:

\

import QtLocation 5.0
import QtPositioning 5.0

\

如果要在手机上运行,我们必须加入相应的安全policy。

\

\


运行我们的程序,我们可以看到如下的结果:

\

\

\

\

2)使用Position接口

我们可以通过如下的方式得到我们所在的位置:

\

            PositionSource {
                 id: me
                 active: true
                 updateInterval: 1000
                 onPositionChanged: {
                     console.log("lat: " + position.coordinate.latitude + " longitude: " +
                                 position.coordinate.longitude);
                     console.log(position.coordinate)
                 }
             }

\

为了能够显示我们所在的位置,我们也可以把我们上面的程序做一个修改。我们可以把把地图的中心位置设为我们得到的当前位置。修改后的程序为:

\

            Map {
                id: map
                plugin : Plugin {
                    name: "osm"
                }
                anchors.fill: parent
                zoomLevel: 12
                center: me.position.coordinate
//                center: QtPositioning.coordinate(39.9289 , 116.3883)

                Label {
                        anchors { top: parent.top; left: parent.left; margins: units.gu(2) }
                        text: "Position is: (" + me.position.coordinate.latitude + ", " +
                                me.position.coordinate.longitude + ")";
                        fontSize: "large"
                        color: "red"
                    }
            }


同时我们在Map里用红色的字体显示当前的位置。 运行的结果显示在如下的图中。我们可以改变zoomLevel来看不同的大小:

\

\

\

3)使用MapCircle来显示中心点

\

虽然我们在上面已经使用了地图来显示当前的位置,但我们还是想用一个明显的标志来显示当前的位置。这里我们用MapCircle来做这件事。这样我们的代码如下:

\

           Map {
                id: map
                plugin : Plugin {
                    name: "osm"
                }
                anchors.fill: parent
                zoomLevel: 12
                center: me.position.coordinate
                //                center: QtPositioning.coordinate(39.9289 , 116.3883)

                MapCircle {
                    center: me.position.coordinate
                    radius: units.gu(20)
                    color: "red"
                }

                Label {
                    anchors { top: parent.top; left: parent.left; margins: units.gu(2) }
                    text: "Position is: (" + me.position.coordinate.latitude + ", " +
                          me.position.coordinate.longitude + ")";
                    fontSize: "large"
                    color: "red"
                }
            }


运行的结果如下:

\

\

\

源码在如下网址可以找到:

\

github.com/liu-xiao-gu…

\

在MX4手机上运行的显示图片为:

\

\


\

这个显示的照片在我的家的附近,应该是准确的地址。我是使用wifi定位的。

\