إضافة خريطة باستخدام محدّد موقع

يوضح لك هذا البرنامج التعليمي كيفية إضافة خريطة Google إلى تطبيق iOS. تتضمن الخريطة علامة، تسمى أيضًا دبوس، للإشارة إلى موقع معين.

الحصول على الرمز

استنسِخ أو نزِّل مستودع نماذج "خرائط Google" على نظام التشغيل iOS من GitHub.

< > إظهار/إخفاء رمز 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
  }
}

< > إظهار/إخفاء رمز Object-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

إعداد مشروع التطوير

اتبع الخطوات التالية لتثبيت حزمة تطوير البرامج بالاستناد إلى بيانات "خرائط Google" لنظام التشغيل iOS:

1. نزِّل Xcode الإصدار 14.0 أو إصدار أحدث وثبِّته.
2. إذا لم يكن لديك جهاز CocoaPods، يمكنك تثبيته على نظام التشغيل macOS من خلال تنفيذ الأمر التالي من الوحدة الطرفية:

   sudo gem install cocoapods

3. استنسِخ أو نزِّل مستودع نماذج "خرائط Google" على نظام التشغيل iOS.
4. انتقِل إلى الدليل tutorials/map-with-marker.
5. نفِّذ الأمر pod install. سيؤدي هذا الإجراء إلى تثبيت واجهات برمجة التطبيقات المحدّدة في Podfile، بالإضافة إلى أي تبعيات قد تتضمّنها.
6. شغِّل تطبيق "pod outdated" للمقارنة بين إصدار المجموعة المثبَّتة وأي تحديثات جديدة. في حال رصد إصدار جديد، عليك تشغيل pod update لتحديث Podfile وتثبيت أحدث إصدار من حزمة تطوير البرامج (SDK). لمزيد من التفاصيل، يُرجى الاطّلاع على دليل CocoaPods.
7. افتح (انقر مرّتين) ملف map-with-marker.xcworkspace للمشروع لفتحه في Xcode. يجب استخدام ملف .xcworkspace لفتح المشروع.

الحصول على مفتاح واجهة برمجة التطبيقات وتفعيل واجهات برمجة التطبيقات اللازمة

لإكمال هذا البرنامج التعليمي، تحتاج إلى مفتاح واجهة برمجة تطبيقات Google مصرح له باستخدام حزمة SDK للخرائط لنظام iOS. انقر فوق الزر أدناه للحصول على مفتاح وتنشيط واجهة برمجة التطبيقات.

البدء

لمزيد من التفاصيل، يُرجى الاطّلاع على مقالة الحصول على مفتاح واجهة برمجة التطبيقات.

إضافة مفتاح واجهة برمجة التطبيقات إلى تطبيقك

أضِف مفتاح واجهة برمجة التطبيقات إلى AppDelegate.swift على النحو التالي:

1. تجدر الإشارة إلى أنّه تمت إضافة عبارة الاستيراد التالية إلى الملف:

   import GoogleMaps

2. عدِّل السطر التالي في طريقة application(_:didFinishLaunchingWithOptions:)، مع استبدال YOUR_API_KEY بمفتاح واجهة برمجة التطبيقات الخاص بك:

   GMSServices.provideAPIKey("YOUR_API_KEY")

ملاحظة: تم ضبط نموذج الرمز الخاص بالبرنامج التعليمي المكتمل للتشغيل كمشروع Swift Xcode، ولكنّه يتضمّن أمثلة على Swift وTarget-C.

إنشاء تطبيقك وتشغيله

1. وصِّل جهاز iOS بجهاز الكمبيوتر أو اختَر محاكي من القائمة المنبثقة لنظام Xcode.
2. إذا كنت تستخدم جهازًا، فتأكد من أن خدمات الموقع الجغرافي مُفعَّلة. إذا كنت تستخدم أحد المحاكيات، اختَر موقعًا جغرافيًا من قائمة الميزات.
3. في Xcode، انقر على خيار القائمة المنتج/التشغيل (أو رمز زر التشغيل).
• ينشئ Xcode التطبيق ثم يشغِّله على الجهاز أو على المحاكي.
• من المفترض أن تظهر لك خريطة تحتوي على مُحدّد في مركز مدينة سيدني على الساحل الشرقي لأستراليا، على غرار الصورة في هذه الصفحة.

تحرّي الخلل وإصلاحه:

• إذا لم تظهر لك خريطة، تأكّد من أنّك حصلت على مفتاح واجهة برمجة التطبيقات وأضفته إلى التطبيق، كما هو موضّح أعلاه. تحقَّق من وحدة تحكُّم تصحيح الأخطاء في Xcode بحثًا عن رسائل خطأ بشأن مفتاح واجهة برمجة التطبيقات.
• إذا فرضت قيودًا على مفتاح واجهة برمجة التطبيقات من خلال معرّف حزمة iOS، يمكنك تعديل المفتاح لإضافة معرّف الحزمة للتطبيق: com.google.examples.map-with-marker.
• تأكَّد من توفُّر اتصال جيد بشبكة WiFi أو نظام تحديد المواقع العالمي (GPS).
• استخدِم أدوات تصحيح أخطاء Xcode للاطّلاع على السجلات وتصحيح أخطاء التطبيق.

فهم الرمز

1. يمكنك إنشاء خريطة وضبطها كعرض في loadView().

   Swift

   // 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: CGRect.zero, camera: camera)
   view = mapView
         

   Objective-C

   // 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.0];
   GMSMapView *mapView = [[GMSMapView alloc] initWithFrame: CGRectZero camera:camera];
   self.view = mapView;
         

2. إضافة علامة إلى الخريطة في loadView()

   Swift

   // 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

   // 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;
         

تعرض حزمة تطوير البرامج بالاستناد إلى بيانات "خرائط Google" لنظام التشغيل iOS محتوى نافذة المعلومات تلقائيًا عندما ينقر المستخدم على محدّد موقع. ما مِن حاجة إلى إضافة أداة معالجة النقرات للعلامة إذا أردت استخدام السلوك التلقائي.

تهانينا! لقد أنشأت تطبيق iOS يعرض خريطة Google بعلامة تشير إلى موقع معين. لقد تعلمت أيضًا كيفية استخدام حزمة SDK للخرائط لنظام التشغيل iOS.

الخطوات التالية

اطّلع على مزيد من المعلومات حول كائن الخريطة، وما يمكنك فعله باستخدام العلامات.