הצגת חלון מידע עבור סמן

בדוגמה הזו מוצגים סמנים בשלושה ערים גדולות באוסטרליה. כשהמשתמש מקייש על סמן, מופיע חלון מידע.

שנתחיל?

לפני שתוכלו לנסות את הקוד לדוגמה, עליכם להגדיר את סביבת הפיתוח. מידע נוסף זמין במאמר דוגמאות קוד ל-SDK של מפות ל-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
      

הפעלה מקומית של האפליקציה המלאה לדוגמה

האפליקציה לדוגמה של SDK של מפות ל-iOS זמינה כארכיון להורדה ב-GitHub. כך מתקינים את האפליקציה לדוגמה של Maps SDK ל-iOS ומנסים אותה.

  1. מריצים את הפקודה git clone https://github.com/googlemaps-samples/maps-sdk-for-ios-samples.git כדי להעתיק את המאגר לדוגמה לספרייה מקומית.
  2. פותחים חלון טרמינל, עוברים לספרייה שבה קלונתם את קובצי הדוגמה ומבצעים התמקדות בספרייה GoogleMaps:

    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, לוחצים על לחצן ה-compile כדי ליצור את האפליקציה לפי התוכנית הנוכחית. תופיע הודעת שגיאה ב-build עם בקשה להזין את מפתח ה-API בקובץ SDKConstants.swift עבור Swift או בקובץ SDKDemoAPIKey.h עבור Objective-C.
  4. אם עדיין אין לכם מפתח API, עליכם לפעול לפי ההוראות כדי להגדיר פרויקט במסוף Google Cloud ולקבל מפתח API. כשמגדירים את המפתח במסוף Cloud, אפשר להגביל את המפתח למזהה החבילה של האפליקציה לדוגמה, כדי לוודא שרק האפליקציה שלכם תוכל להשתמש במפתח. מזהה החבילה שמוגדר כברירת מחדל באפליקציית הדוגמאות של ה-SDK הוא com.example.GoogleMapsDemos.
  5. עורכים את הקובץ SDKConstants.swift עבור Swift או את הקובץ SDKDemoAPIKey.h עבור Objective-C, ומדביקים את מפתח ה-API בהגדרה של הקבוע 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 של מפות.
  8. בוחרים באחת מהאפשרויות שמוצגות כדי להתנסות בתכונה של SDK של מפות ל-iOS.
  9. אם מופיעה בקשה לתת ל-GoogleMapsDemos גישה למיקום שלכם, בוחרים באפשרות אישור.