สร้างโปรเจ็กต์ Xcode

หลังจากเปิดใช้การเรียกเก็บเงินและสร้างคีย์ API คุณก็พร้อมที่จะตั้งค่าโปรเจ็กต์ Xcode ที่ใช้พัฒนาแอปแล้ว

บันทึกประจำรุ่นจะมีให้สำหรับแต่ละรุ่น

ขั้นตอนที่ 1: ติดตั้งซอฟต์แวร์ที่จำเป็น

หากต้องการสร้างโปรเจ็กต์โดยใช้ Maps SDK สำหรับ iOS คุณต้องดาวน์โหลดและติดตั้งสิ่งต่อไปนี้

  • Xcode เวอร์ชัน 14.0 ขึ้นไป

  • CocoaPods

ขั้นตอนที่ 2: สร้างโปรเจ็กต์ Xcode และติดตั้ง Maps SDK สำหรับ iOS

ใช้ CocoaPods

Maps SDK สำหรับ iOS พร้อมให้ใช้งานเป็นพ็อด CocoaPods CocoaPods เป็นผู้จัดการทรัพยากร Dependency แบบโอเพนซอร์สของโปรเจ็กต์ Swift และ Objective-C Cocoa

หากคุณยังไม่มีเครื่องมือ CocoaPods ให้ติดตั้งใน macOS โดยเรียกใช้คำสั่งต่อไปนี้จากเทอร์มินัล โปรดดูรายละเอียดในคู่มือเริ่มต้นใช้งาน CocoaPods

sudo gem install cocoapods

สร้าง Podfile สำหรับ Maps SDK สำหรับ iOS และใช้เพื่อติดตั้ง API และทรัพยากร Dependency

  1. หากยังไม่มีโปรเจ็กต์ Xcode ให้สร้างโปรเจ็กต์ตอนนี้แล้วบันทึกลงในเครื่องภายใน หากคุณเพิ่งเริ่มใช้การพัฒนา iOS
    1. สร้างโปรเจ็กต์ใหม่
    2. เลือกเทมเพลต iOS > แอป
    3. ในหน้าจอตัวเลือกโปรเจ็กต์ ให้ทำดังนี้
      1. ป้อนชื่อโครงการ
      2. บันทึกค่าของช่องตัวระบุ Bundle คุณใช้ค่าดังกล่าวเพื่อจำกัดคีย์ API ได้ที่ด้านล่าง
      3. ตั้งค่าอินเทอร์เฟซของโปรเจ็กต์เป็นสตอรีบอร์ด
      4. ตั้งค่าภาษาเป็น Swift หรือ Objective-C
  2. สร้างไฟล์ชื่อ Podfile ในไดเรกทอรีโปรเจ็กต์ ไฟล์นี้ระบุทรัพยากร Dependency ของโปรเจ็กต์
  3. แก้ไข Podfile และเพิ่มทรัพยากร Dependency พร้อมด้วยเวอร์ชันของทรัพยากรดังกล่าว ต่อไปนี้คือตัวอย่างที่ประกอบด้วยทรัพยากร Dependency ที่คุณต้องใช้สำหรับ Maps SDK สำหรับ iOS 
    source 'https://github.com/CocoaPods/Specs.git'

platform :ios, '14.0'

target 'YOUR_APPLICATION_TARGET_NAME_HERE' do
  pod 'GoogleMaps', '8.2.0'
end
    อย่าลืมเรียกใช้ pod outdated เป็นประจำเพื่อตรวจหาเมื่อมีเวอร์ชันใหม่เพื่อให้คุณใช้เวอร์ชันล่าสุดอยู่เสมอ หากจำเป็น ให้อัปเกรดเป็นเวอร์ชันล่าสุด
  4. บันทึก Podfile

  5. เปิดเทอร์มินัลและไปที่ไดเรกทอรีที่มี Podfile:

    cd <path-to-project>

  6. เรียกใช้คำสั่ง pod install การดำเนินการนี้จะติดตั้ง API ที่ระบุใน Podfile พร้อมกับทรัพยากร Dependency ที่ผู้ใช้อาจมี

    pod install

  7. ปิด Xcode แล้วเปิด (ดับเบิลคลิก) ไฟล์ .xcworkspace ของโปรเจ็กต์เพื่อเปิด Xcode ตั้งแต่นี้เป็นต้นไป คุณต้องใช้ไฟล์ .xcworkspace เพื่อเปิดโปรเจ็กต์

