A Simple Mobile Navigation Application Using the NavigationManager Class - Part 1
Introduction
This is the first part of three tutorials on designing GeoBase applications for mobile devices.
In this tutorial, we will design a simple mobile navigation application, using the NavigationManager class, to demonstrate the speed and ease of use GeoBase affords the developer.
The Navigation Manager
The NavigationManager handles a host of navigational services, allowing the developer to build applications quickly, and easily.
The services provided include visual route guidance, audible announcements (EnglishWaveAnnouncer) and GPS filtering.
The NavigationManager can provide feedback using UI controls: a TurnBox (to guide the user through upcoming turns) and LabelBoxes to display the current address, speed, destination and ETA. These controls may be set using the SetControls(LabelBox, LabelBox, LabelBox, TurnBox, LabelBox) method.
What will we design?
We will design a hand-held navigator for a Window's based mobile device. The design will be carried out in two steps, namely: design the main navigator application (see figure1), and then design the information screen (see figure 2).
Step 1
The first step is to design the main navigator, comprising
- a navigation manager
- a GPS simulator
- a map control with changeable viewpoint, directional pointer, and colored route
- also, 'Reset' and 'Exit' functions
Step 2
The second step is to design the information screen, comprising
- a turnBox to indicate the next turn
- a labelBox to show distance to, and instructions for, the next turn
- a labelBox to show the current street address
- a labelBox to show the current speed and speed restriction
- a labelBox to show the time and distance remaining before reaching the destination
The application can be deployed to either an emulator or a physical device.

Figure 1 - the navigator application

Figure 2 - the information screen
Before we start - a note on design methodology
When developing code for a mobile device, it is common to test and debug the application using the Microsoft Device Emulator or a real physical device. However, both of these methods can be quite slow.
Telogis provides a number of tools and features to simplify and speed up the development of your GeoBase applications for mobile devices. The recommended approach is:
- Create a mobile solution, and design the form layout. Next, create a Windows (desktop) version, and share the source files from the mobile version.
- Use the desktop version to verify and debug your application, which will provide superior debugging speeds compared to that of the Microsoft Device Emulator.
In this tutorial, we will follow that methodology, creating a mobile solution first, followed by a desktop version. We'll create the form and any event handlers in the mobile version, and then continue the rest of the development on the desktop version.
Step 1 - Set up the mobile project
- Open Visual Studio, and create a Smart Device Project with .NET Compact Framework Version 2.0 .
- In the Solution Explorer, add geobase.mobile.net.dll to References. This file can be found in your GeoBase installation path, the default being: C:\Program Files\Telogis\GeoBase\Mobile\bin.
- Also, add to your project, geobase.drawing.dll and geobase.mobile.dll. Both of these files can be found in the same folder as above.
- For both 'geobase.drawing.dll', and 'geobase.mobile.dll', select their Copy to Output Directory property, and set to: Copy if newer.
Create the form
Select the form design view, and add the following controls, similar to that of figure 3:
- Add a MapCtrl to cover the majority of the form, and rename it mapMain.
- Place two check boxes below the mapMain control. Change each one's name and text, as follows:
Name = "checkBoxView", Text = "View"
Name = "checkBoxDetails", Text = "Details"
- In the Checked property of checkBoxView, select True.
- Add a MainMenu control to your form.
- Left-click on the left-hand menuItem control, and type "Reset". Rename this menuItem to menuItemReset.
- Left-click on the right-hand menuItem control, and type "Exit". Rename this menuItem to menuItemExit.
- Check that your layout is similar to that of figure 3.

Figure 3 - form layout
- In the form code view, add the following "using" statements to the beginning of Form1:
using Telogis.GeoBase; using Telogis.GeoBase.Repositories; using Telogis.GeoBase.Navigation; using Telogis.GeoBase.Routing; using System.IO;
- Also, within Form1, add the following RendererList and NavigationManager:
RendererList renderList = new RendererList(); NavigationManager nMan;
Before we finish this section, we need to add the path of the data repository.
- Add the following path strings, in the code view:
//Path for repository string reposPath = @"data\gb.3.5"; //Path for sound folder string soundPath = "langs";
As we are writing for both mobile and desktop applications, we will have to perform a conditional compile.
- Add the following code in the code view and assign it as the Form Load event handler:
private void Form1_Load(object sender, EventArgs e){
#if DESKTOP
string resourcePath = @"C:\Program Files\Telogis\GeoBase\GeoBaseResources";
#else
string resourcePath = "Storage Card";
#endif
//Set up data repository
Repository.Default = new MultiRepository(Path.Combine(resourcePath,reposPath));
//Add to renderer list
mapMain.Renderer = renderList;
}
Note: The data repository specified in the next to last command must contain at least one data file. If the data repository is empty, this application may generate an exception on startup. You can download a sample data file from here.
Set up the desktop project
We'll now set up the desktop version of this application, so that we can debug / test more quickly.
- Open another instance of Visual Studio, and create a Windows Forms Application for .NET Framework Version 2.0 .
- In the Solution Explorer, add a reference to geobase.net.dll to the project. This file can be found in your GeoBase installation path, the default being: C:\Program Files\Telogis\GeoBase\bin.
- Delete the two files that were created when the project was created: "Form1.cs", and "Program.cs".
- Right-click on the desktop's project name in Solution Explorer, and select "Add", and then "Existing Item...".
- Locate the files "Form1.cs", and "Program.cs" in your mobile / smart device project, and create a link to them by selecting both files, then left-clicking the arrow to the right of the "Add" button on the "Add Existing Item" form. Choose "Add As Link" to finish. See figure 4.
From now on, we'll be doing all our code development using the desktop version, reserving the mobile version for anything that requires a designer.
.png)
Figure 4 - adding links
Create the NavigationManager
To create a new NavigationManager object (nMan), we have to provide the name of the map control it is to be used with, and the location of the sound files folder (required for the EnglishWaveAnnouncer).
As we are writing for both mobile and desktop applications, we will perform a conditional compile.
- Add a conditional compilation symbol "DESKTOP" to your desktop project, and then update the Form1_Load(), to look like this:
#if DESKTOP
string resourcePath = @"C:\Program Files\Telogis\GeoBase\GeoBaseResources";
#else
string resourcePath = "Storage Card";
#endif
//Set up data repository
Repository.Default = new MultiRepository(Path.Combine(resourcePath,reposPath));
//Set up nav manager
nMan = new NavigationManager(mapMain, (Path.Combine(resourcePath,soundPath)));
Next, we need to add the new NavigationManager to our renderer list.
- Add the following code to the Form1_Load handler:
renderList.Add(nMan);
Add the GPS simulator unit
For this tutorial, we'll create a GPS simulator for the NavigationManager, which will follow the route at the maximum road speed. When we have set up our new NavigationManager in Form1_Load(), we need to call a function to start (or restart) the route to be navigated. This will be called startRoute().
- Add this code to the bottom of Form1_Load():
startRoute();
Form1_Load() should now look similar to this:
private void Form1_Load(object sender, EventArgs e){
#if DESKTOP
string resourcePath = @"C:\Program Files\Telogis\GeoBase\GeoBaseResources";
#else
string resourcePath = "Storage Card";
#endif
//Set up data repository
Repository.Default = new MultiRepository(Path.Combine(resourcePath,reposPath));
//Set up nav manager
nMan = new NavigationManager(mapMain, (Path.Combine(resourcePath,soundPath)));
//Add to renderer list
mapMain.Renderer = renderList;
renderList.Add(nMan);
//Start route
startRoute();
}
Next we'll create the startRoute() method. In this method, we'll create a new GpsSimulator, and then configure the NavigationManager to work with it.
- Add the following code to your project:
private void startRoute(){
//Set the gps for the navigation manager
//using StaticGps and starting address (latlon)
nMan.SetGps(new StaticGps(33.71581, -117.77641));
//Set destination
nMan.SetDestination(new LatLon(33.65006, -117.75523));
//Set the gps for the navigation manager
nMan.SetGps(new GpsSimulator(nMan.Navigator.Directions, 2));
}
Before we complete this section, we'll add a couple of event handlers for the menuItems "Reset", and "Exit". As the names suggest, 'Reset' will make the navigator restart, and 'Exit' will shut down the application.
- Add the following to your code, but do not hook up the event handlers using the form designer:
private void menuItemReset_Click(object sender, EventArgs e){
//Call startRoute() to reset route
startRoute();
}
private void menuItemExit_Click(object sender, EventArgs e){
//power down GPS unit, before exiting.
nMan.Navigator.Gps.PowerDown();
Application.Exit();
}
- Save your changes, then go back to the mobile application and hook up the event handlers.
Back in the Windows Forms project, It's time to test the code.
- Press 'F5' (start debugging) or 'Ctrl+F5' (start without debugging).
You should see something similar to figure 5.

Figure 5 - testing the first build
Step 2 - Add the information screen
Next, we are going to add the information screen, which comprises four label boxes, and a turn box. We'll use these controls with the SetControls() method to toggle the information, off and on.
- Add the following code to form1.
LabelBox instructs = new LabelBox(); LabelBox address = new LabelBox(); LabelBox speed = new LabelBox(); LabelBox eta = new LabelBox(); TurnBox turn = new TurnBox();
Next, we'll set the sizes and locations of the boxes.
- Add the following code to Form1_Load()
//Set locations and sizes instructs.Size = new Size(160, 70); instructs.Location = new Point(80, -5); address.Size = new Size(120, 70); address.Location = new Point(120,55); speed.Size = new Size(90, 70); speed.Location = new Point(-5, 170); turn.Size = new Size(70, 70); turn.Location = new Point(-5, -5); eta.Size = new Size(110, 70); eta.Location = new Point(130, 170); //Do not display just yet. nMan.SetControls(null, null, null, null, null);
At the end of the code above, we use the NavigationManager method 'SetControls()'. This allows us to switch the various information boxes on and off. The argument list for SetControls() is:
NavigationManager.SetControls(
LabelBox instructions,
LabelBox address,
LabelBox speed,
TurnBox turn,
LabelBox eta
);
To switch off an information box, use a 'null' argument. To switch the information box on, use the box's name. For example, to switch on the 'turn' TurnBox only, we could write:
nMan.SetControls(null, null, null, turn, null);
Now that we know how to use the turn and label boxes, we'll add the following code to switch the boxes on and off, using the 'Details' checkbox:
private void checkBoxDetails_CheckStateChanged(object sender, EventArgs e){
if(checkBoxDetails.Checked){
nMan.SetControls(instructs, address, speed, turn, eta);
}
else{
nMan.SetControls(null, null, null, null, null);
}
}
The final addition to this tutorial, is to provide the option for different map views. With the 'View' checkbox checked, the orientation of the map will be that of the vehicle heading (see figure 6). When unchecked, the map's orientation will be north (see figure 7).
- Add the following event handler to your code, and then run your application.
private void checkBoxView_CheckStateChanged(object sender, EventArgs e){
if(checkBoxView.Checked){
nMan.Orientation = MapOrientation.VehicleHeading;
}
else{
nMan.Orientation = MapOrientation.North;
}
}

Figure 6 - map orientation - vehicle heading

Figure 7 - map orientation - north
Before you finish, you might like to open and run your mobile project, to see that the work you've done on the desktop has been successful for your mobile application too. You should see something similar to figure 8.
Figure 8 - running the application - mobile solution
Conclusion
This tutorial has demonstrated how easy it is to design a mobile navigation unit using GeoBase and the NavigationManager class.
Next
The second tutorial in this series can be found here:
A Simple Mobile Navigation Application Using the NavigationManager Class - Part 2.
Click on the link to find out how to combine a drill-down geocoder with a POI (point of interest) search, to allow a user to search and display on the map POIs such as, gas stations, hospitals, restaurants and tourist sites.
Tagged under: dotnet mobile geobase routing navigation