flutter如何使用amap地图插件

在Flutter项目中集成高德地图AMap插件时遇到问题。按照官方文档添加依赖并配置AndroidManifest.xml后，运行应用始终无法显示地图，只出现灰色网格。已确认SHA1和包名配置正确，但控制台会报“INVALID_USER_KEY”错误。请问：

  1. 是否需要额外申请单独的Flutter插件Key？
  2. Android原生端是否需要单独配置？
  3. 是否有完整的Flutter+AMap集成流程示例？
2 回复

Flutter使用amap插件步骤：

  1. 安装amap_flutter_map插件
  2. 申请高德地图API Key
  3. 配置Android/iOS权限
  4. 在代码中引入并初始化
  5. 添加AMapWidget组件

注意：需配置平台相关设置。

更多关于flutter如何使用amap地图插件的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


在 Flutter 中使用高德地图（AMap）插件，可以通过 amap_flutter_map 和 amap_flutter_location 实现地图显示和定位功能。以下是详细步骤：

1. 添加依赖

在 pubspec.yaml 中添加依赖：

dependencies:
  amap_flutter_map: ^x.x.x  # 请使用最新版本
  amap_flutter_location: ^x.x.x

运行 flutter pub get 安装。

2. 配置平台参数

Android 配置：

  1. 在 AndroidManifest.xml 中添加权限和密钥：
<uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />
<application>
  <meta-data
    android:name="com.amap.api.v2.apikey"
    android:value="你的高德地图API密钥" />
</application>
  1. 在 android/app/src/main/java/.../MainActivity.kt 中初始化：
import com.amap.api.maps.MapsInitializer
class MainActivity : FlutterActivity() {
  override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    MapsInitializer.updatePrivacyShow(this, true, true)
    MapsInitializer.updatePrivacyAgree(this, true)
  }
}

iOS 配置：

  1. 在 Info.plist 中添加权限和密钥：
<key>io.flutter.embedded_views_preview</key>
<true/>
<key>AMapApiKey</key>
<string>你的高德地图API密钥</string>
<key>NSLocationWhenInUseUsageDescription</key>
<string>需要定位权限</string>
  1. 在 Podfile 中追加：
post_install do |installer|
  flutter_post_install(installer)
  installer.pods_project.targets.each do |target|
    target.build_configurations.each do |config|
      config.build_settings['BUILD_LIBRARY_FOR_DISTRIBUTION'] = 'YES'
    end
  end
end

3. 基本使用示例

import 'package:amap_flutter_map/amap_flutter_map.dart';
import 'package:amap_flutter_location/amap_flutter_location.dart';

class MapPage extends StatefulWidget {
  @override
  _MapPageState createState() => _MapPageState();
}

class _MapPageState extends State<MapPage> {
  final AmapController _mapController = AmapController();

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: AMapWidget(
        apiKey: '你的高德地图API密钥',
        onMapCreated: (controller) {
          _mapController = controller;
        },
        initialCameraPosition: CameraPosition(
          target: LatLng(39.909, 116.397), // 初始坐标（北京）
          zoom: 15, // 缩放级别
        ),
      ),
    );
  }
}

4. 定位功能集成

final AMapFlutterLocation _location = AMapFlutterLocation();

// 开始定位
void startLocation() {
  _location.startLocation();
  _location.onLocationChanged.listen((Map<String, Object> result) {
    print("定位结果: $result");
  });
}

// 停止定位
void stopLocation() {
  _location.stopLocation();
}

@override
void dispose() {
  _location.destroy();
  super.dispose();
}

注意事项：

  1. 获取 API 密钥：需前往高德开放平台申请。
  2. 权限处理：在 Android 和 iOS 中需动态申请位置权限，可使用 permission_handler 插件。
  3. 初始化：确保在 MainActivity 和 AppDelegate 中完成隐私合规初始化。

通过以上步骤即可在 Flutter 中集成高德地图的基础功能。如需更多高级功能（如标记、路线规划等），请参考官方文档。

回到顶部