flutter 集成高德地图map

在flutter 中如何集成地图呢?
效果:
flutter 集成高德地图map_第1张图片

 #高德地图
  flutter_2d_amap:
    git:
      url: https://github.com/simplezhli/flutter_2d_amap.git

这个地图主要包含功能:

  • 处理地图所需权限申请
  • 定位并自动移动地图至当前位置
  • 默认获取POI数据并返回
  • 支持传入经纬度来移动地图
  • 支持搜索POI

使用方式

flutter_2d_amap:
    git:
      url: https://github.com/simplezhli/flutter_2d_amap.git

import 'package:flutter_2d_amap/flutter_2d_amap.dart';


AMap2DView(
  onPoiSearched: (result){

  },
  onAMap2DViewCreated: (controller){

  },
)

Android

AndroidManifest.xml 中添加:


如果你的targetSdkVersion为27以上,则需要做以下配置来支持http明文请求(具体可以看demo),否则会导致地图加载不出:
AndroidManifest.xml 中添加:


在 res 下新增一个 xml 目录,然后创建一个名为:network_security_config.xml 文件:



    

iOS

使用前设置key:

Flutter2dAMap.setApiKey("配置你的key");

在info.plist中增加:

 NSLocationAlwaysAndWhenInUseUsageDescription
    地图功能需要您的定位服务,否则无法使用,如果您需要使用后台定位功能请选择“始终允许”。

    NSLocationAlwaysUsageDescription
    地图功能需要您的定位服务,否则无法使用。

    NSLocationWhenInUseUsageDescription
    地图功能需要您的定位服务,否则无法使用。

    io.flutter.embedded_views_preview
    

flutter 集成高德地图map_第2张图片

在新的studio 中flutter项目中安卓项目主要目录有

io.flutter.plugins
com.mallmanage.mall_manage

GeneratedPluginRegistrant 这类主要是进行注册插件的,如果你细心的话,你集成地图或者扫码之类的插件,可以看到里面注册信息

flutter 集成高德地图map_第3张图片

com.mallmanage.mall_manage 这个kotlin,如果是之前的老项目是Java,现在新的项目是kotlin,如果是之前老项目可能需要把Java代码转kotlin

老项目结构
flutter 集成高德地图map_第4张图片

你可能感兴趣的:(flutter开发)