Flutter开发 -flutter百度地图接入指南，外加定位，反地理编码，这些功能组成一个类似饿了么的配送员配送界面，这些功能你心动么？

CodingFire

已于 2022-09-06 14:50:25 修改

阅读量1.4k

点赞数 1

CC 4.0 BY-SA版权

分类专栏： Flutter实用开发技巧合集文章标签： flutter地图百度地图定位反地理编码配送页面

于 2021-04-13 15:01:40 首次发布

本文链接：https://blog.youkuaiyun.com/CodingFire/article/details/115665907

Flutter实用开发技巧合集专栏收录该内容

34 篇文章 ¥19.90 ¥99.00

订阅专栏

超级会员免费看

本文介绍了在Flutter中如何接入百度地图，实现定位、反地理编码和配送员界面功能。通过引入地图库、设置初始化，创建地图，并利用特定库实现定位和反地理编码。同时，展示了抽屉功能、滑动按钮、插旗更新位置等组件的实现，提供了完整页面代码供参考。

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

今天这篇博客说的是地图和定位的问题，不一样的是，这是在flutter中处理地图，定位，反地理编码。

先看下做出来的效果如何：
在这里插入图片描述

目前用到的都是模拟数据，真实场景大家自己接入数据即可。

这里的功能分为几部分：

1.百度地图；
2.定位功能；（百度地图提供了定位功能，需要单独引入，但是这里选择使用其他的基于LBS的定位）
3.反地理编码；
4.抽屉功能；（就是这个可以拖拽的列表，可展开，可折叠）
5.滑动按钮；
6.插旗和更新位置信息；
7.总结和页面完整代码。

然后我们来一步步说明怎么来使用这些功能：

1.百度地图

百度地图flutter插件接入地址：http://lbsyun.baidu.com/index.php?title=flutter/loc

至于接入的部分，大家参照文档来接入，不再赘述。
引入地图库：

  flutter_baidu_mapapi_map: ^2.0.0

地图在接入后需要初始化：

    // 百度地图sdk初始化鉴权
    if (Platform.isIOS) {
      BMFMapSDK.setApiKeyAndCoordType(
          'xxxxxxxxxxxxxxxxxxxx', BMF_COORD_TYPE.COMMON);
    } else if (Platform.isAndroid) {
      // Android 目前不支持接口设置Apikey,
      // 请在主工程的Manifest文件里设置，详细配置方法请参考官网(https://lbsyun.baidu.com/)demo
      BMFMapSDK.setCoordType(BMF_COORD_TYPE.COMMON);
    }

这样就完成了地图的接入准备工作。

接着我们来创建地图：

  @override
  Container generateMap() {
    return Container(
      height: screenSize.height,
      width: screenSize.width,
      child: BMFMapWidget(
          onBMFMapCreated: (controller) {
            onBMFMapCreated(controller);
          },
          mapOptions: initMapOptions(latitude: dposition?.latitude ?? (widget.latitude ?? 39.928617), longitude: dposition?.longitude ?? (widget.longitude ?? 1