67-Flutter中高德地圖插件的使用

一、註冊和創建高德API應用

高德網站：https://lbs.amap.com/

控制檯-應用管理-建立應用

在建立 Key

二、得到SHA1

進入Flutter項目中的android文件夾內，打開任意一個文件：

好比進入 build.gradle，右上角會有 Open for Editing an Android Studio

點擊一下，在新窗口打開該android項目：

打開後如圖所示：

點擊右側 Gradle>android>app>Tasks>android>signingReport

控制檯儘管打印了不少信息，可是 SHA1 是相同的，這就是咱們須要的值。

三、得到PackageName

四、配置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>

五、編寫代碼

須要先進入根目錄的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,
                ),
              ),

     );
  }

}

運行效果圖：