如何在.NET MAUI（Android）应用中实现谷歌地图深色模式

由于.NET MAUI官方Map控件并未直接提供明暗模式绑定的API，需要通过平台自定义Handler对接原生地图的主题设置，以下是针对Android和iOS平台的具体实现：

1. 基础准备 #

现有Map初始化代码保持不变：

var map = new Map(mapSpan)
{
    MapType = MapType.Street,
    IsShowingUser = true,
    IsScrollEnabled = true,
    IsZoomEnabled = true,
    IsTrafficEnabled = false
};
layout.Add(map);

2. Android平台实现 #

在Platforms/Android目录下创建自定义Map Handler：

using Microsoft.Maui.Maps.Handlers;
using Google.Maps;

namespace YourAppName.Platforms.Android;

public class ThemedMapHandler : MapHandler
{
    protected override void ConnectHandler(MapView platformView)
    {
        base.ConnectHandler(platformView);
        // 初始化主题
        var context = Android.App.Application.Context;
        var currentTheme = context.Resources.Configuration.UiMode & Android.Content.Res.UiMode.NightMask;
        UpdateMapTheme(platformView, currentTheme == Android.Content.Res.UiMode.NightYes);
        
        // 监听系统主题变化
        context.RegisterReceiver(new ThemeChangeReceiver(this), new Android.Content.IntentFilter(Android.Content.Intent.ActionConfigurationChanged));
    }

    protected override void DisconnectHandler(MapView platformView)
    {
        Android.App.Application.Context.UnregisterReceiver(new ThemeChangeReceiver(this));
        base.DisconnectHandler(platformView);
    }

    internal void UpdateMapTheme(MapView mapView, bool isDarkMode)
    {
        var mapStyle = isDarkMode 
            ? MapStyle.FromRawResource(Resource.Raw.map_style_dark) 
            : MapStyle.FromRawResource(Resource.Raw.map_style_light);
        mapView.Map.SetMapStyle(mapStyle);
    }

    private class ThemeChangeReceiver : Android.Content.BroadcastReceiver
    {
        private readonly ThemedMapHandler _handler;
        public ThemeChangeReceiver(ThemedMapHandler handler) => _handler = handler;

        public override void OnReceive(Android.Content.Context? context, Android.Content.Intent? intent)
        {
            if (context == null || _handler.PlatformView == null) return;
            var currentTheme = context.Resources.Configuration.UiMode & Android.Content.Res.UiMode.NightMask;
            _handler.UpdateMapTheme(_handler.PlatformView, currentTheme == Android.Content.Res.UiMode.NightYes);
        }
    }
}

• 需在Android项目Resources/Raw目录下添加谷歌地图风格JSON文件：
  • map_style_dark.json：从谷歌地图样式编辑器生成深色主题样式
  • map_style_light.json：生成浅色主题样式
• 在MauiProgram.cs中注册Handler：

builder.ConfigureMauiHandlers(handlers =>
{
#if ANDROID
    handlers.AddHandler<Map, YourAppName.Platforms.Android.ThemedMapHandler>();
#endif
});

3. iOS平台实现 #

在Platforms/iOS目录下创建自定义Map Handler：

using Microsoft.Maui.Maps.Handlers;
using MapKit;

namespace YourAppName.Platforms.iOS;

public class ThemedMapHandler : MapHandler
{
    protected override void ConnectHandler(MKMapView platformView)
    {
        base.ConnectHandler(platformView);
        // 初始化主题
        UpdateMapTheme(platformView, UIKit.UIUserInterfaceStyle.Dark == UIKit.UITraitCollection.CurrentTraitCollection.UserInterfaceStyle);
    }

    public override void TraitCollectionDidChange(UIKit.UITraitCollection? previousTraitCollection)
    {
        base.TraitCollectionDidChange(previousTraitCollection);
        if (PlatformView == null) return;
        UpdateMapTheme(PlatformView, UIKit.UIUserInterfaceStyle.Dark == UIKit.UITraitCollection.CurrentTraitCollection.UserInterfaceStyle);
    }

    private void UpdateMapTheme(MKMapView mapView, bool isDarkMode)
    {
        mapView.OverrideUserInterfaceStyle = isDarkMode ? UIKit.UIUserInterfaceStyle.Dark : UIKit.UIUserInterfaceStyle.Light;
    }
}

• 在MauiProgram.cs中注册Handler：

builder.ConfigureMauiHandlers(handlers =>
{
#if IOS
    handlers.AddHandler<Map, YourAppName.Platforms.iOS.ThemedMapHandler>();
#endif
});

4. 补充说明 #

• 谷歌地图样式编辑器可自定义更贴合需求的主题样式，导出JSON后放入对应平台资源目录
• Android平台需确保添加ACCESS_NETWORK_STATE权限，用于加载在线地图样式
• iOS 13及以上版本支持自动跟随系统主题，低版本需额外适配逻辑

内容的提问来源于stack exchange，提问作者Søren Bech