flutter 集成高德地图map

在flutter 中如何集成地图呢?
效果:
在这里插入图片描述

 #高德地图
  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 中添加:

<meta-data
     android:name="com.amap.api.v2.apikey"
     android:value="配置你的key"/>

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

<application
  android:networkSecurityConfig="@xml/network_security_config"
/>

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

<?xml version="1.0" encoding="utf-8"?>
<network-security-config>
    <base-config cleartextTrafficPermitted="true" />
</network-security-config>
iOS

使用前设置key:

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

在info.plist中增加:

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

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

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

    <key>io.flutter.embedded_views_preview</key>
    <true/>

在这里插入图片描述

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

io.flutter.plugins
com.mallmanage.mall_manage

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

在这里插入图片描述

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

老项目结构
在这里插入图片描述

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值