In this section, we want to learn the iOS map display by giving an example in swift. We will also learn how to use mapview (map viewer) to access maps and add border and pin information in swift with an example using xcode.

Map viewer with marginal info on iOS

In iOS, using the mapkit display, we can easily create maps and access maps. Using the map viewer on iOS, we can display standard maps, satellite maps, or both, and the app allows users to add locations or marginal map information as well.

Using maps in iOS, we can find the path between the source and destination locations in our apps. We can access maps in iOS apps by adding a Mapkit reference.

Now, with an example, we will see how to use the iOS map display.

Create iOS Map Viewer app in Swift language

To create a new project in Xcode on iOS, open Xcode from the application folder list. After opening Xcode, the welcome window will open as shown below. In the Welcome window, click on the second option, “Create a new Xcode Project”; Click (create a new Xcode Project) or select the File New Project path.

After selecting “Create a new Xcode project”, a new window will open in which we must select our template.

The new Xcode window includes several built-in application templates to implement the usual type of iOS apps, such as page-based apps, tab-based apps, games, spreadsheet apps, and more. These templates have a preset interface and source code files. .

For example, the map display in iOS, we have the most basic pattern of the application, which is “app only display”; We will use. To select this item, go to the iOS section on the left, select the application from the select section, and in the main part of the window that opens, select “single view application” and click on the next button, as shown below. .

Product name: “iPhone Articles”

The name we enter in the Product Name section is used for the project and application.

Organization name: “Tutlane”

You can enter the name of the organization or your name in this field; Of course you can leave that section blank.

Organization Identifier): “com.developersocociety)”

If you do not have an enterprise ID, enter com.example.

Bundle Identifier: This section is automatically generated based on the terms we entered in the product name and organization ID.

Language: “Swift”

Select the language type “Swift” because we want to develop applications using swift.

Universal (devices): “Universal”

Select the Devices option as Universal This means that this app is for all Apple devices; If you need to run the app for iPad only, you can select the iPad option to restrict your app to running only on iPad devices.

Use core Data: Not selected

This option is used for database operations. Select this option if you are doing any database-related operations in your application, otherwise do not select this option.

Include Unit Test: Not selected

If you need unit tests for your application, select this option otherwise leave it unselected.

Includes UI tests: not selected

Select this option if you need UI tests for your application, otherwise do not select it.

After completing the options, click the Next button as shown below.

When we click on the next button, a new window will open, which should be used to save the position in which we want the new project; Let’s choose. Once you have selected the new project storage location; As shown below; Click the Create button.

After clicking the Create button, Xcode opens and creates a new project.

In our project, Main.storyboard and ViewController.swift are the main files used to design the user interface and maintain the source code.

Main.storyboard – which is the visual interface editor and this file is used to design the application interface.

ViewController.swift – which contains the source code of our application and we use this file to write any code related to our application.

Now select the Main.storyboard file in the project, until Xcode opens the visual interface editor as shown below.

Now select the ViewController.swift file in your project that looks similar to the following:

Add iOS app UI controls to the Xcode display

We are now adding controls to our application for that library of available objects. The object library appears at the bottom right of Xcode. If you did not find the object library, as shown below; Click the button that is the third button in the library selection bar on the left. (On the other hand, you can select the View Utilities Show Object Library path).

As we have suggested; Our interface is the Main.storyboard file, so open the Main.storyboard file. Now look for Map Kit View in the Object Library in the Filter box, then drag and drop Map Kit View into the ViewController in the Main.storyboard, as shown below.

Linking iOS UI controls to Swift coding

We now communicate between the controls and the ViewController.Swift code. To do this, click on the Assistant button, which looks like two intertwined circles. This icon is located in the Xcod toolbar, as you can see below, in the right corner.

To map controls; Hold down the Ctrl key on the keyboard and select the MapView similar to the one below the interface and drag and drop it into the ViewController.swift file.

After mapping the Map View control to coding; We need to write the same custom code below in the ViewController.swift file to show the location and the pinned margin information.

Import UIKit

Import MapKit

class ViewController: UIViewController {

@IBOutlet weak var mapView: MKMAPView!

Override func viewDidLoad () {

Super.viewDidLoad ()

self.mapView.setRegion (region, animated: true)

let annotation: MKPointAnnotation = MKPointAnnotation ()

annotation.coordinate = location

annototation.title = “India”

annototaion.subtitle = “tutlane.com”

self.mapView.addAnnotation (annotation)

}

Override func didReciveMemoryWarning () {

Super.didRecieveMemoryWarning ()

// Dispose of any resources that can be recreated.

}

}

Now run the program and check its output. To implement the program; Select the required emulator (here we have selected the iPhone Six S Plus) and click the Play button, which is similar to the one in the lower left corner of the Xcode toolbar.

IOS Maps app output in Swift language

Below you can see the results of running iOS maps. If you look at the result; We have added marginal information on the map to show the location details.

This way we can use the iOS map kit display in swift apps and we can see marginal information that shows the location; Show as needed.