หากต้องการอัปเดต API สำหรับโปรเจ็กต์ที่มีอยู่ ให้ทำตามขั้นตอนต่อไปนี้

  1. เปิดเทอร์มินัลแล้วไปที่ไดเรกทอรีโปรเจ็กต์ที่มี Podfile
  2. เรียกใช้คำสั่ง pod update การดำเนินการนี้จะอัปเดต API ทั้งหมดที่ระบุใน Podfile เป็นเวอร์ชันล่าสุด

ติดตั้ง XCFramework

XCFramework เป็นแพ็กเกจไบนารีที่คุณใช้ได้ในหลายแพลตฟอร์ม รวมถึงเครื่องที่ใช้ชิปเซ็ต M1 เพื่อติดตั้ง Maps SDK สำหรับ iOS คู่มือนี้แสดงวิธีเพิ่ม XCFramework ที่มี Maps SDK สำหรับ iOS ลงในโปรเจ็กต์ของคุณ และกำหนดค่าของบิลด์ใน Xcode

สร้างด้วยตนเอง

คู่มือนี้แสดงวิธีเพิ่ม Maps SDK สำหรับ iOS ลงในโปรเจ็กต์และกำหนดการตั้งค่าบิลด์ใน Xcode ด้วยตนเอง

  1. ดาวน์โหลดไฟล์ต้นฉบับ SDK: GoogleMaps-8.2.0
  2. คลายแพคไฟล์ต้นฉบับ ไปที่โฟลเดอร์ Frameworks เพื่อเข้าถึง XCFramework
  3. หากยังไม่มีโปรเจ็กต์ Xcode ให้สร้างโปรเจ็กต์ตอนนี้แล้วบันทึกลงในเครื่องภายใน หากคุณเพิ่งเริ่มใช้การพัฒนา iOS
    1. สร้างโปรเจ็กต์ใหม่
    2. เลือกเทมเพลต iOS > แอป
    3. ในหน้าจอตัวเลือกโปรเจ็กต์ ให้ทำดังนี้
      1. ป้อนชื่อโครงการ
      2. บันทึกค่าของช่องตัวระบุ Bundle คุณใช้ค่าดังกล่าวเพื่อจำกัดคีย์ API ได้ที่ด้านล่าง
      3. ตั้งค่าอินเทอร์เฟซของโปรเจ็กต์เป็นสตอรีบอร์ด
      4. ตั้งค่าภาษาเป็น Swift หรือ Objective-C
  4. ลาก XCFrameworks ต่อไปนี้ลงในโปรเจ็กต์ในส่วนเฟรม ไลบรารี และเนื้อหาที่ฝัง ตรวจสอบว่าได้เลือกไม่ฝังสำหรับ XCFramework แต่ละรายการ ดังนี้
    • GoogleMaps-x.x.x/GoogleMapsBase.xcframework
    • GoogleMaps-x.x.x/GoogleMaps.xcframework
    • GoogleMaps-x.x.x/GoogleMapsCore.xcframework
    • (ลูกค้าแพ็กเกจพรีเมียมเท่านั้น) GoogleMaps-x.x.x/GoogleMapsM4B.xcframework
  5. คลิกขวาที่ GoogleMaps.xcframework ในโปรเจ็กต์ แล้วเลือกแสดงในตัวค้นหา
  6. ลาก GoogleMaps.bundle จากโฟลเดอร์ ios-arm64_x86_64-simulator/GoogleMaps.framework/Resources ไปยังไดเรกทอรีระดับบนสุดของโปรเจ็กต์ Xcode เมื่อได้รับข้อความแจ้ง ให้ตรวจสอบว่าได้ไม่ได้เลือกคัดลอกรายการหากจำเป็น
  7. เลือกโปรเจ็กต์จาก Project Navigator แล้วเลือกเป้าหมายของแอปพลิเคชัน
  8. เปิดแท็บสร้างขั้นตอนสำหรับเป้าหมายของแอปพลิเคชัน และภายในลิงก์ไบนารีกับไลบรารี แล้วเพิ่มเฟรมเวิร์กและไลบรารีต่อไปนี้
    • Accelerate.framework
    • CoreData.framework
    • CoreGraphics.framework
    • CoreImage.framework
    • CoreLocation.framework
    • CoreTelephony.framework
    • CoreText.framework
    • GLKit.framework
    • ImageIO.framework
    • libc++.tbd
    • libz.tbd
    • Metal.framework
    • OpenGLES.framework
    • QuartzCore.framework
    • SystemConfiguration.framework
    • UIKit.framework

  9. เลือกโปรเจ็กต์แทนเป้าหมายที่เฉพาะเจาะจง แล้วเปิดแท็บการตั้งค่าบิลด์ ในส่วน Other Linker Flags ให้เพิ่ม -ObjC หากไม่เห็นการตั้งค่าเหล่านี้ ให้เปลี่ยนตัวกรองในแถบการตั้งค่าบิลด์จากพื้นฐานเป็นทั้งหมด

  10. หากต้องการติดตั้ง Places SDK สำหรับ iOS XCFramework โปรดดูเริ่มต้นใช้งาน Places SDK สำหรับ iOS

