إضافة خريطة تتضمّن علامة

يوضّح هذا الدليل التعليمي كيفية إضافة خريطة Google مع علامة إلى تطبيق iOS. وهو مناسب للمستخدمين الذين لديهم معرفة أساسية أو متوسطة بلغة Swift أو Objective-C بالإضافة إلى معرفة عامة ببرنامج Xcode. للحصول على دليل متقدّم حول إنشاء الخرائط، يمكنك قراءة دليل المطوّرين.

ستنشئ الخريطة التالية باستخدام هذا البرنامج التعليمي. تم وضع العلامة في سيدني، أستراليا.

الحصول على الشفرة‏

استنسِخ أو نزِّل مستودع عيّنات Google Maps iOS على GitHub.

يمكنك بدلاً من ذلك النقر على الزر التالي لتنزيل رمز المصدر:

أريد الرمز

Swift

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

#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
      

البدء

Swift Package Manager

يمكن تثبيت حزمة تطوير البرامج بالاستناد إلى بيانات "خرائط Google" لتطبيقات iOS باستخدام Swift Package Manager.

1. أزِل أي تبعيات حالية لحزمة تطوير البرامج بالاستناد إلى بيانات "خرائط Google" لأجهزة iOS.
2. افتح نافذة أوامر طرفية وانتقِل إلى الدليل tutorials/map-with-marker.
3. أغلِق مساحة عمل Xcode ونفِّذ الأوامر التالية:

   sudo gem install cocoapods-deintegrate cocoapods-clean
   pod deintegrate
   pod cache clean --all
   rm Podfile
   rm map-with-marker.xcworkspace

4. افتح مشروع Xcode واحذف ملف podfile.
5. انتقِل إلى ملف (File) > إضافة تبعيات الحزمة (Add Package Dependencies).
6. أدخِل https://github.com/googlemaps/ios-maps-sdk كعنوان URL، واضغط على Enter لجلب الحزمة، ثم انقر على إضافة حزمة.
7. قد تحتاج إلى إعادة ضبط ذاكرة التخزين المؤقت للحزمة باستخدام ملف > الحِزم > إعادة ضبط ذاكرة التخزين المؤقت للحزمة.

استخدام CocoaPods

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

   sudo gem install cocoapods

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

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

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

البدء

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

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

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

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

   import GoogleMaps

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

   GMSServices.provideAPIKey("YOUR_API_KEY")

ملاحظة: تم إعداد الرمز النموذجي للدليل التعليمي المكتمل ليتم تشغيله كمشروع Swift Xcode، ولكنّه يتضمّن أمثلة على Swift وObjective-C.

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

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

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

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

فهم الرمز

1. أنشئ خريطة واضبطها كطريقة العرض في viewDidLoad().

   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. أضِف محدّد موقع إلى الخريطة في viewDidLoad().

   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;
         

تعرض حزمة تطوير البرامج (SDK) لـ "خرائط Google" المتوافقة مع iOS تلقائيًا محتوى نافذة المعلومات عندما ينقر المستخدم على علامة. ليس عليك إضافة أداة معالجة نقرات للعلامة إذا كنت راضيًا عن السلوك التلقائي.

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

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

مزيد من المعلومات حول عنصر الخريطة والإجراءات التي يمكنك اتّخاذها باستخدام العلامات