本页内容

地点列表 (QML)

“地点列表”示例演示了如何使用ListView 来搜索并显示地点列表。

带地址的披萨店编号列表

运行示例

您可以通过以下方式运行该示例:

Places List 示例演示了如何在特定区域内搜索一组地点,并通过ListView 显示结果。在此示例中,将执行与术语food 相关的地点搜索。

要编写一个能够以列表形式显示地点的 QML 应用程序,我们首先需要进行以下导入声明。

import QtQuick
import QtPositioning
import QtLocation

实例化一个 `Plugin ` 实例。`Plugin ` 实际上是获取地点数据的后端来源。根据插件的类型,可能需要填写一些必填参数。`PluginParameter ` 最常见的类型是某种形式的服务访问令牌,相关内容已在服务插件的文档中说明。在此代码片段中,使用了 `osm ` 插件,该插件无需任何额外参数:

Plugin {
    id: myPlugin
    name: "osm"
    //specify plugin parameters as necessary
    //PluginParameter {...}
    //PluginParameter {...}
    //...
}

接下来,我们实例化一个 `PlaceSearchModel `,用于指定搜索参数并执行地点搜索操作。为便于说明,在模型构建完成后,会调用一次 `update()`。通常情况下,`update()` 会在响应用户操作(例如点击按钮)时被调用。

PlaceSearchModel {
    id: searchModel

    plugin: myPlugin

    searchTerm: "food"
    searchArea: QtPositioning.circle(startCoordinate, 5000 /* 5 km radius */);

    Component.onCompleted: update()

}

最后,我们实例化一个ListView 来显示模型找到的搜索结果。这里使用了一个内联委托,并且我们假设每个搜索结果都是type PlaceSearchesult 的类型。因此,我们假设始终可以访问role 中的“地点”,而其他类型的搜索结果可能不包含role中的“地点”。

ListView {
    anchors.fill: parent
    model: searchModel
    delegate: Component {
        Row {
            spacing: 5
            Marker { height: parent.height }
            Column {
                Text { text: title; font.bold: true }
                Text { text: place.location.address.text }
            }
        }
    }
}

示例项目 @ code.qt.io

© 2026 The Qt Company Ltd. Documentation contributions included herein are the copyrights of their respective owners. The documentation provided herein is licensed under the terms of the GNU Free Documentation License version 1.3 as published by the Free Software Foundation. Qt and respective logos are trademarks of The Qt Company Ltd. in Finland and/or other countries worldwide. All other trademarks are property of their respective owners.