[google_maps_flutter] Add cameraControl enable/disable & position on web (#9089)

Add support to camera control button on web.

Fixes flutter/flutter#167137

## Pre-Review Checklist

[^1]: Regular contributors who have demonstrated familiarity with the repository guidelines only need to comment if the PR is not auto-exempted by repo tooling.

Author: 4rthurmonteiro

packages/google_maps_flutter/google_maps_flutter/CHANGELOG.md

@@ -1,5 +1,6 @@
-## NEXT
+## 2.13.0
 
+* Adds support for camera control button on web.
 * Updates minimum supported SDK version to Flutter 3.29/Dart 3.7.
 
 ## 2.12.3

packages/google_maps_flutter/google_maps_flutter/example/lib/map_ui.dart

@@ -61,6 +61,8 @@ class MapUiBodyState extends State<MapUiBody> {
   late GoogleMapController _controller;
   bool _nightMode = false;
   String _mapStyle = '';
+  bool _webCameraControlEnabled = true;
+  WebCameraControlPosition? _webCameraControlPosition;
 
   @override
   void initState() {
@@ -72,6 +74,64 @@ class MapUiBodyState extends State<MapUiBody> {
     super.dispose();
   }
 
+  Widget _webCameraControlToggler() {
+    return TextButton(
+      child: Text(
+        '${_webCameraControlEnabled ? 'disable' : 'enable'} web camera control',
+      ),
+      onPressed: () {
+        setState(() {
+          _webCameraControlEnabled = !_webCameraControlEnabled;
+        });
+      },
+    );
+  }
+
+  Widget _webCameraControlPositionToggler() {
+    return TextButton(
+      onPressed:
+          () => showDialog<void>(
+            context: context,
+            builder: (BuildContext context) {
+              return AlertDialog(
+                title: const Text('Web camera control position'),
+                content: Column(
+                  mainAxisSize: MainAxisSize.min,
+                  children: <Widget>[
+                    DropdownButton<WebCameraControlPosition>(
+                      hint: const Text('Web camera control position'),
+                      value: _webCameraControlPosition,
+                      items:
+                          WebCameraControlPosition.values
+                              .map(
+                                (WebCameraControlPosition e) =>
+                                    DropdownMenuItem<WebCameraControlPosition>(
+                                      value: e,
+                                      child: Text(e.name),
+                                    ),
+                              )
+                              .toList(),
+                      onChanged: (WebCameraControlPosition? value) {
+                        setState(() {
+                          _webCameraControlPosition = value;
+                        });
+                      },
+                    ),
+                    TextButton(
+                      onPressed: () {
+                        Navigator.pop(context);
+                      },
+                      child: const Text('Ok'),
+                    ),
+                  ],
+                ),
+              );
+            },
+          ),
+      child: const Text('change web camera control position'),
+    );
+  }
+
   Widget _compassToggler() {
     return TextButton(
       child: Text('${_compassEnabled ? 'disable' : 'enable'} compass'),
@@ -269,6 +329,8 @@ class MapUiBodyState extends State<MapUiBody> {
   @override
   Widget build(BuildContext context) {
     final GoogleMap googleMap = GoogleMap(
+      webCameraControlEnabled: _webCameraControlEnabled,
+      webCameraControlPosition: _webCameraControlPosition,
       onMapCreated: onMapCreated,
       initialCameraPosition: _kInitialPosition,
       compassEnabled: _compassEnabled,
@@ -326,6 +388,11 @@ class MapUiBodyState extends State<MapUiBody> {
               _myLocationButtonToggler(),
               _myTrafficToggler(),
               _nightModeToggler(),
+              if (kIsWeb) ...<Widget>[
+                _webCameraControlToggler(),
+                if (_webCameraControlEnabled)
+                  _webCameraControlPositionToggler(),
+              ],
             ],
           ),
         ),

packages/google_maps_flutter/google_maps_flutter/example/pubspec.yaml

@@ -19,7 +19,7 @@ dependencies:
     # the parent directory to use the current plugin's version.
     path: ../
   google_maps_flutter_android: ^2.16.1
-  google_maps_flutter_platform_interface: ^2.12.1
+  google_maps_flutter_platform_interface: ^2.14.0
 
 dev_dependencies:
   build_runner: ^2.1.10

packages/google_maps_flutter/google_maps_flutter/lib/google_maps_flutter.dart

@@ -56,6 +56,7 @@ export 'package:google_maps_flutter_platform_interface/google_maps_flutter_platf
         TileOverlay,
         TileOverlayId,
         TileProvider,
+        WebCameraControlPosition,
         WebGestureHandling,
         WeightedLatLng;
 

packages/google_maps_flutter/google_maps_flutter/lib/src/google_map.dart

@@ -99,6 +99,8 @@ class GoogleMap extends StatefulWidget {
     this.onMapCreated,
     this.gestureRecognizers = const <Factory<OneSequenceGestureRecognizer>>{},
     this.webGestureHandling,
+    this.webCameraControlPosition,
+    this.webCameraControlEnabled = true,
     this.compassEnabled = true,
     this.mapToolbarEnabled = true,
     this.cameraTargetBounds = CameraTargetBounds.unbounded,
@@ -353,6 +355,18 @@ class GoogleMap extends StatefulWidget {
   /// See [WebGestureHandling] for more details.
   final WebGestureHandling? webGestureHandling;
 
+  /// This setting controls how the API handles cameraControl button position on the map. Web only.
+  ///
+  /// If null, the Google Maps API will use its default camera control position.
+  ///
+  /// See [WebCameraControlPosition] for more details.
+  final WebCameraControlPosition? webCameraControlPosition;
+
+  /// Enables or disables the Camera controls. Web only.
+  ///
+  /// See https://developers.google.com/maps/documentation/javascript/controls for more details.
+  final bool webCameraControlEnabled;
+
   /// Identifier that's associated with a specific cloud-based map style.
   ///
   /// See https://developers.google.com/maps/documentation/get-map-id
@@ -684,6 +698,8 @@ class _GoogleMapState extends State<GoogleMap> {
 /// Builds a [MapConfiguration] from the given [map].
 MapConfiguration _configurationFromMapWidget(GoogleMap map) {
   return MapConfiguration(
+    webCameraControlPosition: map.webCameraControlPosition,
+    webCameraControlEnabled: map.webCameraControlEnabled,
     webGestureHandling: map.webGestureHandling,
     compassEnabled: map.compassEnabled,
     mapToolbarEnabled: map.mapToolbarEnabled,

packages/google_maps_flutter/google_maps_flutter/pubspec.yaml

@@ -2,7 +2,7 @@ name: google_maps_flutter
 description: A Flutter plugin for integrating Google Maps in iOS and Android applications.
 repository: https://github.com/flutter/packages/tree/main/packages/google_maps_flutter/google_maps_flutter
 issue_tracker: https://github.com/flutter/flutter/issues?q=is%3Aissue+is%3Aopen+label%3A%22p%3A+maps%22
-version: 2.12.3
+version: 2.13.0
 
 environment:
   sdk: ^3.7.0
@@ -23,8 +23,8 @@ dependencies:
     sdk: flutter
   google_maps_flutter_android: ^2.16.1
   google_maps_flutter_ios: ^2.15.4
-  google_maps_flutter_platform_interface: ^2.12.1
-  google_maps_flutter_web: ^0.5.12
+  google_maps_flutter_platform_interface: ^2.14.0
+  google_maps_flutter_web: ^0.5.14
 
 dev_dependencies:
   flutter_test: