FMX.Mobile.Tabbed Map Sample
This sample shows how to use maps in different tabs in a Object Pascal/C++ application.
You can find the Tabbed Map sample project at:
- Start | Programs | Appmethod 1.16 | Samples and then navigate to one of the following:
- Object Pascal\Mobile Samples\Device Sensors and Services\Maps
- CPP\Mobile Samples\Device Sensors and Services\Maps
- Subversion Repository for Object Pascal: http://sourceforge.net/p/radstudiodemos/code/HEAD/tree/branches/RadStudio_XE8//Object%20Pascal/Mobile%20Samples/Device%20Sensors%20and%20Services/Maps
- Subversion Repository for C++: http://sourceforge.net/p/radstudiodemos/code/HEAD/tree/branches/RadStudio_XE8//CPP/Mobile%20Samples/Device%20Sensors%20and%20Services/Maps
The sample demonstrates the use of the TMapView class. The sample shows how to display and interact with the map, including:
- Changing between two tabs that display different maps.
- Showing the coordinates of the map center.
- Zooming in and zooming out both maps.
Using Google Maps on Android
If you are running this sample on Android, in order to access the Google Maps servers, you have to add a Maps API key to the sample. To acquire the API key and add it in the sample you need to follow these configuration steps:
- Getting your Google Maps API key:
- Retrieving Your Application Certificate
- Creating an API Project in the Google APIs Console. This step requires you to have a Google Account.
- Requesting the Maps API Key
- Configuring the sample project options. Once you have the Maps API Key; in Appmethod:
- Go to Project > Options > Version Info
- Select Android platform as Target (either in Debug, Release or All Configurations).
- Add the Maps API Key value in the apiKey key, and click OK.
How to Use the Sample
- Navigate to one of the locations given above and open:
- Object Pascal: TabbedMapProject.dproj.
- C++: TabMapProject.cbproj.
- If you are running the sample on Android, ensure you first follow the steps indicated in Using Google Maps on Android
- Before you run the sample, ensure the device is connected to the Internet.
- Press F9 or choose Run > Run.
- When you run the sample, the TMapView loads the map.
- To interact with the map:
- Use the Saint-Pétersbourg and San Francisco tabs to change between the two maps.
- Change the zoom using the Zoom out and Zoom in buttons.
- Move the map and see the coordinates of the map center in the CameraInfo TLabel, at the button of the app.
|File in Object Pascal||File in C++||Contains|
The project itself.
The main form where the components are located.
Implementation of the sample.
- The sample uses TMapView to display and manage the maps.
- TMapCoordinate is used to create the initial coordinates with the indicated latitude and longitude. Then, the center of the maps are set to such coordinates with the TMapView.Location property.
- The TMapView.Zoom property is used to set the initial zoom of both maps to 10. This same property, is also used to zoom in and zoom out both maps by adding or subtracting 1 to the Zoom property.
- TMapView.OnCameraChanged updates the CameraInfo TLabel that indicates the Latitude and Longitude of the map Location.