Lab - Using Location Services
Mission: In this lab assignment, you will add geolocation support to TiBountyHunter. You will capture the latitude and longitude values marking the location where a fugitive is captured and store that data in the database. You'll offer the user an option to plot that location on a map.
Specification: Start with the TiBountyHunter project you created for the last assignment. You will add the features needed to support location services. To successfully complete this lab, you must develop an application that meets the following description:
- Modify the database to store the latitude and longitude of where the fugitive was captured. For simplicity, rather than altering the existing database, modify the CREATE TABLE statement to define fields for those values. Then, uninstall the app from the simulator/emulator to force the database to be created again.
- When the Capture button is tapped, store the geo location in the database
- Add a Show on Map button that will display a map when clicked. The map should display the region surrounding the location where the fugitive was captured. An annotation should mark the specific location.
- Tip: To install onto an Android device, use the Google maps key from the Kitchen Sink app so that the map will work.
|1. Open the TiBountyHunter project you created for the last assignment, or download the starting point code and import it as a new project in Studio: http://assets.appcelerator.com.s3.amazonaws.com/app_u/code/TiBH270.zip|
|2. Edit the lib/db.js file.
|Because you're changing the database and we're not writing any alter-table statements, you will need to uninstall the app from the simulator/emulator. If you're starting a new project rather than editing your earlier work, this won't be a problem for you.|
|3. Edit the ui/common/DetailWindow.js file. In the Capture button's event listener, make these changes:
|You will need to keep the existing net.bustFugitive() code; it should be within the block that successfully grabs the current location information.|
|4. Below the Capture button, add a 'Show on Map' button. When tapped, instantiate a map window (you'll write the module for that next), which you should open as a modal window. You'll be putting this module's file in the ui/common folder. Pass the bounty object to the map window's constructor.|
|5. In the ui/common folder, add a new module file for your map window. In that module, create a Window that contains a Map view. The map should have one annotation marking the fugitive's latitude and longitude. Use the Standard map type, show a region bounded by one-tenth of a degree centered on the fugitive's location. For iOS, you'll need a navigation bar button to close the window.|
|6. Make sure to update the internationalization strings.xml file.|
|7. Build your app for the iOS simulator or Android emulator. Capture a fugitive; on iOS you should permit location services. Test the Show on Map functionality with a captured fugitive. Correct any problems that exist.|
|Don't forget to uninstall the old version of the app before running the new version.|
In this lab, you added geolocation support and a plotted a map showing where fugitives were captured. You handled platform differences and geolocation errors.
- API docs: Geolocation: http://docs.appcelerator.com/titanium/2.0/index.html#!/api/Titanium.Geolocation
- Guides: Tracking Postion and Heading: http://docs.appcelerator.com/titanium/2.0/index.html#!/guide/Tracking_Position_and_Heading
- Finished code: See the next lab or GitHub