Skip to content

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

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 7 commits into
base: main
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,10 @@

* Updates README to indicate that Andoid SDK <21 is no longer supported.

## 2.12.2

* Adds support for camera control button on web.

## 2.12.1

* Fixes typo in README.
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -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() {
Expand All @@ -72,6 +74,67 @@ 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'),
Expand Down Expand Up @@ -264,6 +327,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,
Expand Down Expand Up @@ -324,6 +389,11 @@ class MapUiBodyState extends State<MapUiBody> {
_myLocationButtonToggler(),
_myTrafficToggler(),
_nightModeToggler(),
if (kIsWeb) ...<Widget>[
_webCameraControlToggler(),
if (_webCameraControlEnabled)
_webCameraControlPositionToggler(),
]
],
),
),
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -21,6 +21,13 @@ dependencies:
google_maps_flutter_android: ^2.16.0
google_maps_flutter_platform_interface: ^2.11.0


# FOR TESTING AND INITIAL REVIEW ONLY. DO NOT MERGE.
# See https://github.com/flutter/flutter/blob/master/docs/ecosystem/contributing/README.md#changing-federated-plugins
dependency_overrides:
google_maps_flutter_platform_interface: {path: ../../../../packages/google_maps_flutter/google_maps_flutter_platform_interface}
google_maps_flutter_web: {path: ../../../../packages/google_maps_flutter/google_maps_flutter_web}

dev_dependencies:
build_runner: ^2.1.10
espresso: ^0.4.0
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -56,6 +56,7 @@ export 'package:google_maps_flutter_platform_interface/google_maps_flutter_platf
TileOverlay,
TileOverlayId,
TileProvider,
WebCameraControlPosition,
WebGestureHandling,
WeightedLatLng;

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -95,6 +95,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,
Expand Down Expand Up @@ -349,6 +351,16 @@ 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.
///
/// See [WebCameraControlPosition] for more details.
final WebCameraControlPosition? webCameraControlPosition;

/// This setting controls how the API handles cameraControl button on the map. 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
Expand Down Expand Up @@ -652,6 +664,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,
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -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.1
version: 2.12.2

environment:
sdk: ^3.6.0
Expand All @@ -26,6 +26,12 @@ dependencies:
google_maps_flutter_platform_interface: ^2.11.0
google_maps_flutter_web: ^0.5.12

# FOR TESTING AND INITIAL REVIEW ONLY. DO NOT MERGE.
# See https://github.com/flutter/flutter/blob/master/docs/ecosystem/contributing/README.md#changing-federated-plugins
dependency_overrides:
google_maps_flutter_platform_interface: {path: ../../../packages/google_maps_flutter/google_maps_flutter_platform_interface}
google_maps_flutter_web: {path: ../../../packages/google_maps_flutter/google_maps_flutter_web}

dev_dependencies:
flutter_test:
sdk: flutter
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -33,3 +33,7 @@ flutter:
uses-material-design: true
assets:
- assets/
# FOR TESTING AND INITIAL REVIEW ONLY. DO NOT MERGE.
# See https://github.com/flutter/flutter/blob/master/docs/ecosystem/contributing/README.md#changing-federated-plugins
dependency_overrides:
google_maps_flutter_platform_interface: {path: ../../../../packages/google_maps_flutter/google_maps_flutter_platform_interface}
Original file line number Diff line number Diff line change
Expand Up @@ -37,3 +37,7 @@ topics:
- google-maps
- google-maps-flutter
- map
# FOR TESTING AND INITIAL REVIEW ONLY. DO NOT MERGE.
# See https://github.com/flutter/flutter/blob/master/docs/ecosystem/contributing/README.md#changing-federated-plugins
dependency_overrides:
google_maps_flutter_platform_interface: {path: ../../../packages/google_maps_flutter/google_maps_flutter_platform_interface}
Original file line number Diff line number Diff line change
Expand Up @@ -32,3 +32,7 @@ flutter:
uses-material-design: true
assets:
- assets/
# FOR TESTING AND INITIAL REVIEW ONLY. DO NOT MERGE.
# See https://github.com/flutter/flutter/blob/master/docs/ecosystem/contributing/README.md#changing-federated-plugins
dependency_overrides:
google_maps_flutter_platform_interface: {path: ../../../../../packages/google_maps_flutter/google_maps_flutter_platform_interface}
Original file line number Diff line number Diff line change
Expand Up @@ -32,3 +32,7 @@ flutter:
uses-material-design: true
assets:
- assets/
# FOR TESTING AND INITIAL REVIEW ONLY. DO NOT MERGE.
# See https://github.com/flutter/flutter/blob/master/docs/ecosystem/contributing/README.md#changing-federated-plugins
dependency_overrides:
google_maps_flutter_platform_interface: {path: ../../../../../packages/google_maps_flutter/google_maps_flutter_platform_interface}
Original file line number Diff line number Diff line change
Expand Up @@ -27,3 +27,7 @@ dev_dependencies:

