Flutter GoogleMapで最初に描画されるページを現在地にする

Question

前提・実現したいこと

FlutterにてGoogleMapを表示するアプリを作成しています。
画面起動時に表示される地点をユーザーの現在地にしたいと考えています。

下記のパッケージを利用しています

google_maps_flutter: ^2.0.6
geolocator: ^7.2.0+1

発生している問題・エラーメッセージ

ユーザーの現在地を取得するために、static LatLng _initialPositionを最初に定義していますが、そこで下記のエラーが出ています。

The non-nullable variable '_initialPosition' must be initialized.
Try adding an initializer expression.

lateをつけると解決するというような情報を得たのでstatic late LatLng _initialPosition;のようにすると、VScode上ではエラーは出なくなりますが、ビルドしたときに下記のエラーが出ます

例外が発生しました
LateError (LateInitializationError: Field '_initialPosition@<ここになにかの数字が入っている>' has not been initialized.)

またこのエラーに関してはブレークポイントをつけないと、iPhone上に一瞬だけ表示され、その後消えて現在地でマップが起動するようになっています。

該当のソースコード

一部_createMarker()など本質問を関係ない箇所は削除しています。

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

class MapBody extends StatefulWidget {
  @override
  _MapBody createState() => _MapBody();
}

class _MapBody extends State<MapBody> {
  Completer<GoogleMapController> _controller = Completer();
  static LatLng _initialPosition;

  @override
  void initState() {
    super.initState();
    _getUserLocation();
  }

  void _getUserLocation() async {
    Position position = await Geolocator.getCurrentPosition(
        desiredAccuracy: LocationAccuracy.high);
    setState(() {
      _initialPosition = LatLng(position.latitude, position.longitude);
      print(position);
    });
  }

//  static final CameraPosition _kGooglePlex = CameraPosition(
//    target: LatLng(35.6809591, 139.7673068),
//    zoom: 14.4746,
//  );

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: SafeArea(
        child: Stack(
          fit: StackFit.expand,
          children: [
            GoogleMap(
              initialCameraPosition: CameraPosition(
                target: _initialPosition,
                zoom: 14.4746,
              ),
              onMapCreated: (GoogleMapController controller) {
                _controller.complete(controller);
              },
              markers: _createMarker(),
              myLocationEnabled: true,
              myLocationButtonEnabled: true,
              mapToolbarEnabled: false,
              buildingsEnabled: true,
              onTap: (LatLng latLang) {
                print('Clicked: $latLang');
              },
            ),
            buildFloatingSearchBar(),
          ],
        ),
      ),
    );
  }

試したこと

• static LatLng _initialPosition;が定義されていないということが原因だと考え、適当に東京駅の座標を入れて見ましたが、そうすると端末の現在地ではなく、東京駅が表示されてしまいました。
• static late LatLng _initialPosition;にしてみましたが、下記エラーが出てしまいました。

例外が発生しました
LateError (LateInitializationError: Field '_initialPosition@<ここになにかの数字が入っている>' has not been initialized.)

補足情報（FW/ツールのバージョンなど）

flutter --version
Flutter 2.2.1 • channel stable • https://github.com/flutter/flutter.git
Framework • revision 02c026b03c (7 weeks ago) • 2021-05-27 12:24:44 -0700
Engine • revision 0fdb562ac8
Tools • Dart 2.13.1

geolocator: ^7.2.0+1
google_maps_flutter: ^2.0.6

---

参考にしたページは下記です。
Flutter Google Maps not determining current location of device

このころとは変わり、null safetyへの対応で変わってしまったと考えています。

以上、よろしくお願いいたします。

Answer 1

画面のデータを準備し終わる前に表示に入っている為だと思われます。
一旦これを試してみてはどうでしょう。

bool _loading;
@override
  void initState() {
    super.initState();
    _loading = true;
    _getUserLocation();
}

void _getUserLocation() async {
    Position position = await Geolocator.getCurrentPosition(
        desiredAccuracy: LocationAccuracy.high);
    _initialPosition = LatLng(position.latitude, position.longitude);
    setState(() {
      _loading = false;
    });
}

@override
  Widget build(BuildContext context) {
    return Scaffold(
      body: _loading
        ?CircularProgressIndicator() 
        :SafeArea(
        child: Stack(
          fit: StackFit.expand,
          children: [
            GoogleMap(
              initialCameraPosition: CameraPosition(
                target: _initialPosition,
                zoom: 14.4746,
              ),
              onMapCreated: (GoogleMapController controller) {
                _controller.complete(controller);
              },
              markers: _createMarker(),
              myLocationEnabled: true,
              myLocationButtonEnabled: true,
              mapToolbarEnabled: false,
              buildingsEnabled: true,
              onTap: (LatLng latLang) {
                print('Clicked: $latLang');
              },
            ),
            buildFloatingSearchBar(),
          ],
        ),
      ),
    );
  }

追記　コードを書くところにコードを入れました。

Comments

[t-sakurai816]

ご回答ありがとうございます！

試したところ、`bool _loading;`の箇所でエラーが出ていたので、`late bool _loading;`としたところ、解決できました！！ありがとうございます！

> 画面のデータを準備し終わる前に表示に入っている為だと思われます。

こちらが原因だと思われます。ありがとうございます！

Answer 2

_initialPosition変数がクラスメンバー（static）になっているため出たエラーだと思います。
インスタンスメンバーにしてみてください。

class _MapBody extends State<MapBody> {
  Completer<GoogleMapController> _controller = Completer();
  // ↓ static 削除、late 追加
  late LatLng _initialPosition;

  @override
  void initState() {
    super.initState();
    _getUserLocation();
  }

  void _getUserLocation() async {
    Position position = await Geolocator.getCurrentPosition(
        desiredAccuracy: LocationAccuracy.high);
    setState(() {
      _initialPosition = LatLng(position.latitude, position.longitude);
      print(position);
    });
  }

Comments

[t-sakurai816]

ご回答ありがとうございます。
試してみましたが、同じような下記エラーが出てしまいます

```
LateError (LateInitializationError: Field '_initialPosition@数字' has not been initialized.)
```