Flutter 高德地圖插件的使用

高德地圖使用的插件叫amap_base_flutter，也是國內用的最多的地圖一個插件。

1.注冊和建立高德API應用

需要先注冊一個賬號，這個需要到高德的網站進行，網站地址為：https://lbs.amap.com/。

有了賬號之后到控制台-應用管理-創建應用。

2.獲得SHA1

在創建應用的時候，需要填入SHA1，這個必須需要在Android Studio里進行，VS Code里還沒有摸清如何獲得，如果你知道如何獲得，可以文章下方留言。

3.獲得PackageName

這個的獲得比較簡單，打開/android/app/build.gradle文件，然后找到applicationId，這個就是packageName，比如我的項目的packageName就是com.example.amap_test。

把這兩項填寫好后，我們就可以開心的編寫程序了。

4.配置AndoridManifest.xml文件

這個文件在/android/app/src/main/AndroidManifest.xml，然后在<activity>標簽里，加入下面的代碼:

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

5.編寫代碼

需要先進入根目錄的pubspec.yaml文件，進行依賴注冊，這個package下載還是需要挺長時間的。

amap_base: ^0.3.5

寫完后點擊右上角的packages get，剩下的就是耐心等待。

進入lib/main.dart文件，寫入下面代碼。

進的要用import引入amap_base.dart文件。

import 'package:flutter/material.dart';
import 'package:amap_base/amap_base.dart';

void main()async{
  runApp(MyApp());

}

class MyApp extends StatelessWidget {
  // This widget is the root of your application.

  @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,
                ),
              ),
          
     );
  }

}

寫完代碼后，你要記得不要使用虛擬機進行測試，我在學習的時候，就是使用虛擬機測試，一直是黑屏，后來采用了真機測試，才能出現效果。