Moved backgroundColor property from TileLayer to MapOptions (wi…

…th deprecations) (#1578)

lib/src/layer/tile_layer/tile_layer.dart

@@ -3,7 +3,6 @@ import 'dart:math' as math;
 
 import 'package:collection/collection.dart' show MapEquality;
 import 'package:flutter/material.dart';
-import 'package:flutter/widgets.dart';
 import 'package:flutter_map/plugin_api.dart';
 import 'package:flutter_map/src/layer/tile_layer/tile.dart';
 import 'package:flutter_map/src/layer/tile_layer/tile_bounds/tile_bounds.dart';
@@ -104,6 +103,11 @@ class TileLayer extends StatefulWidget {
  final TileDisplay tileDisplay;
 
  /// Color shown behind the tiles
+ @Deprecated(
+ 'Prefer `MapOptions.backgroundColor`. '
+ 'This property has been removed simplify interaction when using multiple `TileLayer`s. '
+ 'This property is deprecated since v6.',
+ )
  final Color backgroundColor;
 
  /// Provider with which to load map tiles
@@ -231,7 +235,7 @@ class TileLayer extends StatefulWidget {
  this.subdomains = const <String>[],
  this.keepBuffer = 2,
  this.panBuffer = 0,
- this.backgroundColor = const Color(0xFFE0E0E0),
+ this.backgroundColor = Colors.transparent,
  this.errorImage,
  TileProvider? tileProvider,
  this.tms = false,
@@ -474,7 +478,8 @@ class _TileLayerState extends State<TileLayer> with TickerProviderStateMixin {
 
  _tileScaleCalculator.clearCacheUnlessZoomMatches(map.zoom);
 
- return Container(
+ return ColoredBox(
+ // ignore: deprecated_member_use_from_same_package
  color: widget.backgroundColor,
  child: Stack(
  children: [

lib/src/map/options.dart

@@ -70,6 +70,8 @@ class MapOptions {
  final double? minZoom;
  final double? maxZoom;
 
+ final Color backgroundColor;
+
  /// see [InteractiveFlag] for custom settings
  final int? _interactiveFlags;
 
@@ -212,6 +214,7 @@ class MapOptions {
  double? scrollWheelVelocity,
  this.minZoom,
  this.maxZoom,
+ this.backgroundColor = const Color(0xFFE0E0E0),
  this.onTap,
  this.onSecondaryTap,
  this.onLongPress,

lib/src/map/widget.dart

@@ -101,6 +101,9 @@ class FlutterMapStateContainer extends State<FlutterMap> {
  child: ClipRect(
  child: Stack(
  children: [
+ Positioned.fill(
+ child: ColoredBox(color: options.backgroundColor),
+ ),
  OverflowBox(
  minWidth: camera.size.x,
  maxWidth: camera.size.x,