将您带入地图:iOS逐步介绍Google Maps

该博客旨在逐步详细地介绍如何在iOS应用上设置Google Maps。

对于此博客,任务是在The Flatiron School放置一个Google Maps标记,以便每个人都知道我在哪里学习。

第1步-安装Cocoapods

Google Maps SDK可作为Cocoapods窗格使用。 当您听到术语Cocoapods pod和SDK时,有些人可能会像这样this。 不用担心,那很好。 不久之前,我的脸也一样。 让我们首先来看一个简单的SDK。 SDK是指软件开发人员套件。 Cocoapods是管理Xcode项目库依赖关系的工具。 换句话说,Cocoapods是使我们的生活更容易开发软件的工具。

如果尚未安装Cocoapods,则只需转到终端(按Command + Space并编写Terminal)。 在那里,输入:

 须藤宝石安装cocoapods 

等待安装完成,然后输入“ pod”。 如果看到此图片,恭喜! 您已经安装了Cocoapods。

如果您对此还有其他疑问,请访问https://cocoapods.org/

第2步-创建Podfile

首先在您的Xcode中创建一个项目。 为了撰写本博客,我们将创建一个名为“ Google Maps”的单一视图项目。 然后,打开终端并转到包含您的项目的目录。 在那里,输入“ pod init”。 这将创建一个名为“ Podfile”的pod文件。

下一步是编辑该文件以添加Google Maps依赖项。 我们将使用文本编辑器打开文件来完成此操作。 我使用Atom(https://atom.io/)。 如果您不这样做,我强烈建议您开始使用它。 如果您有Atom,只需在终端中编写“ atom Podfile”,pod文件将在Atom中为我们的版本打开。

在文件中添加“ pod’GoogleMaps’”并保存(Ctrl + S)。 您的文件应如下所示:

最后,我们准备在项目中安装Podfile。 为此,我们只需键入“ pod install”,我们就完成了! 如果看到此消息,请拍一下自己的背。 您刚刚在项目中安装了Google Maps依赖项。

第3步-从Google获取API密钥

在再次给我看之前,让我解释一下API是什么。 API是指应用程序编程接口,它们是一组定义,协议和工具,可以使我们在开发软件方面的工作更加轻松。 当公司发布API时,他们会为您提供使用密钥,以便他们跟踪谁在使用他们的API,并为您如何使用它设定条件。

现在我们知道API的含义以及为什么需要密钥,我们可以继续前进并创建自己的Google Maps密钥。 为此,请访问此网站https://console.developers.google.com/flows/enableapi?apiid=maps_ios_backend&reusekey=true

接下来,如果您还没有一个项目,请单击“创建项目”;如果像我一样已经创建了一个项目,请选择您的项目。 单击继续。

现在单击“ API密钥”,您应该设置“名称”,选择密钥限制,在我们的示例中为“ iOS apps”,然后选择一个标识符。 要查看有关API密钥安全性的最佳做法,请访问以下链接:https://support.google.com/googleapi/answer/6310037?hl=zh_CN

单击继续,您应该获得密钥🔑。

第4步-进行编码!

现在,我们准备编写代码并将地图放入我们的应用程序中。 如果您没有意识到,在安装Pod文件时,系统会为您的应用程序生成一个新的.xcworkspace。 打开该文件。

现在转到AppDelegate.swift文件(这非常重要!我要再说一遍,这样您就不必花45分钟的时间弄清楚本教程为什么不起作用了)。 转到AppDelegate.swift,然后在其中写入:

 导入GoogleMaps 
  GMSServices.provideAPIKey(“ YOUR_API_KEY”) 

再次! 这是一种不好的做法,也是一种不安全的密钥输入方式。 本博客旨在说明如何在iOs应用程序中快速设置Google Map。 如何保护我们的API密钥将是另一个博客的主题。

现在,我们转到ViewController.swift文件。

我们将专注于两件事:

  1. 我们的地图指向哪里
  2. 在地图上添加标记

为了指向我们的地图,我们想给我们的代码一些纬度和经度。 而且,正如我所说,我们想指出我们心爱的Flatiron学校。 即纬度40.705252和经度-74.013906。 另外,我们还将添加两个标记:学校本身和纬度40.705561和经度-74.013437的“充电公牛”。

现在让我们编码!

 导入UIKit 
导入googleMaps
 类YourViewController:UIViewController { 
 覆盖func loadView(){ 
  //创建一个GMSCameraPosition来告诉地图显示 
//以缩放级别18.0协调纬度40.705264和经度-74.013888。
  let camera = GMSCameraPosition.camera(withLatitude:40.705264,经度:-74.013888,变焦:18.0) 
让mapView = GMSMapView.map(withFrame:CGRect.zero,camera:camera)
mapView.isMyLocationEnabled = true
视图= mapView
  //为Flatiron学校创建一个标记,为Charging Bull创建一个标记 
 让熨斗= GMSMarker() 
flatiron.position = CLLocationCoordinate2D(纬度:40.705252,经度:-74.013906)
flatiron.title =“熨斗学校”
flatiron.snippet =“这是最好的学校”
flatiron.map = mapView
 让公牛= GMSMarker() 
bull.position = CLLocationCoordinate2D(纬度:40.705561,经度:-74.013437)
bull.title =“收费公牛”
bull.snippet =“触摸我的球”
bull.map = mapView
}
}

步骤5 —差不多完成了

最后一部分是我们的应用程序打算打开的URL方案,我们通过更新Info.plist文件来实现。 在这里,我们将“ LSApplicationQueriesSchemes”设置为父数组,并将“ googlechromes”和“ comgooglemaps”设置为孩子。 完成后,它应如下所示:

恭喜你! 你完成了。 现在继续运行您的应用程序。 这是我的!

再见!