มีคาร์เธจ

ติดตั้งด้วยตัวเอง

คู่มือนี้แสดงวิธีเพิ่ม Maps SDK สำหรับ iOS ลงในโปรเจ็กต์ด้วยตนเอง รวมทั้งกำหนดการตั้งค่าบิลด์ใน Xcode

  1. ดาวน์โหลดไฟล์ต้นฉบับ SDK: GoogleMaps-8.2.0
  2. คลายแพคไฟล์ต้นฉบับ
  3. หากยังไม่มีโปรเจ็กต์ Xcode ให้สร้างโปรเจ็กต์ตอนนี้แล้วบันทึกลงในเครื่องภายใน หากคุณเพิ่งเริ่มใช้การพัฒนา iOS
    1. สร้างโปรเจ็กต์ใหม่
    2. เลือกเทมเพลต iOS > แอป
    3. ในหน้าจอตัวเลือกโปรเจ็กต์ ให้ทำดังนี้
      1. ป้อนชื่อโครงการ
      2. บันทึกค่าของช่องตัวระบุ Bundle คุณใช้ค่าดังกล่าวเพื่อจำกัดคีย์ API ได้ที่ด้านล่าง
      3. ตั้งค่าอินเทอร์เฟซของโปรเจ็กต์เป็นสตอรีบอร์ด
      4. ตั้งค่าภาษาเป็น Swift หรือ Objective-C
  4. ลากแพ็กเกจต่อไปนี้ลงในโปรเจ็กต์ (เมื่อได้รับข้อความแจ้ง ให้เลือกคัดลอกรายการหากจำเป็น โปรดใช้เวอร์ชันเดียวกับด้านบน)
    • GoogleMaps-x.x.x/Base/Frameworks/GoogleMapsBase.xcframework
    • GoogleMaps-x.x.x/Maps/Frameworks/GoogleMaps.xcframework
    • GoogleMaps-x.x.x/Maps/Frameworks/GoogleMapsCore.xcframework
    • (ลูกค้าแพ็กเกจพรีเมียมเท่านั้น) GoogleMaps-x.x.x/M4B/Frameworks/GoogleMapsM4B.xcframework
  5. คลิกขวาที่ GoogleMaps.xcframework ในโปรเจ็กต์ แล้วเลือกแสดงในตัวค้นหา
  6. ลาก GoogleMaps.bundle จากโฟลเดอร์ Resources ไปยังไดเรกทอรีระดับบนสุดของโปรเจ็กต์ Xcode เมื่อได้รับข้อความแจ้ง ให้ไม่ได้เลือกคัดลอกรายการไปยังโฟลเดอร์ของกลุ่มปลายทาง
  7. เลือกโปรเจ็กต์จาก Project Navigator แล้วเลือกเป้าหมายของแอปพลิเคชัน
  8. เปิดแท็บสร้างขั้นตอนสำหรับเป้าหมายของแอปพลิเคชัน และเพิ่มเฟรมเวิร์กและไลบรารีต่อไปนี้ภายในลิงก์ไบนารีกับไลบรารี
    • Accelerate.framework
    • CoreData.framework
    • CoreGraphics.framework
    • CoreImage.framework
    • CoreLocation.framework
    • CoreTelephony.framework
    • CoreText.framework
    • GLKit.framework
    • ImageIO.framework
    • libc++.tbd
    • libz.tbd
    • Metal.framework
    • OpenGLES.framework
    • QuartzCore.framework
    • SystemConfiguration.framework
    • UIKit.framework

  9. เลือกโปรเจ็กต์แทนเป้าหมายที่เฉพาะเจาะจง แล้วเปิดแท็บการตั้งค่าบิลด์ ในส่วน Other Linker Flags ให้เพิ่ม -ObjC หากไม่เห็นการตั้งค่าเหล่านี้ ให้เปลี่ยนตัวกรองในแถบการตั้งค่าบิลด์จากพื้นฐานเป็นทั้งหมด

  10. หากต้องการติดตั้ง Places SDK สำหรับ iOS โปรดดู เริ่มต้นใช้งาน Places SDK สำหรับ iOS

