إضافة خريطة باستخدام محدّد موقع

توضح لك هذه الدورة التعليمية كيفية إضافة خريطة Google إلى تطبيق iOS. وتتضمن الخريطة علامة تُعرف أيضًا باسم دبوس للإشارة إلى موقع معين.

جارٍ الحصول على الرمز

استنسِخ أو نزِّل مستودع نماذج iOS على "خرائط Google" من 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
  }
}

< > إظهار/إخفاء رمز الهدف-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 للخرائط لنظام التشغيل iOS:

1. نزّل وثبّت Xcode الإصدار 13.0 أو إصدارًا أحدث.
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 API معتمد لاستخدام "SDK للخرائط" لنظام التشغيل iOS. انقر على الزر أدناه للحصول على مفتاح وتنشيط واجهة برمجة التطبيقات.

البدء

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

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

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

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

   import GoogleMaps

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

   GMSServices.provideAPIKey("YOUR_API_KEY")

ملاحظة: تم إعداد نموذج التعليمات البرمجية للبرنامج التعليمي المُكتمل ليعمل كمشروع سويفت Xcode، ولكنه يتضمّن أمثلة عن Swift وGoal-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;
         

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

تهانينا! لقد أنشأت تطبيق iOS يعرض خريطة Google باستخدام علامة للإشارة إلى موقع معين. كما تعلمت كيفية استخدام تطبيق SDK للخرائط لنظام التشغيل iOS.

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

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