Flutter：在谷歌 map 中使用堆栈时，任何小部件都不可见

Question

我有一个奇怪的错误，我在堆栈谷歌 map 中制作的任何小部件都是不可见的。 小部件仍然存在并且可以交互。 例如我制作了按钮，它可以点击并执行操作。 但它不可见。 我的flutter版本是3.3.9，google_map_flutter 2.2.2。

这是我的 map 加载创建时显示我的按钮

这是我创建时的 map

这是我的小部件树

Stack(
children: <Widget>[

  Container(
    child: Obx(
          () => GoogleMap(
        onTap: (position) {
          _customInfoWindowController.hideInfoWindow!();
        },
        onCameraMove: (position) {
          _customInfoWindowController.onCameraMove!();
        },
        onMapCreated: (GoogleMapController controller) {
          _customInfoWindowController.googleMapController =
              controller;
          newGoogleMapController = controller;
          updateCameraPosition(
              -8.466803395691676, 115.2199474850532, false);
        },
        zoomGesturesEnabled: false,
        myLocationEnabled: true,
        mapToolbarEnabled: true,
        zoomControlsEnabled: false,
        tiltGesturesEnabled: false,
        markers: Set<Marker>.of(markers.value),
        initialCameraPosition: _initialCameraPosition,
      ),
    ),
  ),


  Container(
    child: WidgetButton.btnStyle2(
        name: 'Update Camera Maps',
        action: () {
          updateCameraPosition(
              -8.371809235984502, 114.93838766787734, true);
        }),
  ),
  CustomInfoWindow(
    controller: _customInfoWindowController,
    height: 500,
    width: 500,
    offset: 50,
  ),
  ],
);

这是我的 flutter 医生 -v

[√] Flutter (Channel stable, 3.3.9, on Microsoft Windows [Version 10.0.22621.900], locale en-ID)
    • Flutter version 3.3.9 on channel stable at C:\android\flutter
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision b8f7f1f986 (3 weeks ago), 2022-11-23 06:43:51 +0900
    • Engine revision 8f2221fbef
    • Dart version 2.18.5
    • DevTools version 2.15.0

Checking Android licenses is taking an unexpectedly long time...[√] Android toolchain - develop for Android devices (Android SDK version 30.0.3)
    • Android SDK at C:\Users\User\AppData\Local\Android\sdk
    • Platform android-33, build-tools 30.0.3
    • Java binary at: C:\Program Files\Android\Android Studio\jre\bin\java
    • Java version OpenJDK Runtime Environment (build 11.0.13+0-b1751.21-8125866)
    • All Android licenses accepted.

[√] Chrome - develop for the web
    • Chrome at C:\Program Files (x86)\Google\Chrome\Application\chrome.exe

[√] Android Studio (version 2021.3)
    • Android Studio at C:\Program Files\Android\Android Studio
    • Flutter plugin can be installed from:
       https://plugins.jetbrains.com/plugin/9212-flutter
    • Dart plugin can be installed from:
       https://plugins.jetbrains.com/plugin/6351-dart
    • Java version OpenJDK Runtime Environment (build 11.0.13+0-b1751.21-8125866)

[√] VS Code (version 1.73.1)
    • VS Code at C:\Users\User\AppData\Local\Programs\Microsoft VS Code
    • Flutter extension version 3.54.0

也许我错过了一小步，我也尝试用谷歌搜索但没有解决方案。 flutter 似乎有错误 3. 我以前的项目在堆栈中正常运行 flutter 2. 甚至浮动操作按钮都不可见。

Answer 1

您是否尝试过像这样在每个小部件之上放置一个容器？

Stack(
children: <Widget>[

  Container(
    child: Obx(
          () => GoogleMap(
        onTap: (position) {
          _customInfoWindowController.hideInfoWindow!();
        },
        onCameraMove: (position) {
          _customInfoWindowController.onCameraMove!();
        },
        onMapCreated: (GoogleMapController controller) {
          _customInfoWindowController.googleMapController =
              controller;
          newGoogleMapController = controller;
          updateCameraPosition(
              -8.466803395691676, 115.2199474850532, false);
        },
        zoomGesturesEnabled: false,
        myLocationEnabled: true,
        mapToolbarEnabled: true,
        zoomControlsEnabled: false,
        tiltGesturesEnabled: false,
        markers: Set<Marker>.of(markers.value),
        initialCameraPosition: _initialCameraPosition,
      ),
    ),
  ),
  CustomInfoWindow(
    controller: _customInfoWindowController,
    height: 500,
    width: 500,
    offset: 50,
  ),
   Container(
    child: WidgetButton.btnStyle2(
        name: 'Update Camera Maps',
        action: () {
          updateCameraPosition(
              -8.371809235984502, 114.93838766787734, true);
        }),
  ),
  ],
);