fluttergoogle-mapswebelevationdetach

adding Container in front of GoogleMap Widget


I'm working on a flutter app, for Android and Web. I have a stack of GoogleMap widget and a Container like this :

Stack(children: <Widget>[
    GoogleMap(),
    Container()])

The container is in front of the map, and have some buttons inside. On Android, it work pretty fine, but on web, the container is well displayed, but have a bizarre behavior. It's like the map is in front of him, I can move the map, even if i start dragging on the container. And that creating an annoying issue, when i'm clicking on the container's buttons, it's like i'm clicking on the map .. And guess what, for the FAB buttons in front of it, it's doing the same thing !

So, i'm searching for an elevation property or something like this, that can detach the container from the map. And if it's impossible, i would display my container somewhere else.

Thank you ^^

PS i'm using : google_maps_flutter: ^2.0.6 and google_maps_flutter_web: ^0.3.0+3

Flutter doctor is fine


Solution

  • PointerInterceptor Widget seems to be the best solver for this issue. https://pub.dev/packages/pointer_interceptor
    It work prety fine !
    More infos on the pub page ^^

    Stack(children: <Widget>[
        GoogleMap(),
        PointerInterceptor(
            child: Container())])