如何在 Flutter 中设置 Google Map 主题？答案

【问题标题】：How can I theme Google Map in Flutter?如何在 Flutter 中设置 Google Map 主题？
【发布时间】：2020-01-14 14:59:45
【问题描述】：

我有一个地图应用程序，我想在日出和日落时更改主题。为地图设置主题应该非常简单，但出现以下错误。

未处理的异常：NoSuchMethodError：方法 'setMapStyle' 在 null 上被调用。

这是我的 pubspec.yaml

assets:
  - assets/themes/map/day/
  - assets/themes/map/night/

我已经导入了以下包。

import 'package:flutter/services.dart' show rootBundle;

我在我的 initState() 中添加了以下行

rootBundle.loadString('assets/themes/map/night/night.json').then((string) {
      _mapStyle = string;
    });

这是我的地图控制器。

Completer<GoogleMapController> _mapController = Completer();

void _onMapCreated(GoogleMapController controller) {
    PermissionHandler()
        .checkPermissionStatus(PermissionGroup
            .locationWhenInUse) //check permission returns a Future
        .then(_updateStatus); // handling in callback to prevent blocking UI

    _mapController.complete(
     controller); // manages camera function (position, animation, zoom).

    controller.setMapStyle(_mapStyle);
    print("MAPSTYLE -> $_mapStyle");
  }

这是我的地图代码的开始

_userLocation == null
    ? Center(
        child: CircularProgressIndicator(
            backgroundColor: Theme.UniColour.primary[900],
        ))
        : GoogleMap(
            onMapCreated: _onMapCreated,
            initialCameraPosition:
                CameraPosition(
                    target: _userLocation,
                    zoom: _defaultZoom,
                    tilt: _tiltAngle),
                    ...
                    ...
                    ...

任何帮助将不胜感激。

【问题讨论】：

标签： google-maps flutter dart themes

【解决方案1】：

此代码对我有用。

controller.setMapStyle(await rootBundle.loadString('assets/styles/google_map.json'));

使用异步等待来防止竞争条件。

【讨论】：

那么您是说将 void _onMapCreated(GoogleMapController controller) { 更改为 void _onMapCreated(GoogleMapController controller) async { 然后将我的 rootbundle 行更改为您所拥有的？