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

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

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

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

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

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

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

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

ใช้ 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 พร้อมด้วยversions ต่อไปนี้คือตัวอย่างที่ประกอบด้วยทรัพยากร 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.3.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 เป็นเวอร์ชันล่าสุด

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

คู่มือนี้จะแสดงวิธีเพิ่ม XCFrameworks ที่มี Maps SDK สำหรับ iOS ลงในโปรเจ็กต์ของคุณด้วยตนเองและกำหนดค่าบิวด์ใน Xcode XCFramework เป็นแพ็กเกจไบนารีที่คุณใช้ได้ในหลายแพลตฟอร์ม รวมถึงเครื่องที่ใช้ Apple silicon
  1. ดาวน์โหลดไบนารี SDK และไฟล์แหล่งข้อมูลต่อไปนี้
  2. คลายการบีบอัดไฟล์ซิปเพื่อเข้าถึง XCFrameworks และทรัพยากร
  3. หากยังไม่มีโปรเจ็กต์ Xcode ให้สร้างโปรเจ็กต์ตอนนี้แล้วบันทึกลงในเครื่องภายใน หากคุณเพิ่งเริ่มใช้การพัฒนา iOS ให้ทำดังนี้
    1. สร้างโปรเจ็กต์ใหม่
    2. เลือกเทมเพลต iOS > แอป
    3. ในหน้าจอตัวเลือกโปรเจ็กต์ ให้ทำดังนี้
      1. ป้อนชื่อโปรเจ็กต์
      2. บันทึกค่าของช่องตัวระบุ Bundle คุณใช้ค่าดังกล่าวเพื่อจำกัดคีย์ API ได้ที่ด้านล่าง
      3. ตั้งค่าอินเทอร์เฟซของโปรเจ็กต์เป็นสตอรีบอร์ด
      4. ตั้งค่าภาษาเป็น Swift หรือ Objective-C
  4. ลาก XCFrameworks ต่อไปนี้ลงในโปรเจ็กต์ในส่วนเฟรม ไลบรารี และเนื้อหาที่ฝัง ตรวจสอบว่าได้เลือกไม่ฝังสำหรับ XCFramework แต่ละรายการดังนี้
    • GoogleMaps.xcframework
    • GoogleMapsBase.xcframework
    • GoogleMapsCore.xcframework
    • (ลูกค้าแพ็กเกจพรีเมียมเท่านั้น) GoogleMapsM4B.xcframework
  5. ลาก GoogleMaps.bundle จาก GoogleMapsResources ที่คุณดาวน์โหลดไปยังไดเรกทอรีระดับบนสุดของโปรเจ็กต์ Xcode เมื่อมีข้อความแจ้ง ให้เลือกคัดลอกรายการหากจำเป็น
  6. เลือกโปรเจ็กต์จาก Project Navigator แล้วเลือกเป้าหมายของแอปพลิเคชัน
  7. เปิดแท็บ Build Phase สำหรับเป้าหมายของแอปพลิเคชัน และภายในลิงก์ไบนารีกับไลบรารี จากนั้นเพิ่มเฟรมเวิร์กและไลบรารีต่อไปนี้
    • 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
  8. เลือกโปรเจ็กต์แทนเป้าหมายเฉพาะ แล้วเปิดแท็บการตั้งค่าของบิลด์ ในส่วน Linker Flag อื่นๆ ให้เพิ่ม -ObjC หากไม่เห็นการตั้งค่าเหล่านี้ ให้เปลี่ยนตัวกรองในแถบการตั้งค่าบิลด์จากพื้นฐานเป็นทั้งหมด

  9. หากต้องการติดตั้ง Places SDK สำหรับ iOS XCFramework โปรดดูเริ่มต้นใช้งาน 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: เพิ่มแผนที่

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 options = GMSMapViewOptions()
        options.camera = GMSCameraPosition.camera(withLatitude: -33.86, longitude: 151.20, zoom: 6.0)
        options.frame = self.view.bounds

        let mapView = GMSMapView(options: options)
        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.
  GMSMapViewOptions *options = [[GMSMapViewOptions alloc] init];
  options.camera = [GMSCameraPosition cameraWithLatitude:-33.8683
                                                        longitude:151.2086
                                                             zoom:6];
  options.frame = self.view.bounds;
  GMSMapView *mapView = [[GMSMapView alloc] initWithOptions:options];

  [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

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

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

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

LSApplicationQueriesSchemes googlechromes comgooglemaps

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

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

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

-canOpenURL: URL ล้มเหลว: "comgooglemaps://" - ข้อผิดพลาด: "แอปนี้ไม่ได้รับอนุญาตให้ค้นหา Scheme comgooglemaps" -canOpenURL: แสดง URL ไม่สำเร็จ: "googlechromes://" - ข้อผิดพลาด: "แอปนี้ไม่ได้รับอนุญาตให้ค้นหา Scheme ของ googlechrome"

เพิ่มการประกาศลงใน Info.plist เพื่อกำจัดข้อผิดพลาดเหล่านี้

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

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