Building a Location Tracking App Using GPS and Maps

In this chapter, we will create a location tracking app that saves the location of the user and displays it as a heat map. We will learn how to run tasks in the background on iOS, macOS, and Android devices. We will extend the .NET MAUI Map control to display the map with the saved locations directly in the map.

The following topics will be covered in this chapter:

• Tracking the location of a user in the background on an iOS device and a macOS device
• Tracking the location of a user in the background on an Android device
• How to show maps in a .NET MAUI app
• How to extend the functionality of .NET MAUI maps

Let’s get started!

Technical requirements

To be able to complete this project, you’ll need to have Visual Studio for Mac or Windows installed, as well as the .NET MAUI components. See Chapter 1, Introduction to .NET MAUI, for more details on how to set up your environment. To build an iOS app using Visual Studio for Windows, you must have a Mac connected. If you don’t have access to a Mac at all, you can just complete the Android part of this project.

You can find the full source for the code in this chapter at https://github.com/PacktPublishing/MAUI-Projects-3rd-Edition.

Important information for Windows users

At the time of writing, there was no Map control for the Windows platform in .NET MAUI. This is due to the lack of a Map control in the underlying WinUI platform. For the latest information on Map support in Windows, visit the Map documentation at https://learn.microsoft.com/en-us/dotnet/maui/user-interface/controls/map.

Project overview

Many apps can be made richer by adding a map and location services. In this project, we will build a location tracking app that we will call MeTracker. This app will track the position of the user and save it to an SQLite database so that we can visualize the result in the form of a heat map. To build this app, we will learn how to set up processes in the background on iOS, macOS, and Android. Luckily for us, the iOS and macOS implementations are identical; however, the Android implementation is very different. For the map, we will use the .NET MAUI Maps component and extend its functionality to build a heat map.

Due to the lack of Map support on Windows, and just for some variety, this chapter will use Visual Studio for Mac screenshots and references. If you don’t have a Mac, don’t worry; you can still complete the project for Android on your Windows development machine. If you need help with the steps, look at some of the earlier chapters for equivalent...

Building the MeTracker app

It’s time to start building the app. Use the following steps to create a project from a template:

1. Open Visual Studio for Mac and click New:

Figure 7.1 – Visual Studio for Mac start screen

2. In the Choose a template for your new project dialog, use the .NET MAUI App template, which is under Multiplatform | App; then, click Continue:

Figure 7.2 – New project

3. In the Configure your new .NET MAUI App dialog, ensure the .NET 7.0 target framework is selected, then click Continue:

Figure 7.3 – Choosing a target framework

4. In the Configure your new .NET MAUI App dialog, name the project MeTracker, and then click Create:

Figure 7.4 – Naming the new app

If you run the app now, you should see something like the following:

Figure 7.5 – MeTracker...

Summary

In this chapter, we built an app for iOS, Mac Catalyst, and Android that tracked the location of a user. When we built the app, we learned how to use maps in .NET MAUI and how to use location tracking when it’s running in the background. We also learned how to extend .NET MAUI with custom controls. With this knowledge, we can create applications that perform other tasks in the background. We also learned how to extend most controls in .NET MAUI.

Here are some ways you could extend this app even further:

• Right now, the app updates the map location when the app resumes. How could you update the map when the location changes?
• Add a view that lists all locations from the database. Allow the user to remove a location from the list.

The next project will be a weather app. In the next chapter, we will use an existing weather service API to retrieve weather data and then display that data in the app.