Flutter中使用google_maps_flutter如何获取谷歌地图缩放数值

你可以通过google_maps_flutter自带的相机状态回调直接获取缩放值，无需额外适配双端，具体修改如下：

核心实现逻辑 #

GoogleMap组件提供了两个和视角变化相关的回调：

• onCameraMove：地图视角（缩放、平移、旋转）变化时持续触发，回调参数为当前的CameraPosition对象，直接读取其zoom属性即可拿到实时缩放值
• onCameraIdle：地图视角变化停止后触发一次，适合获取缩放结束后的最终值，也可在此处调用mapController.getZoom()异步获取缩放值

修改后的完整代码 #

import 'package:google_maps_flutter/google_maps_flutter.dart';
import 'package:geolocator/geolocator.dart';
import 'package:flutter/material.dart';

class GoogleMapPage extends StatefulWidget {
  const GoogleMapPage({Key? key}) : super(key: key);

  @override
  _GoogleMapPageState createState() => _GoogleMapPageState();
}

class _GoogleMapPageState extends State<GoogleMapPage> {
  // 改为可空类型避免定位失败时的类型转换异常
  Position? userLocation;
  late GoogleMapController mapController;
  // 新增变量存储当前缩放值，初始值和初始相机zoom参数一致
  double _currentZoom = 15;

  void _onMapCreated(GoogleMapController controller) {
    mapController = controller;
  }

  Future<Position?> _getLocation() async {
    try {
      userLocation = await Geolocator.getCurrentPosition(
          desiredAccuracy: LocationAccuracy.best);
    } catch (e) {
      userLocation = null;
    }
    return userLocation;
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      // 可选：顶部展示当前缩放值，用于测试
      appBar: AppBar(title: Text("当前缩放值：${_currentZoom.toStringAsFixed(1)}")),
      body: FutureBuilder(
        future: _getLocation(),
        builder: (BuildContext context, AsyncSnapshot snapshot) {
          if (snapshot.hasData && userLocation != null) {
            return GoogleMap(
              mapType: MapType.normal,
              onMapCreated: _onMapCreated,
              myLocationEnabled: true,
              initialCameraPosition: CameraPosition(
                  target: LatLng(userLocation!.latitude, userLocation!.longitude),
                  zoom: _currentZoom),
              // 新增：实时监听缩放变化
              onCameraMove: (CameraPosition position) {
                setState(() {
                  _currentZoom = position.zoom;
                });
              },
              // 可选：仅在缩放结束后获取最终值，注释掉上面的onCameraMove即可启用
              // onCameraIdle: () async {
              //   double finalZoom = await mapController.getZoom();
              //   setState(() {
              //     _currentZoom = finalZoom;
              //   });
              // },
            );
          } else {
            return const Center(
              child: Column(
                mainAxisAlignment: MainAxisAlignment.center,
                children: <Widget>[
                  CircularProgressIndicator(),
                ],
              ),
            );
          }
        },
      ),
    );
  }
}

额外注意 #

你原代码中userLocation = null as Position;属于强制类型转换，定位失败时会直接抛出类型转换异常，建议将userLocation定义为可空类型Position?避免崩溃。

内容的提问来源于stack exchange，提问作者Mohammed Nabil