إضافة خريطة

تنظيم صفحاتك في مجموعات يمكنك حفظ المحتوى وتصنيفه حسب إعداداتك المفضّلة.

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

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

المقدمة

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

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

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

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

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

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

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

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

إضافة خريطة

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

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

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

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

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

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

  3. إنشاء ViewController أو تحديثها. إذا تم عرض الخريطة عندما تصبح وحدة تحكم الملف الشخصي هذه مرئية، احرص على إنشائها ضمن طريقة loadView.

    1. يمكنك إنشاء كائن GMSCameraPosition يحدِّد مركز الخريطة وتكبيرها/تصغيرها. عند إنشاء مثيل للكائن GMSMapView، عليك تمرير العنصر GMSCameraPosition كمعلّمة مطلوبة.

    2. إنشاء فئة GMSMapView وإنشائها باستخدام طريقة GMSMapView mapWithFrame:. إذا تم استخدام هذه الخريطة كطريقة عرض وحدة التحكم فقط في العرض، يمكن استخدام CGRectZero كإطار الخريطة - سيتم تغيير حجم الخريطة تلقائيًا.

    3. ضبط الكائن GMSMapView كعرض وحدة التحكُّم في العرض، مثل self.view = mapView;

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

Swift

import GoogleMaps

class MapObjects : UIViewController {
  override func viewDidLoad() {
    super.viewDidLoad()
    let camera = GMSCameraPosition(latitude: 1.285, longitude: 103.848, zoom: 12)
    let mapView = GMSMapView(frame: .zero, camera: camera)
    self.view = mapView
  }
}
      

Objective-C

#import "MapObjects.h"
@import GoogleMaps;

@implementation MapObjects

- (void)viewDidLoad {
  [super viewDidLoad];
  GMSCameraPosition *camera = [GMSCameraPosition cameraWithLatitude:1.285
                                                          longitude:103.848
                                                               zoom:12];
  GMSMapView *mapView = [GMSMapView mapWithFrame:CGRectZero camera:camera];
  self.view = mapView;
}

@end
      

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

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

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