Skip to end of metadata
Go to start of metadata

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.
  • Update the 'bootstrap' code so that your database will include two new REAL fields named capturedLat and capturedLong
  • Update list() to return the value of those fields
  • Update the bust() function to accept two arguments for the latitude and longitude; store those values in the database
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:
  • Add a geolocation purpose message to support iOS.
  • Use an if/else block and determine if location services are enabled. If so, set the accuracy to ACCURACY_HIGH on Android and ACCURACY_BEST on iOS.
  • Grab the one-time location value and if there's no error, call db.bust() and pass the lat/long values.
  • If there is an error, alert() the error to the user.
  • You'll need one more else block for the outer-if block: if location services are disabled, alert() a message to the user with the details.
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.
5
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.

Summary

In this lab, you added geolocation support and a plotted a map showing where fugitives were captured. You handled platform differences and geolocation errors.

Resources

  • No labels

3 Comments

  1. Anonymous

    Did anyone get this part working?

    Here is what I've done, but it is still generating an error!

    I've developed everything till 260 and everything is working.In this part I've added

    these two lines in tiapp.xml

    <property name="ti.android.google.map.api.key.development">0ZnKXkWA2dIAu2EM-OV4ZD2lJY3sEWE5TSgjJNg</property>
    <property name="ti.android.google.map.api.key.production">GET_ME_FROM_GOOGLE</property>

    and changed the code as needed, but I still get the following error:

    [3,0] file:///android_asset/Resourses/app.js

    Message:

    NullPointerException (file:///android_asset/Resources/app.js#3)

    Does anyone know why?

    Thanks

    1. What is going on at app.js is a Java exception being bubbled up to JavaScript - if you attach the full trace log we might be able to get a sense of what the Java error is.  The first thing to try, though, is to force Titanium to do a fresh build of your application by deleting the contents of the build/android directory (leaving the directory intact) and starting the build over again.