This article provides a comprehensive guide on leveraging the Maps feature from the .NET MAUI Community Toolkit in a WinUI 3 App through the robust Embedding feature.
The CommunityToolkit.Maui.Maps NuGet package provides access to Bing Maps through a WebView on Windows. The Handler definitions for the Windows platform for the .NET MAUI Maps feature are hosted in this package.
To ensure the Maps feature functions correctly on the native WinUI 3 App, it is imperative to slightly adjust the feature initialization in the MAUI pipeline.
The toolkit’s initialization invokes the Maps feature, sets its Key, and finally adds the much-needed Handler definition for the Windows platform.
However, when attempting to use the Maps feature directly in a native WinUI 3 app, it leads to a Not-Implemented exception.
To address this issue, employ the modified initialization code outlined below.
This code utilizes reflection to set the Maps key and map the Handler definition, ensuring proper functionality within a WinUI 3 App.
using CommunityToolkit.Maui.Maps.Handlers;
using Microsoft.Maui.Controls.Maps;
using Microsoft.Maui.Hosting;
using System.Reflection;
namespace MapsApp.Extensions;
public static class AppBuilderExtensions
{
public static MauiAppBuilder UseMauiToolkitMaps(this MauiAppBuilder builder, string key)
{
SetMapsKey(key);
builder.ConfigureMauiHandlers(handlers => handlers.AddHandler<Map, MapHandlerWindows>());
return builder;
static void SetMapsKey(string key)
{
var mapsKey = typeof(MapHandlerWindows).GetField("MapsKey", BindingFlags.NonPublic | BindingFlags.Static);
mapsKey?.SetValue(null, key);
}
}
}
Then invoke this UseMauiToolkitMaps() method in the MAUI pipeline.
using Microsoft.Maui.Hosting;
using Microsoft.Maui;
using Microsoft.Maui.Embedding;
using Microsoft.Extensions.DependencyInjection;
using Microsoft.Maui.Platform;
using MapsApp.Extensions;
namespace MapsApp.Views;
public sealed partial class MainWindow : Window
{
public MainWindow()
{
this.InitializeComponent();
var mauiApp = MauiApp.CreateBuilder()
.UseMauiEmbedding<MyApp>()
.UseMauiToolkitMaps("<BING_MAPS_API_KEY_HERE>") // To generate a Bing Maps API Key, visit https://www.bingmapsportal.com/
.Build();
// While doing .NET MAUI Embedding, this call is required so that the Application object instance gets resolved.
var _ = mauiApp.Services.GetRequiredService<IApplication>();
Content = new HomePage().ToPlatform(new MauiContext(mauiApp.Services));
}
}
A .NET MAUI Page featuring a Map control centered on the Microsoft headquarters in Redmond, WA.
using Microsoft.Maui.Controls;
using Microsoft.Maui.Controls.Maps;
using Microsoft.Maui.Devices.Sensors;
using Microsoft.Maui.Maps;
namespace MapsApp.Views;
public class HomePage : ContentPage
{
public HomePage()
{
Content = new Map(new MapSpan(new Location(47.643543, -122.130821), 0.01, 0.01));
}
}
A WinUI 3 sample solution, named MapsApp, is now made available in the .NET MAUI Samples GitHub repository. Kindly refer to the src\NET_8\ or src\NET_9\ folder.
If you would like to recognize the work, kindly consider sponsoring on the GitHub Sponsor page or Buy Me a Coffee page. Thanks in advance.
Happy coding. Stay connected as we continue to learn and share the experiences from this exciting journey of being a .NET developer.
Developer Thoughts 