1、注册和建立高德API应用

高德网站:https://lbs.amap.com/

控制台-应用管理-创建应用

在创建 Key

2、获得SHA1

进入Flutter项目中的android文件夹内,打开任意一个文件:

比如进入 build.gradle,右上角会有 Open for Editing an Android Studio

点击一下,在新窗口打开该android项目:

打开后如图所示:

点击右侧 Gradle>android>app>Tasks>android>signingReport

控制台尽管打印了很多信息,但是 SHA1 是相同的,这就是我们需要的值。

3、获得PackageName

4、配置AndoridManifest.xml文件

在AndroidManifest.xml的application标签中配置Key:

https://lbs.amap.com/api/android-location-sdk/gettingstarted/

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

5、编写代码

需要先进入根目录的pubspec.yaml文件,进行依赖注册。

amap_base: ^0.3.5

main.dart 文件全部测试代码:

import 'package:flutter/material.dart';
import 'package:amap_base/amap_base.dart'; void main()async{
  runApp(MyApp()); } class MyApp extends StatelessWidget {   @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(         primarySwatch: Colors.blue,
      ),
      home: MyHomePage(title: '高德地图测试'),
    );
  }
} class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);
  final String title;   @override
  _MyHomePageState createState() => _MyHomePageState();
} class _MyHomePageState extends State<MyHomePage> {   AMapController _controller;   @override
  Widget build(BuildContext context) {     return Scaffold(
      appBar: AppBar(         title: Text(widget.title),
      ),
      body:AMapView(
              onAMapViewCreated: (controller) {
                _controller = controller;
              },
              amapOptions: AMapOptions(
                compassEnabled: false,
                zoomControlsEnabled: true,
                logoPosition: LOGO_POSITION_BOTTOM_CENTER,
                camera: CameraPosition(
                  target: LatLng(41.851827, 112.801637),
                  zoom: 4,
                ),
              ),      );
  } }

运行效果图:

67-Flutter中高德地图插件的使用的更多相关文章

  1. 最全vue的vue-amap使用高德地图插件画多边形范围

    一.在vue-cli的框架下的main.js(或者main.ts)中引入高德插件,代码如下: import Vue from 'vue' import VueAMap from 'vue-amap' ...

  2. Flutter中的日期插件date_format 中文 国际化 及flutter_cupertino_date_picker

    今天我们来聊聊Flutter中的日期和日期选择器. Flutter中的日期和时间戳 //日期时间戳转换 var _nowTime = DateTime.now();//获取当前时间 print(_no ...

  3. Flutter 使用高德地图定位

    amap_location 包 获取debug SHA1 // 使用debug.keystore获取debug SHA1 C:\Users\ajanuw\.android>keytool -li ...

  4. vue.js 使用高德地图

    1.获取key值 注册成为高德开发者需要分三步: 第一步,注册高德开发者: 第二步,去控制台创建应用: 第三步,获取Key 2.修改配置文件  webpack.base.conf.js externa ...

  5. vue 里面异步加载高德地图

    前言 关于Vue 里面使用异步加载高德地图 项目中其实只有几处需要用到地图,不需要全局引入 在index文件中引入js会明显拖慢首屏加载速度,虽然可以使用异步加载script的方式解决,但是始终觉得不 ...

  6. web集成高德地图

    1.使用高德地图API需到官网添加一个Key,http://lbs.amap.com/dev/key/app 2.页面头引入 <div id="addressMap"> ...

  7. 高德地图与CAD图叠加显示方法汇总及优缺点分析

    前言 ​ 高德地图应用在许多领域,平常我们用的地图导航,除过正常的地图导航指引功能之外,其实还有很多实用的功能.如高德影像地图应用在包括地理.土地测量.水文学.生态学.气象学以及海洋学等方面.Auto ...

  8. 【krpano】高德地图导航插件(源码+介绍+预览)

    简介 krpano可以利用js调用第三方网页版地图,因此可以实现导航效果,用来帮助用户导航到我们全景所在的位置. 效果截图如下,在手机端点击左侧按钮,便会对用户进行定位,跳转至高德地图进行导航     ...

  9. 【高德地图API】从零开始学高德JS API(二)地图控件与插件——测距、圆形编辑器、鼠标工具、地图类型切换、鹰眼鱼骨

    原文:[高德地图API]从零开始学高德JS API(二)地图控件与插件——测距.圆形编辑器.鼠标工具.地图类型切换.鹰眼鱼骨 摘要:无论是控件还是插件,都是在一级API接口的基础上,进行二次开发,封装 ...

随机推荐

  1. 钉钉与wcp知识库集成工具

    dingding-wcp 钉钉(dingding)的wcp(知识库)集成通知,非常简单的小工具.(wcp版本 V.free.4.0.4) git: https://gitee.com/chejiang ...

  2. 公众号后台开发(SpingMVC接收与响应公众号消息)

    1.准备 1.准备服务 与微信对接的url要具备以下条件: (1)在公网上能够访问 (2)端口只支持80端口 在这里如果是公网能够访问的服务最好,也可以通过花生壳或者其他外网映射工具进行映射,比如ng ...

  3. springmvc流程图以及配置

    springmvc:是完成数据的封装和跳转的功能 流程图如下: springmvc的配置流程 1.导入jar包 二.配置servlet文件 init-param的作用是在启动servlet启动时规定其 ...

  4. golang --rune

    rune 是int32的别名类型,专用于存储Unicode编码的单个字符 我们可以用5种方式来表示一个rune字面量: 该rune字面量所对应的字符,如'a'必须是Unicode编码规范所支持的 使用 ...

  5. 前端1-----A标签 (锚点)

    Title 头部,顶端, 点击跳转到id='abc' 1 2 到百度这里,点击跳转百度 3 到这里了 4 alex1 5 6 根据id 从底部到头      根据id='a1' 到指定位置      ...

  6. 【开发笔记】-MySQL数据库5.7+版本,编码格式设置

    原因 昨天不小心把数据库搞崩了,重装了5.7.27版本得mysql数据库,在安装过程中并没有设置数据库默认编码格式等操作.在把项目启动后,jpa自动创建表结构,会把数据库,表,字段的编码自动设置为IS ...

  7. grid网格布局——色子布局

    一.基本概念 样式 含义 grid-area 定义名称 grid-auto-columns 定义列数 grid-auto-flow 定义单元格流动方向(想象水流的样子) grid-auto-rows ...

  8. SQL注入(1)

    一.注入点的判断及猜解1.加入单引号 ’提交,结果:如果出现错误提示,则该网站可能就存在注入漏洞.2.数字型判断是否有注入;语句:and 1=1 ;and 1=2 (经典).' and '1'=1(字 ...

  9. python __getattr__ & __getattribute__ 学习

    实例属性的获取和拦截, 仅对实例属性(instance, variable)有效, 非类属性 getattr: 适用于未定义的属性, 即该属性在实例中以及对应的类的基类以及祖先类中都不存在 1. 动态 ...

  10. 转载: JavaScript中执行环境和栈

    在这篇文章中,我会深入理解JavaScript最根本的组成之一 : "执行环境(执行上下文)".文章结束后,你应该对解释器试图做什么,为什么一些函数/变量在未声明时就可以调用并且他 ...