إضافة خريطة

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

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

مقدمة

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

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

الفئة الرئيسية عند العمل مع كائن خريطة هي الفئة GMSMapView. تعالج الفئة GMSMapView العمليات التالية تلقائيًا:

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

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

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

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

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

إضافة خريطة

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

  1. للحصول على حزمة تطوير البرامج بالاستناد إلى بيانات "خرائط Google" لتطبيقات iOS، والحصول على مفتاح واجهة برمجة التطبيقات، وإضافة الأُطر المطلوبة، اتّبِع الخطوات التالية:

    1. الإعداد في وحدة تحكّم Google Cloud

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

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

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

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

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

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

    8. أنشئ فئة GMSMapView وخصّصها باستخدام طريقة GMSMapView options:. إذا كان سيتم استخدام هذه الخريطة كالعرض الوحيد لوحدة التحكّم في العرض، يمكن استخدام القيمة التلقائية لخيار الخريطة frame CGRectZero كـ 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 بشكلٍ إضافي.

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

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