Introduction to iOS Development: Utilizing the MapKit Framework

How do you develop apps for iOS?  It’s a common question that many computer enthusiasts ask, and one we here at TechnoBuffalo hope to answer with this series of posts.

Learning how to develop software can be one of the most intimidating prospects for the average computer user, and with the growing saturation of applications in mobile marketplaces, it is becoming increasingly difficult to get your work noticed. That’s what this series is for, helping you learn iOS development from a conceptual perspective. No prior knowledge of computer programming will be necessary. Over the coming weeks, we’ll examine the iPhone’s ability to deliver immersive, intuitive content, a unique opportunity for both developers and consumers.

Today, we’ll be looking into the MapKit framework, which has customizable options for creating immersive maps and annotations to help users keep track of where they are.

1.  Open Xcode 4, head to File > New Project and select View-Based Application. This will be the template that we are using in today’s tutorial and will automatically set you up with a view controller so you can manage the view and a nib file that contains it.

2.  Name it Maps and save it somewhere that you will never lose it. Take a second to examine what the template provides us with – an app delegate, interface file, and view controller. We are going to need to add a file, so right click on the Maps folder and select New File. Under Cocoa Touch select UIViewController Subclass. Entitle the file MyAnnotation.

3.  Next, we have to set up the window in which the user will interact with your application. This is done through the AppDelegate. Ensure that your App Delegate’s header file (MapsAppDelegate.h) appears identical to the image below.

4.  The implementation file for your app delegate (MapsAppDelegate.m) will initially appear muddled and confusing. All you really need for the program to function is what we have listed in the image below.

5.  Next, we are going to have to add a new framework to the application. A framework is essentially an apparatus that gives one the ability to utilize unique functionalities. The framework we are going to need is called MapKit. Unfortunately, this means you’re going to have to find the correct folder on your hard drive. Head to the Developer portion of your hard drive in Finder. Under Library you should find the folder Frameworks. This is where the MapKit framework will be visible. Add that to your project by dragging it into the Frameworks folder in Xcode 4.

6.  Now that we have finished adding our frameworks, we are going to manipulate the view controller’s header file (MapsViewController.h). We only need to add a simple line of code and change a few details so the file appears like the image below.

7.  We are going to quickly go in and define the annotations, so head on over to MyAnnotation.h and manipulate the code to emulate that which is written below. We are creating a pin that will display on the map and allow users to see a title and some smaller text that will further define the location.

8.  There’s no need to do anything extremely radical at this point, just head on over to the implementation file (MyAnnotation.m) and change the code so that the title and subtitle elements deallocate their memory usage after they are finished being used.

9.  Now the action is about to begin. We are now moving on to the implementation file for the application (MapsViewController.m). This is where we are going to begin to gain the ability to add some functionality to the application.

10. We are going to begin by defining the region that the map will view. That is done by manipulating coordinates. The map that we are creating is centered on the United States, or as I have so aptly decided to name Emurika. After locating where the center off the US would be, I defined a box that would display this area adequately.

11. Next, we are going to create three pins that can be dropped onto the map. These are simply random locations in Phoenix, Chicago, and Boston. Pins are created by defining the location with coordinates and then defining the text strings that will go with them.

12. Now we have the ability to play with the pins we created. You can see a few of the fun places to play with Apple’s options below.

13. The only thing left to do is link the code to the interface. Click on MapsViewController.xib to access the user interface builder. Go up View, then to Utilities, and finally Object Library to give yourself all of the available customization options. Go ahead and drag a Navigation Bar onto the screen and title it Maps. Next, drag a Map View into the area below the Navigation Bar. Finally, press and hold the Control button and drag it from File’s Owner to the Map View. Select mapView and our code is finally linked. Press Run in the upper left hand corner, and the application should launch in interface builder and appear like the application below.

Note: If you are testing using the iOS Simulator, the location will pretend as if you are in Cupertino, California no matter where you are actually located.

Questions?

If you have any questions about the topics discussed in this lesson, feel free to voice them in the comments below. We will do our best to ensure that you have a relatively painless experience developing for iOS. Stay tuned for the next installment of this series, which is released weekly.

To read previous installments from this series, check the links below.




Jack McGrath

Rooted in his childhood obsession with dismantling and reassembling gizmos and gadgets around the house, Jack McGrath's knowledge of programming,...