إضافة خريطة

اختيار النظام الأساسي: Android iOS JavaScript

يتم تمثيل الخرائط في واجهة برمجة التطبيقات من خلال فئة GMSMapView، وهي فئة فرعية من UIView. الخريطة هي أهم عنصر في مكتبة برمجة التطبيقات (SDK) لتطبيق "خرائط Google" لنظام التشغيل iOS، وتوفر الطرق اللازمة لإضافة العناصر الأخرى وإزالتها وإدارتها، مثل العلامات والخطوط المتعددة.

مقدمة

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

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

فئة GMSMapView هي فئة المفاتيح عند العمل مع عنصر إنشاء الخريطة. يعالج GMSMapView العمليات التالية تلقائيًا:

  • جارٍ الاتصال بخدمة "خرائط Google".
  • يتم تنزيل مربعات الخريطة.
  • عرض المربّعات على شاشة الجهاز
  • عرض عناصر تحكّم مختلفة، مثل التمرير والتكبير/التصغير
  • الاستجابة لإيماءات التمرير والتكبير/التصغير من خلال تحريك الخريطة وتكبيرها أو تصغيرها
    • الاستجابة لإيماءات إصبعَين من خلال إمالة زاوية عرض الخريطة

بالإضافة إلى هذه العمليات التلقائية، يمكنك التحكّم في سلوك الخريطة ومظهرها من خلال السمات والطُرق التي تعرضها فئة GMSMapView. يتيح لك GMSMapView إضافة وإزالة العلامات وتراكبات سطح الأرض وخطوط الالتفاف وتغيير نوع الخريطة المعروضة والتحكّم في ما يتم عرضه على الخريطة من خلال فئة GMSCameraPosition.

إنشاء خرائط باستخدام SwiftUI

يوفّر SwiftUI طريقة إضافية لإنشاء واجهة مستخدم باستخدام نهج تعريفي. يمكنك إعلام SwiftUI بالمظهر الذي تريده لعرضك وجميع حالاته المختلفة، وسيتولى النظام تنفيذ المهام الأخرى. تتولى SwiftUI تعديل العرض كلما تغيّرت الحالة الأساسية بسبب حدث أو إجراء من المستخدِم.

تم إنشاء حزمة تطوير البرامج (SDK) لتطبيق "خرائط Google" لنظام التشغيل iOS استنادًا إلى UIKit ولا توفّر عرضًا متوافقًا مع SwiftUI. تتطلّب إضافة الخرائط في SwiftUI الامتثال لأيّ من الإصدارين UIViewRepresentable أو UIViewControllerRepresentable. لمزيد من المعلومات، يمكنك الاطّلاع على إضافة خريطة إلى تطبيقك المتوافق مع نظام التشغيل iOS باستخدام IDE SwiftUI.

إضافة خريطة

في ما يلي الخطوات الأساسية لإضافة خريطة:

  1. للحصول على حزمة تطوير البرامج (SDK) والحصول على مفتاح واجهة برمجة التطبيقات وإضافة الإطارات الأساسية المطلوبة، اتّبِع الخطوات الواردة في:

    1. الإعداد في Google Cloud Console

    2. استخدام مفتاح واجهة برمجة التطبيقات

    3. إعداد مشروع Xcode

    4. في AppDelegate، قدِّم مفتاح واجهة برمجة التطبيقات إلى provideAPIKey: طريقة الفئة في GMSServices.

    5. أنشئ ViewController أو عدِّله. إذا تم عرض الخريطة عندما يصبح محرِّك العرض هذا مرئيًا، احرص على إنشائها ضمن الأسلوب viewDidLoad.

    6. عند إعداد عرض الخريطة، يمكنك ضبط خيارات الإعداد باستخدام رمز GMSMapViewOptions. تشمل السمات frame أو camera أو mapID أوbackgroundColor أو screen.

    7. اضبط سمة camera في خيارات الخريطة باستخدام عنصر GMSCameraPosition. يحدّد هذا المقياس مركز الخريطة ومستوى تكبيرها.

    8. أنشئ فئة GMSMapView وأنشئ مثيلًا لها باستخدام الطريقة GMSMapView options:. إذا كان سيتم استخدام هذه الخريطة كعرض فقط لوحدة التحكّم في العرض، يمكن استخدام القيمة التلقائية CGRectZero لخيار الخريطة frame كعرض frame، ويتم تغيير حجم الخريطة تلقائيًا.

    9. اضبط عنصر GMSMapView على أنّه عرض "عنصر التحكّم في العرض". على سبيل المثال، self.view = mapView;.

يضيف المثال أدناه خريطة تركّز على وسط مدينة سنغافورة إلى أحد التطبيقات.

Swift

import GoogleMaps

class MapObjects : UIViewController {
  override func viewDidLoad() {
    super.viewDidLoad()

    let options = GMSMapViewOptions()
    options.camera = GMSCameraPosition(latitude: 1.285, longitude: 103.848, zoom: 12)
    options.frame = self.view.bounds;

    let mapView = GMSMapView(options:options)
    self.view = mapView
  }
}

Objective-C

- (void)viewDidLoad {
  [super viewDidLoad];

  GMSMapViewOptions *options = [[GMSMapViewOptions alloc] init];
  options.camera = [GMSCameraPosition cameraWithLatitude:1.285
                                                        longitude:103.848
                                                             zoom:12];
  options.frame = self.view.bounds;

  GMSMapView *mapView = [[GMSMapView alloc] initWithOptions:options];
  self.view = mapView;
}

بعد اتّباع هذه الخطوات، يمكنك ضبط GMSMapView العنصر بشكلٍ أكبر.

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

بعد إكمال هذه الخطوات، يمكنك ضبط إعدادات التضاريس.