عرض نافذة معلومات لعلامة

يعرض هذا المثال علامات على ثلاث مدن رئيسية في أستراليا. عندما ينقر المستخدم على محدّد موقع، تظهر نافذة معلومات.

البدء

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

عرض الرمز

Swift

import GoogleMaps
import UIKit

final class MarkerInfoWindowViewController: UIViewController {

  private let sydneyMarker = GMSMarker(
    position: CLLocationCoordinate2D(latitude: -33.8683, longitude: 151.2086))

  private let melbourneMarker = GMSMarker(
    position: CLLocationCoordinate2D(latitude: -37.81969, longitude: 144.966085))

  private let brisbaneMarker = GMSMarker(
    position: CLLocationCoordinate2D(latitude: -27.4710107, longitude: 153.0234489))

  private lazy var contentView: UIImageView = {
    return UIImageView(image: UIImage(named: "aeroplane"))
  }()

  override func loadView() {
    let cameraPosition = GMSCameraPosition(latitude: -37.81969, longitude: 144.966085, zoom: 4)
    let mapView = GMSMapView(frame: .zero, camera: cameraPosition)
    mapView.delegate = self
    view = mapView

    sydneyMarker.title = "Sydney"
    sydneyMarker.snippet = "Population: 4,605,992"
    sydneyMarker.map = mapView

    melbourneMarker.title = "Melbourne"
    melbourneMarker.snippet = "Population: 4,169,103"
    melbourneMarker.map = mapView

    brisbaneMarker.title = "Brisbane"
    brisbaneMarker.snippet = "Population: 2,189,878"
    brisbaneMarker.map = mapView
  }
}

extension MarkerInfoWindowViewController: GMSMapViewDelegate {
  func mapView(_ mapView: GMSMapView, markerInfoWindow marker: GMSMarker) -> UIView? {
    if marker == sydneyMarker {
      return contentView
    }
    return nil
  }

  func mapView(_ mapView: GMSMapView, markerInfoContents marker: GMSMarker) -> UIView? {
    if marker == brisbaneMarker {
      return contentView
    }
    return nil
  }

  func mapView(_ mapView: GMSMapView, didCloseInfoWindowOf marker: GMSMarker) {
    showToast(message: "Info window for marker \(marker.title ?? "") closed.")
  }

  func mapView(_ mapView: GMSMapView, didLongPressInfoWindowOf marker: GMSMarker) {
    showToast(message: "Info window for marker \(marker.title ?? "") long pressed.")
  }
}

extension UIViewController {
  func showToast(message: String) {
    let toast = UIAlertController(title: nil, message: message, preferredStyle: .alert)
    present(
      toast, animated: true,
      completion: {
        DispatchQueue.main.asyncAfter(deadline: DispatchTime.now() + .seconds(2)) {
          toast.dismiss(animated: true)
        }
      })
  }
}
      

Objective-C

#import "GoogleMapsDemos/Samples/MarkerInfoWindowViewController.h"

#import "GoogleMapsDemos/UIViewController+GMSToastMessages.h"
#import <GoogleMaps/GoogleMaps.h>

@interface MarkerInfoWindowViewController () <GMSMapViewDelegate>

@end

@implementation MarkerInfoWindowViewController {
  GMSMarker *_sydneyMarker;
  GMSMarker *_melbourneMarker;
  GMSMarker *_brisbaneMarker;
  UIView *_contentView;
}

- (void)viewDidLoad {
  [super viewDidLoad];
  GMSCameraPosition *camera = [GMSCameraPosition cameraWithLatitude:-37.81969
                                                          longitude:144.966085
                                                               zoom:4];
  GMSMapView *mapView = [GMSMapView mapWithFrame:CGRectZero camera:camera];

  _sydneyMarker = [[GMSMarker alloc] init];
  _sydneyMarker.title = @"Sydney";
  _sydneyMarker.snippet = @"Population: 4,605,992";
  _sydneyMarker.position = CLLocationCoordinate2DMake(-33.8683, 151.2086);
  _sydneyMarker.map = mapView;
  NSLog(@"sydneyMarker: %@", _sydneyMarker);

  _melbourneMarker.map = nil;
  _melbourneMarker = [[GMSMarker alloc] init];
  _melbourneMarker.title = @"Melbourne";
  _melbourneMarker.snippet = @"Population: 4,169,103";
  _melbourneMarker.position = CLLocationCoordinate2DMake(-37.81969, 144.966085);
  _melbourneMarker.map = mapView;
  NSLog(@"melbourneMarker: %@", _melbourneMarker);

  _brisbaneMarker.map = nil;
  _brisbaneMarker = [[GMSMarker alloc] init];
  _brisbaneMarker.title = @"Brisbane";
  _brisbaneMarker.snippet = @"Population: 2,189,878";
  _brisbaneMarker.position = CLLocationCoordinate2DMake(-27.4710107, 153.0234489);
  _brisbaneMarker.map = mapView;
  NSLog(@"brisbaneMarker: %@", _brisbaneMarker);

  _contentView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"aeroplane"]];

  mapView.delegate = self;
  self.view = mapView;
}