ขั้นตอนที่ 3: เพิ่มคีย์ API ลงในโปรเจ็กต์

คุณสร้างคีย์ API สำหรับแอปในรับคีย์ API แล้ว ตอนนี้ให้เพิ่มคีย์ดังกล่าวในโปรเจ็กต์ Xcode

ในตัวอย่างต่อไปนี้ ให้แทนที่ YOUR_API_KEY ด้วยคีย์ API ของคุณ

Swift

เพิ่มคีย์ API ลงใน AppDelegate.swift ดังนี้

  1. เพิ่มคำสั่งการนำเข้าต่อไปนี้ 
    import GoogleMaps
  2. เพิ่มสิ่งต่อไปนี้ลงในเมธอด application(_:didFinishLaunchingWithOptions:) โดยใช้คีย์ API ของคุณ: 
    GMSServices.provideAPIKey("YOUR_API_KEY")
  3. หากคุณใช้ Places API ด้วย ให้เพิ่มคีย์อีกครั้งตามที่แสดงไว้ที่นี่ 
    GMSPlacesClient.provideAPIKey("YOUR_API_KEY")

Objective-C

เพิ่มคีย์ API ลงใน AppDelegate.m ดังนี้

  1. เพิ่มคำสั่งการนำเข้าต่อไปนี้ 
    @import GoogleMaps;
  2. เพิ่มสิ่งต่อไปนี้ลงในเมธอด application:didFinishLaunchingWithOptions: โดยใช้คีย์ API ของคุณ: 
    [GMSServices provideAPIKey:@"YOUR_API_KEY"];
  3. หากคุณใช้ Places API ด้วย ให้เพิ่มคีย์อีกครั้งตามที่แสดงไว้ที่นี่ 
    [GMSPlacesClient provideAPIKey:@"YOUR_API_KEY"];

ขั้นตอนที่ 4 (ไม่บังคับ): เลือกใช้เฟรมเวิร์กการแสดงผลโลหะ

Maps SDK สำหรับ iOS ช่วยให้คุณเลือกใช้เฟรมเวิร์กการแสดงผลโลหะจาก Apple ได้ หากต้องการลองใช้โหมดแสดงภาพโลหะในแอป ให้เรียก [GMSServices setMetalRendererEnabled:YES] ใน Objective-C หรือ GMSServices.setMetalRendererEnabled(true) ใน Swift ก่อนที่จะสร้างมุมมองแผนที่

หากติดตั้ง SDK ด้วยตนเอง คุณต้องเพิ่ม Metal.framework ใน Xcode ด้วย

ขั้นตอนที่ 5: เพิ่มแผนที่

โค้ดด้านล่างแสดงวิธีการเพิ่มแผนที่แบบง่ายไปยัง ViewController ที่มีอยู่

  1. เพิ่มหรืออัปเดตเมธอดใน ViewController เริ่มต้นของแอปเพื่อสร้างและเริ่มต้นอินสแตนซ์ของ GMSMapView

    Swift

    /*
 * Copyright 2020 Google Inc. All rights reserved.
 *
 *
 * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this
 * file except in compliance with the License. You may obtain a copy of the License at
 *
 *     http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software distributed under
 * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF
 * ANY KIND, either express or implied. See the License for the specific language governing
 * permissions and limitations under the License.
 */

import UIKit
import GoogleMaps

class ViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view.
        // Create a GMSCameraPosition that tells the map to display the
        // coordinate -33.86,151.20 at zoom level 6.
        let camera = GMSCameraPosition.camera(withLatitude: -33.86, longitude: 151.20, zoom: 6.0)
        let mapView = GMSMapView.map(withFrame: self.view.frame, camera: camera)
        self.view.addSubview(mapView)

        // Creates a marker in the center of the map.
        let marker = GMSMarker()
        marker.position = CLLocationCoordinate2D(latitude: -33.86, longitude: 151.20)
        marker.title = "Sydney"
        marker.snippet = "Australia"
        marker.map = mapView
  }
}

    Objective-C

    /*
* Copyright 2020 Google Inc. All rights reserved.
*
*
* Licensed under the Apache License, Version 2.0 (the "License"); you may not use this
* file except in compliance with the License. You may obtain a copy of the License at
*
*     http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software distributed under
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF
* ANY KIND, either express or implied. See the License for the specific language governing
* permissions and limitations under the License.
*/

#import "ViewController.h"
#import <GoogleMaps/GoogleMaps.h>

@interface ViewController ()

@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
  // Do any additional setup after loading the view.
  // Create a GMSCameraPosition that tells the map to display the
  // coordinate -33.86,151.20 at zoom level 6.
  GMSCameraPosition *camera = [GMSCameraPosition cameraWithLatitude:-33.86
                                                          longitude:151.20
                                                               zoom:6];
  GMSMapView *mapView = [GMSMapView mapWithFrame:self.view.frame camera:camera];
  mapView.myLocationEnabled = YES;
  [self.view addSubview:mapView];

  // Creates a marker in the center of the map.
  GMSMarker *marker = [[GMSMarker alloc] init];
  marker.position = CLLocationCoordinate2DMake(-33.86, 151.20);
  marker.title = @"Sydney";
  marker.snippet = @"Australia";
  marker.map = mapView;
}

@end

    ViewController.m

  2. เรียกใช้แอปพลิเคชัน คุณควรจะเห็นแผนที่ซึ่งมีเครื่องหมายเดี่ยวอยู่ตรงกลาง เมืองซิดนีย์ ออสเตรเลีย หากเห็นเครื่องหมาย แต่แผนที่มองไม่เห็น ให้ยืนยันว่าคุณได้ระบุคีย์ API แล้ว

ขั้นตอนที่ 6 (ไม่บังคับ): ประกาศรูปแบบ URL ที่ API ใช้

แอปสามารถประกาศรูปแบบ URL ที่ต้องการเปิดได้ใน iOS 9 และ Xcode 7 โดยระบุรูปแบบในไฟล์ Info.plist ของแอป Maps SDK สำหรับ iOS จะเปิดแอป Google Maps บนอุปกรณ์เคลื่อนที่เมื่อผู้ใช้คลิกโลโก้ Google บนแผนที่ แอปของคุณจึงประกาศสคีม URL ที่เกี่ยวข้องได้

หากต้องการประกาศรูปแบบ URL ที่ Maps SDK สำหรับ iOS ใช้ ให้เพิ่มบรรทัดต่อไปนี้ลงใน Info.plist

<key>LSApplicationQueriesSchemes</key>
<array>
    <string>googlechromes</string>
    <string>comgooglemaps</string>
</array>

ภาพหน้าจอต่อไปนี้แสดงการกำหนดค่าในอินเทอร์เฟซผู้ใช้ Xcode

การกำหนดค่า LSApplicationQueriesSchemes ใน Xcode

หากไม่มีการประกาศข้างต้น ข้อผิดพลาดต่อไปนี้อาจเกิดขึ้นเมื่อผู้ใช้แตะโลโก้ Google บนแผนที่

-canOpenURL: failed for URL: "comgooglemaps://" - error: "This app is not allowed to query for scheme comgooglemaps"
-canOpenURL: failed for URL: "googlechromes://" - error: "This app is not allowed to query for scheme googlechromes"

หากต้องการกำจัดข้อผิดพลาดเหล่านี้ ให้เพิ่มการประกาศลงใน Info.plist ตามที่อธิบายไว้ข้างต้น

ขั้นตอนถัดไป

ตอนนี้คุณมีคีย์ API และโปรเจ็กต์ Xcode แล้ว คุณก็สร้างและเรียกใช้แอปได้ Maps SDK สำหรับ iOS มีบทแนะนำและแอปตัวอย่างมากมายที่จะช่วยคุณในการเริ่มต้นใช้งาน โปรดดูรายละเอียดเพิ่มเติมจากหัวข้อต่อไปนี้