إضافة خريطة باستخدام علامة

يوضح لك هذا البرنامج التعليمي كيفية إضافة خريطة 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
  }
}

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

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

اتبع الخطوات التالية لتثبيت SDK لخرائط Google لنظام التشغيل iOS:

1. نزِّل الإصدار 14.0 أو إصدار أحدث من Xcode وثبِّته.
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 وObjective-C.

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

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

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

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