#pragma mark GMSMapViewDelegate

- (UIView *)mapView:(GMSMapView *)mapView markerInfoWindow:(GMSMarker *)marker {
  if (marker == _sydneyMarker) {
    return _contentView;
  }
  return nil;
}

- (UIView *)mapView:(GMSMapView *)mapView markerInfoContents:(GMSMarker *)marker {
  if (marker == _brisbaneMarker) {
    return _contentView;
  }
  return nil;
}

- (void)mapView:(GMSMapView *)mapView didCloseInfoWindowOfMarker:(GMSMarker *)marker {
  NSString *message =
      [NSString stringWithFormat:@"Info window for marker %@ closed.", marker.title];
  [self gms_showToastWithMessage:message];
}

- (void)mapView:(GMSMapView *)mapView didLongPressInfoWindowOfMarker:(GMSMarker *)marker {
  NSString *message =
      [NSString stringWithFormat:@"Info window for marker %@ long pressed.", marker.title];
  [self gms_showToastWithMessage:message];
}

@end
      

تشغيل نموذج التطبيق الكامل على الجهاز

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

  1. شغِّل git clone https://github.com/googlemaps-samples/maps-sdk-for-ios-samples.git لنسخ مستودع العيّنات إلى دليل محلي.
  2. افتح نافذة طرفية، وانتقل إلى الدليل الذي استنسخت فيه نماذج الملفات، التوغّل في دليل خرائط Google:

    Swift

    cd maps-sdk-for-ios-samples-main/GoogleMaps-Swift
    pod install
    open GoogleMapsSwiftDemos.xcworkspace

    Objective-C

    cd maps-sdk-for-ios-samples-main/GoogleMaps
    pod install
    open GoogleMapsDemos.xcworkspace
  3. في Xcode، اضغط على زر التجميع إنشاء التطبيق بالمخطط الحالي. يعرض الإصدار خطأً، يطلب منك إدخال مفتاح واجهة برمجة التطبيقات. في ملف SDKConstants.swift لـ Swift أو SDKDemoAPIKey.h لـ Objective-C.
  4. إذا لم يكن لديك مفتاح واجهة برمجة تطبيقات بعد، اتّبِع التعليمات لإعداد مشروع على Google Cloud Console والحصول على مفتاح واجهة برمجة تطبيقات. عند تهيئة في Cloud Console، يمكنك حصر المفتاح على نموذج معرِّف حِزمة التطبيق ضمان أنّ تطبيقك فقط هو من يمكنه استخدام المفتاح. معرّف الحِزمة التلقائي لتطبيق نماذج حِزم تطوير البرامج (SDK) هو com.example.GoogleMapsDemos.
  5. يمكنك تعديل ملف SDKConstants.swift في Swift أو SDKDemoAPIKey.h. لـ Objective-C وألصق مفتاح واجهة برمجة التطبيقات في تعريف قيمة ثابتة apiKey أو kAPIKey على سبيل المثال:

    Swift

    static let apiKey = "YOUR_API_KEY"

    Objective-C

    static NSString *const kAPIKey = @"YOUR_API_KEY";
  6. في ملف SDKConstants.swift (Swift) أو ملفSDKDemoAPIKey.h (Objective-C)، أزِل السطر التالي، لأنّه يُستخدَم لتسجيل المشكلة التي يحدّدها المستخدم:

    Swift

    #error (Register for API Key and insert here. Then delete this line.)

    Objective-C

    #error Register for API Key and insert here.
  7. بناء المشروع وإدارته. تظهر نافذة محاكي iOS، وتعرض قائمة بالعروض التوضيحية لحزمة تطوير البرامج (SDK) لتطبيق "خرائط Google".
  8. اختَر أحد الخيارات المعروضة لتجربة إحدى ميزات حزمة تطوير البرامج بالاستناد إلى بيانات "خرائط Google" لتطبيقات iOS.
  9. إذا طُلب منك السماح لبرنامج GoogleMapsDemos بالوصول إلى موقعك الجغرافي، اختَر السماح: