Информационное окно позволяет отображать информацию пользователю, когда он нажимает на маркер.
Информационное окно рисуется ориентированным на экран устройства и по центру над соответствующим маркером. Информационное окно по умолчанию содержит заголовок, выделенный жирным шрифтом, и текст фрагмента под заголовком.
Содержимое информационного окна определяется свойствами title
и snippet
маркера. Щелчок по маркеру не отображает информационное окно, если свойства title
и snippet
пусты или nil
.
Одновременно отображается только одно информационное окно. Если пользователь нажимает на другой маркер, текущее окно скрывается и открывается новое информационное окно. Если пользователь щелкает маркер, на котором в данный момент отображается информационное окно, это информационное окно закрывается и открывается снова.
Создайте собственное информационное окно, чтобы добавить дополнительный текст или изображения. Пользовательское информационное окно дает вам полный контроль над внешним видом всплывающего окна.
Добавить информационное окно
Следующий фрагмент создает простой маркер, содержащий только заголовок для текста информационного окна.
Быстрый
let position = CLLocationCoordinate2D(latitude: 51.5, longitude: -0.127) let london = GMSMarker(position: position) london.title = "London" london.map = mapView
Цель-C
CLLocationCoordinate2D position = CLLocationCoordinate2DMake(51.5, -0.127); GMSMarker *london = [GMSMarker markerWithPosition:position]; london.title = @"London"; london.map = mapView;
С помощью свойства snippet
вы можете добавить дополнительный текст, который будет отображаться под заголовком более мелким шрифтом. Строки, длина которых превышает ширину информационного окна, автоматически переносятся на несколько строк. Очень длинные сообщения могут быть обрезаны.
Быстрый
london.title = "London" london.snippet = "Population: 8,174,100" london.map = mapView
Цель-C
london.title = @"London"; london.snippet = @"Population: 8,174,100"; london.map = mapView;
Показать/скрыть информационное окно
Информационные окна предназначены для реагирования на события касания пользователем маркера. Вы можете показать или скрыть информационное окно программно, установив свойство selectedMarker
GMSMapView
:
- Задайте
selectedMarker
имя маркера, чтобы его отобразить. - Установите
selectedMarker
значениеnil
, чтобы скрыть его.
Быстрый
london.title = "London" london.snippet = "Population: 8,174,100" london.map = mapView // Show marker mapView.selectedMarker = london // Hide marker mapView.selectedMarker = nil
Цель-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
.
Быстрый
london.tracksInfoWindowChanges = true
Цель-C
london.tracksInfoWindowChanges = YES;
Чтобы решить, когда устанавливать свойство tracksInfoWindowChanges
, вам следует сопоставить соображения производительности с преимуществами автоматической перерисовки информационного окна. Например:
- Если вам нужно внести ряд изменений, вы можете изменить свойство на
YES
, а затем обратно наNO
. - Когда анимация выполняется или содержимое загружается асинхронно, вам следует сохранять для свойства значение
YES
до тех пор, пока действия не будут завершены.
Обратите также внимание на примечания при использовании свойства iconView
маркера.
Изменение положения информационного окна
Информационное окно рисуется ориентированным на экран устройства и по центру над соответствующим маркером. Вы можете изменить положение информационного окна относительно маркера, установив свойство infoWindowAnchor
. Это свойство принимает CGPoint
, определенный как смещение (x,y), где значения x и y находятся в диапазоне от 0,0 до 1,0. Смещение по умолчанию — (0,5, 0,0), то есть по центру вверху. Установка смещения infoWindowAnchor
полезна для выравнивания информационного окна по пользовательскому значку.
Быстрый
london.infoWindowAnchor = CGPoint(x: 0.5, y: 0.5) london.icon = UIImage(named: "house") london.map = mapView
Цель-C
london.infoWindowAnchor = CGPointMake(0.5, 0.5); london.icon = [UIImage imageNamed:@"house"]; london.map = mapView;
Обработка событий в информационных окнах
Вы можете прослушивать следующие события информационного окна:
mapView:markerInfoWindow:
— Вызывается, когда маркер вот-вот станет выбранным. При желании можно вернуть пользовательское информационное окно в видеUIView
для использования в качестве маркера. Дополнительные сведения см. в разделе Пользовательские информационные окна ниже.mapView:markerInfoContents:
— Вызывается, когдаmapView:markerInfoWindow
возвращает ноль.mapView:didCloseInfoWindowOfMarker:
— Вызывается, когда информационное окно маркера закрыто.mapView:didLongPressInfoWindowOfMarker:
— Вызывается после длительного нажатия на информационное окно маркера.
Чтобы прослушивать события, необходимо реализовать протокол GMSMapViewDelegate
. См. руководство по событиям и список методов GMSMapViewDelegate
.
GitHub включает примеры, демонстрирующие обработку событий информационного окна:
Пользовательские информационные окна
Настройте содержимое информационных окон, создав подкласс UIView
, который определяет макет пользовательского информационного окна. В этом подклассе определите представление по своему усмотрению. Например, вы можете использовать пользовательские экземпляры UILabel
для отображения текста заголовка и фрагмента, а также других представлений, таких как экземпляры UIImageView
, для добавления изображений, отображаемых в информационном окне.
Убедитесь, что ваш ViewController
реализует протокол GMSIndoorDisplayDelegate
и определяет прослушиватель события mapView:markerInfoWindow:. Этот прослушиватель событий вызывается, когда маркер собирается стать выбранным, и позволяет вам вернуть экземпляр вашего пользовательского класса UIView
, чтобы определить пользовательское информационное окно, используемое маркером.
На изображениях ниже показано информационное окно по умолчанию, информационное окно с настроенным содержимым и информационное окно с настроенной рамкой и фоном.
![Сравнение информационных окон. Info Window Comparison](https://developers-dot-devsite-v2-prod.appspot.com/static/maps/documentation/images/marker-infowindows.png?authuser=4&hl=ru)
Примеры кода на GitHub , поставляемые с Maps SDK для iOS, включают образцы пользовательских информационных окон. Например, см. определение MarkerInfoWindowViewController.m (Objective-C) или MarkerInfoWindowViewController.swift (Swift).
См. примеры кода для получения информации о загрузке и запуске этих примеров.