Flutter 地图

一个使用 Google Maps SDK 和 Directions API 的 Flutter 应用

Flutter Maps

插件

本项目使用的插件有：

功能

  • 检测用户当前位置
  • 使用 Geocoding 将地址转换为坐标，反之亦然
  • 向地图视图添加标记
  • 使用 Polylines 和 Directions API 在两个地点之间绘制路线
  • 计算路线的实际距离

用法

在使用之前，您需要在 Google Cloud Platform 中创建一个新项目，并为此项目启用 Google Maps API。同时，请勿忘记在 GCP 中为该项目设置 账单，否则您将收到以下错误。

  • 克隆仓库。

    git clone https://github.com/sbis04/flutter_maps.git

  • 使用您喜欢的 IDE 打开项目。使用 VS Code 打开

    code flutter_maps

  • 对于 Android 部分，转到 android/app/src/main/AndroidManifest.xml 文件，然后在此处添加您的 API 密钥。

    <!-- Add your Google Maps API Key here -->
<meta-data android:name="com.google.android.geo.API_KEY"
               android:value="YOUR KEY HERE"/>

  • 对于 iOS 部分，转到 ios/Runner/AppDelegate.swift 文件，然后在此处添加您的 API 密钥。

    GMSServices.provideAPIKey("YOUR KEY HERE")

  • 转到 lib/secrets.dart 文件，然后在此处添加您的 API 密钥。

完整配置（在此项目中已完成）

如果您克隆此项目，则无需完成这些配置，因为它们已在其中完成。但如果您为使用 Google Maps 和位置服务设置新的 Flutter 项目，这些可能会有所帮助。

Android 设置

  • 导航到文件 android/app/src/main/AndroidManifest.xml，并在 application 标签内添加以下代码片段。

    <!-- Add your Google Maps API Key here -->
<meta-data android:name="com.google.android.geo.API_KEY"
               android:value="YOUR KEY HERE"/>

  • 此外，您还需要应用的位置访问权限。因此，在此文件的 manifest 标签内添加以下权限。

    <uses-permission android:name="android.permission.ACCESS_FINE_LOCATION"/>

iOS 设置

  • 导航到文件 ios/Runner/AppDelegate.swift，并将所有代码替换为以下内容。

    import UIKit
import Flutter
import GoogleMaps

@UIApplicationMain
@objc class AppDelegate: FlutterAppDelegate {
  override func application(
    _ application: UIApplication,
    didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?
  ) -> Bool {
    //Add your Google Maps API Key here
    GMSServices.provideAPIKey("YOUR KEY HERE")
    GeneratedPluginRegistrant.register(with: self)
    return super.application(application, didFinishLaunchingWithOptions: launchOptions)
  }
}

  • 另外，将以下内容添加到 ios/Runner/Info.plist 文件中。

    <key>io.flutter.embedded_views_preview</key>
<string>YES</string>

  • 为了获取位置权限，请将以下内容添加到同一个文件中。

    <key>NSLocationWhenInUseUsageDescription</key>
<string>This app needs access to location when open.</string>

这完成了 Flutter 中两个平台的设置。

许可证

版权所有 (c) 2020 Souvik Biswas

特此授予任何人复制本软件及相关文档文件（“软件”）的权利，并可对此软件进行任何方式的限制，包括但不限于使用、复制、修改、合并、发布、分发、再许可和/或销售软件副本的权利，以及允许接收软件的人这样做，但须遵守以下条件：

以上版权声明和本许可声明应包含在软件的所有副本或实质性部分中。

本软件“按原样”提供，不附带任何明示或暗示的担保，包括但不限于适销性、特定用途的适用性和非侵权的担保。在任何情况下，作者或版权持有人均不对因本软件的使用或交易引起的或与之相关的任何索赔、损害或其他责任负责，无论是合同、侵权或其他行为。

GitHub

查看 Github