MAUIverse MAUIverse

Custom Google Maps Info Window in .NET MAUI — FontAwesome Icons and Pin Detail Page

Hafiz Muhammad Hassan

Share:

Share on LinkedInShare on BlueskyShare on XShare on RedditShare on FacebookShare by email

The default map pin callout is rarely good enough for real apps. This tutorial shows the complete implementation of a custom info window in .NET MAUI — the styled card that pops up when a user taps a pin — and wires up navigation to a dedicated detail page.

What you’ll learn

  • Setting up Google Maps in .NET MAUI with the Onion.Maui.GoogleMaps library
  • Building a custom info window as a ContentView with a styled card UI showing name, address, category, rating, and hours
  • Replacing emoji with FontAwesome Solid icons for location pins, star ratings, and clock/hours — consistent cross-platform appearance
  • Adding a custom NavigationPage TitleView with a FontAwesome icon
  • Navigating from the info window tap event to a full detail page for the selected pin
  • Targeting both Android and iOS from the same cross-platform code

Source code: github.com/ihassantariq/MauiGoogleMapsInfoWindow

Watch on YouTube

← Back to Community Feed

}