flutter:
uses-material-design: true
# FOR TESTING AND INITIAL REVIEW ONLY. DO NOT MERGE.
# See https://github.com/flutter/flutter/blob/master/docs/ecosystem/contributing/README.md#changing-federated-plugins
dependency_overrides:
google_maps_flutter_platform_interface: {path: ../../../../../../packages/google_maps_flutter/google_maps_flutter_platform_interface}
Original file line number Diff line number Diff line change
Expand Up @@ -35,3 +35,7 @@ topics:
- google-maps
- google-maps-flutter
- map
# FOR TESTING AND INITIAL REVIEW ONLY. DO NOT MERGE.
# See https://github.com/flutter/flutter/blob/master/docs/ecosystem/contributing/README.md#changing-federated-plugins
dependency_overrides:
google_maps_flutter_platform_interface: {path: ../../../packages/google_maps_flutter/google_maps_flutter_platform_interface}
Original file line number Diff line number Diff line change
@@ -1,3 +1,7 @@
## 2.11.2

* Adds support to camera control button on web.

## 2.11.1

* Updates READMEs and API docs.
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,8 @@ class MapConfiguration {
/// as either a full configuration selection, or an update to an existing
/// configuration where only non-null values are updated.
const MapConfiguration({
this.webCameraControlPosition,
this.webCameraControlEnabled,
this.webGestureHandling,
this.compassEnabled,
this.mapToolbarEnabled,
Expand Down Expand Up @@ -44,6 +46,16 @@ class MapConfiguration {
/// See [WebGestureHandling] for more details.
final WebGestureHandling? webGestureHandling;

/// This setting controls how the API handles cameraControl button position on the map. Web only.
///
/// See [WebCameraControlPosition] for more details.
final WebCameraControlPosition? webCameraControlPosition;

/// This setting controls how the API handles cameraControl button on the map. Web only.
///
/// See https://developers.google.com/maps/documentation/javascript/controls for more details.
final bool? webCameraControlEnabled;

/// True if the compass UI should be shown.
final bool? compassEnabled;

Expand Down Expand Up @@ -123,6 +135,14 @@ class MapConfiguration {
/// that are different from [other].
MapConfiguration diffFrom(MapConfiguration other) {
return MapConfiguration(
webCameraControlPosition:
webCameraControlPosition != other.webCameraControlPosition
? webCameraControlPosition
: null,
webCameraControlEnabled:
webCameraControlEnabled != other.webCameraControlEnabled
? webCameraControlEnabled
: null,
webGestureHandling: webGestureHandling != other.webGestureHandling
? webGestureHandling
: null,
Expand Down Expand Up @@ -188,6 +208,10 @@ class MapConfiguration {
/// replacing the previous values.
MapConfiguration applyDiff(MapConfiguration diff) {
return MapConfiguration(
webCameraControlPosition:
diff.webCameraControlPosition ?? webCameraControlPosition,
webCameraControlEnabled:
diff.webCameraControlEnabled ?? webCameraControlEnabled,
webGestureHandling: diff.webGestureHandling ?? webGestureHandling,
compassEnabled: diff.compassEnabled ?? compassEnabled,
mapToolbarEnabled: diff.mapToolbarEnabled ?? mapToolbarEnabled,
Expand Down Expand Up @@ -219,6 +243,8 @@ class MapConfiguration {

/// True if no options are set.
bool get isEmpty =>
webCameraControlPosition == null &&
webCameraControlEnabled == null &&
webGestureHandling == null &&
compassEnabled == null &&
mapToolbarEnabled == null &&
Expand Down Expand Up @@ -251,6 +277,8 @@ class MapConfiguration {
return false;
}
return other is MapConfiguration &&
webCameraControlPosition == other.webCameraControlPosition &&
webCameraControlEnabled == other.webCameraControlEnabled &&
webGestureHandling == other.webGestureHandling &&
compassEnabled == other.compassEnabled &&
mapToolbarEnabled == other.mapToolbarEnabled &&
Expand Down Expand Up @@ -278,6 +306,8 @@ class MapConfiguration {
@override
int get hashCode => Object.hashAll(<Object?>[
webGestureHandling,
webCameraControlPosition,
webCameraControlEnabled,
compassEnabled,
mapToolbarEnabled,
cameraTargetBounds,
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -44,4 +44,5 @@ export 'utils/marker.dart';
export 'utils/polygon.dart';
export 'utils/polyline.dart';
export 'utils/tile_overlay.dart';
export 'web_camera_control_position.dart';
export 'web_gesture_handling.dart';
Loading