Flutter 调用高德地图APP实现位置搜索、路线规划、逆地理编码

最新推荐文章于 2025-03-26 16:53:35 发布

早起的年轻人

最新推荐文章于 2025-03-26 16:53:35 发布

阅读量3.3k

点赞数 2

分类专栏： Flutter项目开发全套教程文章标签： flutter android ios

本文链接：https://blog.csdn.net/zl18603543572/article/details/125465541

版权

Flutter项目开发全套教程专栏收录该内容

285 篇文章

订阅专栏

这篇博客介绍了如何在Flutter应用中集成高德地图API，实现调起地图进行位置搜索和导航。首先在`pubspec.yaml`配置文件中添加`url_launcher`依赖，并在iOS的`info.plist`配置允许访问地图。接着展示了调用高德地图进行反地理编码和导航的代码示例，特别提到了坐标类型的正确选择，以避免位置偏移。最后，博客中使用了GetX框架展示提示框。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1 开发准备

pubspec.yaml 配置文件中添加插件

dependencies:
  flutter:
    sdk: flutter
  url_launcher: ^6.1.2

iOS 配置 info.plist

<key>LSApplicationQueriesSchemes</key>
<array>
	<string>iosamap</string>
	<string>baidumap</string>
</array>

2 Flutter 调起高德地图 - 搜索位置逆地理编码

高德地图开发文档

     static Future<bool> openAmap(
      double longitude,
      double latitude, {
        String? address,
        String? title,
        bool showErr = true,
      }) async {
    String url =
        '${Platform.isAndroid ? 'android' : 'ios'}amap://viewReGeo?sourceApplication=${title??""}&lat=$latitude&lon=$longitude&dev=0';
    if (Platform.isIOS) url = Uri.encodeFull(url);
    try {
      if (await canLaunchUrlString(url)) {
        await launchUrlString(url);
        return true;
      } else {
        if (showErr) showToastCommon('无法调起高德地图');
        return false;
      }
    } on Exception catch (e) {
      if (showErr) showToastCommon('无法调起高德地图');
      return false;
    }
  }

实际上是调用的高德地图开放api 反向地址解析
在这里插入图片描述

调起的结果如下：
在这里插入图片描述

3 坐标类型选择

需要注意的是 dev 坐标类型的取值

0 使用经纬度是已经加密后的,不需要国测加密;
1 使用经纬度是未加密的,需要国测加密;

如果不传递正确的坐标类型参数，会导致地点坐标位置偏移。默认为bd09经纬度坐标。

4 Flutter 调起高德地图 - 导航路线规划

高德地图开发文档

/// 高德地图调用 导航
  static Future<bool> openAmapNav(
    double longitude,
    double latitude, {
    String? address,
    bool showErr = true,
  }) async {
    String url =
        '${Platform.isAndroid ? 'android' : 'ios'}amap://navi?sourceApplication=amap&lat=$latitude&lon=$longitude&dev=0&style=2&poiname=${address ?? ''}';
    if (Platform.isIOS) url = Uri.encodeFull(url);
    try {
      if (await canLaunchUrlString(url)) {
        await launchUrlString(url);
        return true;
      } else {
        if (showErr) showToastCommon('无法调起高德地图');
        return false;
      }
    } on Exception catch (e) {
      if (showErr) showToastCommon('无法调起高德地图');
      return false;
    }
  }

实际上是调用的
在这里插入图片描述

5 提示框使用的是 GetX 框架

  static showToastCommon(String message) {
    Get.defaultDialog(
        title: "提示",
        middleText: message,
        backgroundColor: Colors.white,
        titleStyle: const TextStyle(color: Colors.black),
        middleTextStyle: const TextStyle(color: Colors.red),
        textConfirm: "知道了",
        confirmTextColor: Colors.white,
        onConfirm: () {
          Get.back();
        },
        radius: 8);
  }
}