情報ウィンドウを使用すると、ユーザーが クリックします。
情報ウィンドウは、デバイスの画面を基準に上中央に配置されるよう描画されます 表示されます。デフォルトの情報ウィンドウでは、タイトルが太字で表示され、 タイトルの下にスニペットテキストを追加します
情報ウィンドウのコンテンツは、title と
マーカーの snippet プロパティ。マーカーをクリックしても、
title プロパティと snippet プロパティの両方が空白または nil の場合は、情報ウィンドウを使用します。
情報ウィンドウは一度に 1 つのみ表示されます。ユーザーが クリックすると、現在のウィンドウは非表示になり、新しい情報ウィンドウが開きます。 情報ウィンドウが表示されているマーカーをユーザーがクリックすると、 情報ウィンドウが閉じたり、再度開いたりします。
カスタム情報ウィンドウを作成して、テキストや画像を追加します。カスタム 情報ウィンドウでは、ポップアップの外観を詳細に制御できます。
情報ウィンドウを追加する
次のスニペットでは、テキストのタイトルのみを指定した単純なマーカーが作成されます。 クリックします。
Swift
let position = CLLocationCoordinate2D(latitude: 51.5, longitude: -0.127)
let london = GMSMarker(position: position)
london.title = "London"
london.map = mapView
Objective-C
CLLocationCoordinate2D position = CLLocationCoordinate2DMake(51.5, -0.127);
GMSMarker *london = [GMSMarker markerWithPosition:position];
london.title = @"London";
london.map = mapView;
snippet プロパティを使用すると、表示されるテキストを追加できます。
タイトルの下に小さなフォントで
表示されますスペースの幅より長い文字列は、
情報ウィンドウは数行で自動的に折り返されます。非常に長い
切り捨てられる場合があります。
Swift
london.title = "London"
london.snippet = "Population: 8,174,100"
london.map = mapView
Objective-C
london.title = @"London";
london.snippet = @"Population: 8,174,100";
london.map = mapView;
情報ウィンドウを表示または非表示にする
情報ウィンドウは、マーカーに対するユーザーのタッチイベントに応答するように設計されています。
情報ウィンドウの表示 / 非表示をプログラムで切り替えるには、selectedMarker を設定します。
GMSMapView のプロパティ:
selectedMarkerにマーカーの名前を設定します。- 非表示にするには、
selectedMarkerをnilに設定します。
Swift
london.title = "London"
london.snippet = "Population: 8,174,100"
london.map = mapView
// Show marker
mapView.selectedMarker = london
// Hide marker
mapView.selectedMarker = nil
Objective-C
london.title = @"London";
london.snippet = @"Population: 8,174,100";
london.map = mapView;
// Show marker
mapView.selectedMarker = london;
// Hide marker
mapView.selectedMarker = nil;
情報ウィンドウを自動更新するように設定する
tracksInfoWindowChanges を以下に設定します:
新しいプロパティまたは情報のコンテンツが必要な場合は、YES または true へのマーカー
変更後すぐにウィンドウを表示できるようになり、
情報ウィンドウをクリックして非表示にし、再度表示します。デフォルトは NO または false です。
Swift
london.tracksInfoWindowChanges = true
Objective-C
london.tracksInfoWindowChanges = YES;
ルールを設定するタイミングを決定するには、
tracksInfoWindowChanges プロパティの場合、
パフォーマンスに関する考慮事項と、Google Cloud で提供される
情報ウィンドウが自動的に再描画されます。例:
- 一連の変更を加える場合は、プロパティを
YESに変更できます。NOに戻ります。 - アニメーションが実行されている場合、またはコンテンツが非同期で読み込まれている場合、
アクションが完了するまで、このプロパティを
YESに設定したままにする必要があります。
次の場合は、考慮事項もご覧ください。
マーカーの iconView プロパティを使って作成します。
情報ウィンドウの位置を変更する
情報ウィンドウは、関連付けられているマーカーを中心としてその真上に、デバイス画面の左右に広がるように描画されます。情報ウィンドウの位置は変更できます。
infoWindowAnchor プロパティを設定して、マーカーに対する相対位置を指定できます。この
プロパティは、(x,y) オフセットとして定義される CGPoint を受け入れます。x と y の両方が
値の範囲は 0.0 ～ 1.0 です。デフォルトのオフセットは (0.5, 0.0)、つまり中心点
あります。infoWindowAnchor オフセットを設定すると、情報を揃えるのに役立ちます
カスタムアイコンに対抗します
Swift
london.infoWindowAnchor = CGPoint(x: 0.5, y: 0.5)
london.icon = UIImage(named: "house")
london.map = mapView
Objective-C
london.infoWindowAnchor = CGPointMake(0.5, 0.5);
london.icon = [UIImage imageNamed:@"house"];
london.map = mapView;
情報ウィンドウのイベントを処理する
次の情報ウィンドウ イベントをリッスンできます。
mapView:markerInfoWindow:- マーカーが選択される直前に呼び出されます。 必要に応じて、カスタム情報ウィンドウをUIViewとして返すことができます。 クリックします。詳しくは、後述のカスタム情報ウィンドウをご覧ください。mapView:markerInfoContents:-mapView:markerInfoWindowが nil を返すときに呼び出されます。mapView:didCloseInfoWindowOfMarker:- マーカーの情報ウィンドウが閉じられたときに呼び出されます。mapView:didLongPressInfoWindowOfMarker:- マーカーの情報ウィンドウが長押しされた後で呼び出されます。
イベントをリッスンするには、
GMSMapViewDelegate プロトコル。詳しくは、
イベントのガイドと
GMSMapViewDelegate。
GitHub 情報ウィンドウ イベントの処理方法を示すサンプルが含まれています。
カスタム情報ウィンドウ
情報ウィンドウのコンテンツをカスタマイズするには、
UIView
カスタム情報ウィンドウのレイアウトを定義します。このサブクラスでは、
ビューを定義できます。たとえば、カスタム
UILabel
タイトル、スニペット テキスト、その他のビュー（例:
UIImageView
情報ウィンドウに表示される画像を追加します。
ViewController が
GMSIndoorDisplayDelegate
そのプロトコルのリスナーが定義され、
mapView:markerInfoWindow:
イベントです。このイベント リスナーは、マーカーがマーカーの位置に近づくと呼び出されます。
これにより、カスタム UIView クラスのインスタンスを
マーカーで使用するカスタム情報ウィンドウを定義します。
デフォルトの情報ウィンドウ、カスタマイズされたコンテンツを表示している情報ウィンドウ、フレームと背景がカスタマイズされている情報ウィンドウの画像を以下に示します。
Google Kubernetes Engine 上の GitHub （Maps SDK for iOS に付属） カスタム情報ウィンドウのサンプルを含めることもできます。たとえば、 MarkerInfoWindowViewController.m （Objective-C）または MarkerInfoWindowViewController.swift （Swift）。
ダウンロードと実行については、コードサンプルをご覧ください。 見てみましょう。