Flutter Google Maps中TileOverlay透明度参数不生效的问题排查求助
Flutter Google Maps中TileOverlay透明度参数不生效的问题排查求助
大家好,我最近在做Flutter项目时,想给Google Maps里的TileOverlay设置半透明效果,但遇到了个棘手的问题:明明在TileOverlay里设置了transparency: 0.5,但实际显示出来的TileOverlay还是完全不透明的,就像直接覆盖在底图上一样,想请各位帮忙看看哪里出问题了🥺
我的需求与问题现状
- 目标:给Google Maps Flutter中的TileOverlay应用透明度,实现半透明效果
- 实际结果:TileOverlay完全不透明,没有任何半透明的表现
- 开发环境:
- Flutter Framework 版本:1db45f7408(11天前更新,2025-05-29)
- Flutter Engine 版本:308a517184(2周前更新,2025-05-23)
- Dart 版本:3.9.0 (build 3.9.0-100.2.beta)
- DevTools 版本:2.46.0
- 依赖包:
google_maps_flutter: ^2.12.2http: ^1.4.0
我已经尝试过的方法
- 在TileOverlay里调整
transparency参数(从0.0到1.0的所有数值都试过) - 执行了
flutter upgrade把Flutter升级到了最新版本
我的代码实现
下面是我当前的完整代码,麻烦各位帮忙看看哪里可能出错了:
class _BlackMarbleState extends State<BlackMarble> { GoogleMapController? mapController; final LatLng _center = const LatLng(21.0, 78.0); void _onMapCreated(GoogleMapController controller) { mapController = controller; } @override Widget build(BuildContext context) { return Scaffold( body: GoogleMap( onMapCreated: _onMapCreated, initialCameraPosition: CameraPosition(target: _center, zoom: 8.0), minMaxZoomPreference: MinMaxZoomPreference(1.0, 8.0), tileOverlays: { TileOverlay( tileOverlayId: TileOverlayId('VIIRS_Black_Marble'), tileProvider: BlackMarbleTileProvider(), zIndex: 1, transparency: 0.5, ), }, ), ); } } class BlackMarbleTileProvider extends TileProvider { BlackMarbleTileProvider(); @override Future<Tile> getTile(int x, int y, int? zoom) async { Uint8List? tileBytes; try { final url = '//gibs.earthdata.nasa.gov/wmts/epsg3857/best/VIIRS_Black_Marble/default/default/GoogleMapsCompatible_Level8/$zoom/$y/$x.png'; final response = await http.get(Uri.parse('https:$url')); if (response.statusCode == 200) { tileBytes = response.bodyBytes; } } catch (e) { log('Error fetching tile: $e'); } return Tile(256, 256, tileBytes); } }
我实在搞不懂为什么transparency参数完全不起作用,是我哪里用错了吗?有没有什么我没考虑到的细节?麻烦各位大佬帮我分析一下,谢谢!
内容来源于stack exchange
相关产品推荐
相关产品推荐

