0

I get this issue only in Flutter Web, when I add some widgets over the Google Map widget(overlay), the click and cursor functionality doesn't work properly and on every widget I click it triggers the GoogleMap widget as well.

This is an example: Image Screenshot, I used the Stack widget and put GoogleMap and the other widgets in it.

Here's the code: When you click on the button you will see onTap function of the GoogleMap will triggers as well

main(){
  runApp(MaterialApp(
    home: Home(),
  ));
}

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

  @override
  State<Home> createState() => _HomeState();
}

class _HomeState extends State<Home> {
  late CameraPosition _cameraPosition;

  @override
  void initState() {
    super.initState();
    _cameraPosition = const CameraPosition(
      target: LatLng(52.046846, 4.299154),
      zoom: 20,
    );
  }

  @override
  Widget build(BuildContext context) {
    double width = MediaQuery.of(context).size.width;
    double height = MediaQuery.of(context).size.height;
    return Scaffold(
      body: SizedBox(
        height: height,
        width: width,
        child: Stack(
          children: [
            GoogleMap(
              initialCameraPosition: _cameraPosition,
              onTap: (latlng){
                ScaffoldMessenger.of(context).showSnackBar(const SnackBar(content: Text('on Map Tap')));
              },
            ),
            Align(
              alignment: Alignment.center,
              child: ElevatedButton(
                onPressed: (){
                  ScaffoldMessenger.of(context).showSnackBar(const SnackBar(content: Text('Yay! A SnackBar!')));
                },
                child: const Text("Click me"),
              ),
            ),
          ],
        ),
      ),
    );
  }
}

Is there any way to fix these issues? Thanks in advance.

Amin Sajadi
  • 25
  • 5
  • You need to asssign a static height to Stack Widget or else your touch gestures won't work. Wrap your Stack with SizedBox and assign a static height – Prashant Jan 02 '23 at 12:21
  • Please provide enough code so others can better understand or reproduce the problem. – Community Jan 02 '23 at 12:22
  • @Prashant Thanks for the reply, I tried it and it still doesn't work. I added the code to the question. can you please help me? on every widget I click the map onTap will trigger as well. – Amin Sajadi Jan 02 '23 at 12:54

1 Answers1

1

As I saw here you can use pointer_interceptor on top of your button to avoid triggers map.

Something like this:

 PointerInterceptor(
    child: ElevatedButton(...),
  )
fatemeh akhlaghi
  • 31
  • 4