Поделиться через


Xamarin.Forms Элемент управления картами

Элемент Map управления — это кроссплатформенное представление для отображения и аннотирования карт. Он использует собственный элемент управления картой для каждой платформы, предоставляя быстрый и знакомый интерфейс карт для пользователей:

Снимок экрана: элемент управления картой в iOS и Android

Класс Map определяет следующие свойства, управляющие внешним видом и поведением карты:

  • IsShowingUserboolТип , указывает, отображает ли карта текущее расположение пользователя.
  • ItemsSourceтип IEnumerable, который указывает коллекцию отображаемых IEnumerable элементов.
  • ItemTemplateТип DataTemplate, который указывает DataTemplate , что применяется к каждому элементу в коллекции отображаемых элементов.
  • ItemTemplateSelectorтип DataTemplateSelector, который указывает DataTemplateSelector , что будет использоваться для выбора DataTemplate элемента во время выполнения.
  • HasScrollEnabledboolТип , определяет, разрешено ли прокручивать карту.
  • HasZoomEnabledboolТип , определяет, разрешено ли масштабирование карты.
  • MapElementsIList<MapElement>Тип , представляет список элементов на карте, таких как многоугольники и многолинейные линии.
  • MapTypeMapTypeТип , указывает стиль отображения карты.
  • MoveToLastRegionOnLayoutChangeboolТип , определяет, будет ли отображаемая область карты перемещаться из текущего региона в ранее заданный регион при изменении макета.
  • PinsIList<Pin>Тип , представляет список закреплений на карте.
  • TrafficEnabledboolТип , указывает, наложены ли данные трафика на карту.
  • VisibleRegion, типа MapSpan, возвращает отображаемую в данный момент область карты.

Эти свойства, за исключением MapElementsсвойств и PinsVisibleRegion свойств, поддерживаются объектами, что означает, что они могут быть целевыми BindableProperty объектами привязки данных.

Класс Map также определяет MapClicked событие, которое запускается при нажатии карты. Объект MapClickedEventArgs , который сопровождает событие, имеет одно свойство с именем Positionтипа Position. Когда событие запускается, Position свойство задается в расположении карты, которое было касалось. Сведения о структуре см. в Position разделе "Положение карты" и "Расстояние".

Сведения о свойствах ItemTemplateи свойствах см. в ItemsSourceразделе "Отображение коллекции закрепленияItemTemplateSelector".

Отображение карты

Его Map можно отобразить, добавив его в макет или страницу:

<ContentPage ...
             xmlns:maps="clr-namespace:Xamarin.Forms.Maps;assembly=Xamarin.Forms.Maps">
    <maps:Map x:Name="map" />
</ContentPage>

Примечание.

Для ссылки на объект Xamarin.Formsтребуется дополнительное xmlns определение пространства имен. Элементы управления Maps. В предыдущем примере Xamarin.Forms.Maps пространство имен ссылается через maps ключевое слово.

Эквивалентный код на C# выглядит так:

using Xamarin.Forms;
using Xamarin.Forms.Maps;

namespace WorkingWithMaps
{
    public class MapTypesPageCode : ContentPage
    {
        public MapTypesPageCode()
        {
            Map map = new Map();
            Content = map;
        }
    }
}

В этом примере вызывается конструктор по умолчанию Map , который центрирует карту в Риме:

Снимок экрана: элемент управления картой с расположением по умолчанию в iOS и Android

Кроме того, MapSpan аргумент можно передать Map конструктору, чтобы задать центральную точку и уровень масштабирования карты при загрузке. Дополнительные сведения см. в разделе "Отображение определенного расположения на карте".

Типы карт

Свойство Map.MapType можно задать MapType для элемента перечисления, чтобы определить стиль отображения карты. Перечисление MapType определяет следующие члены:

  • Street указывает, что будет отображаться карта улиц.
  • Satellite указывает, что будет отображаться карта, содержащая спутниковые изображения.
  • Hybrid указывает, что будет отображаться карта, объединяющая уличные и спутниковые данные.

По умолчанию будет Map отображаться карта улиц, если MapType свойство не определено. Кроме того, MapType свойство можно задать для одного из MapType элементов перечисления:

<maps:Map MapType="Satellite" />

Эквивалентный код на C# выглядит так:

Map map = new Map
{
    MapType = MapType.Satellite
};

На следующих снимках экрана показано Map , когда MapType для свойства задано значение Street:

Снимок экрана: элемент управления картой с типом карты улицы в iOS и Android

На следующих снимках экрана показано Map , когда MapType для свойства задано значение Satellite:

Снимок экрана: элемент управления картой с типом вспомогательной карты в iOS и Android

На следующих снимках экрана показано Map , когда MapType для свойства задано значение Hybrid:

Снимок экрана: элемент управления картой с типом гибридной карты в iOS и Android

Отображение определенного расположения на карте

Область карты, отображаемой при загрузке карты, может быть задана путем передачи аргумента MapSpan конструктору Map :

<maps:Map>
    <x:Arguments>
        <maps:MapSpan>
            <x:Arguments>
                <maps:Position>
                    <x:Arguments>
                        <x:Double>36.9628066</x:Double>
                        <x:Double>-122.0194722</x:Double>
                    </x:Arguments>
                </maps:Position>
                <x:Double>0.01</x:Double>
                <x:Double>0.01</x:Double>
            </x:Arguments>
        </maps:MapSpan>
    </x:Arguments>
</maps:Map>

Эквивалентный код на C# выглядит так:

Position position = new Position(36.9628066, -122.0194722);
MapSpan mapSpan = new MapSpan(position, 0.01, 0.01);
Map map = new Map(mapSpan);

В этом примере создается объект, показывающий Map регион, заданный MapSpan объектом. Объект MapSpan сосредоточен на широте и долготе, представленной Position объектом, и охватывает 0,01 широты и 0,01 градуса долготы. Сведения о структуре см. в Position разделе "Положение карты" и "Расстояние". Сведения о передаче аргументов в XAML см. в разделе "Передача аргументов" в XAML.

Результатом является то, что при отображении карты он сосредоточен на определенном расположении и охватывает определенное количество широт и долгот:

Снимок экрана: элемент управления картой с указанным расположением в iOS и Android

Создание объекта MapSpan

Существует ряд подходов к созданию MapSpan объектов. Распространенный подход — предоставление необходимых аргументов конструктору MapSpan . Это широта и долгота, представленные Position объектом, и double значения, представляющие градусы широты и долготы, охватываемые объектом MapSpan. Сведения о структуре см. в Position разделе "Положение карты" и "Расстояние".

Кроме того, в MapSpan классе есть три метода, возвращающие новые MapSpan объекты:

  1. ClampLatitude возвращает объект MapSpan с таким же LongitudeDegrees , как экземпляр класса метода, и радиус, определенный его north и south аргументами.
  2. FromCenterAndRadius возвращает объект, определенный MapSpan его Position и Distance аргументами.
  3. WithZoomMapSpan возвращает значение с тем же центром, что и экземпляр класса метода, но с радиусом, умноженным на его double аргумент.

Сведения о структуре см. в Distance разделе "Положение карты" и "Расстояние".

MapSpan После создания можно получить доступ к следующим свойствам, чтобы получить данные об этом:

  • Center, который представляет Position в географическом центре MapSpanобъекта .
  • LatitudeDegrees, представляющий градусы широты, охватываемые диапазоном MapSpan.
  • LongitudeDegrees, представляющий градусы долготы, охватываемые MapSpan.
  • Radius, представляющий MapSpan радиус.

Перемещение карты

Метод Map.MoveToRegion можно вызвать для изменения положения и масштаба карты. Этот метод принимает аргумент, определяющий MapSpan область отображения карты и его уровень масштабирования.

В следующем коде показан пример перемещения отображаемой области на карте:

MapSpan mapSpan = MapSpan.FromCenterAndRadius(position, Distance.FromKilometers(0.444));
map.MoveToRegion(mapSpan);

Изменение масштаба карты

Уровень масштабирования Map можно изменить, не изменяя его расположение. Это можно сделать с помощью пользовательского интерфейса карты или программно путем вызова MoveToRegion метода с аргументом MapSpan , который использует текущее расположение в качестве аргумента Position :

double zoomLevel = 0.5;
double latlongDegrees = 360 / (Math.Pow(2, zoomLevel));
if (map.VisibleRegion != null)
{
    map.MoveToRegion(new MapSpan(map.VisibleRegion.Center, latlongDegrees, latlongDegrees));
}

В этом примере MoveToRegion метод вызывается с аргументом MapSpan , указывающим текущее расположение карты, через Map.VisibleRegion свойство и уровень масштабирования в виде градусов широты и долготы. Общий результат заключается в том, что уровень масштабирования карты изменяется, но его расположение не является. Альтернативный подход к реализации масштабирования на карте — использовать MapSpan.WithZoom метод для управления коэффициентом масштабирования.

Внимание

Масштабирование карты( независимо от того, используется ли пользовательский интерфейс карты или программатично), требует, чтобы Map.HasZoomEnabled свойство было true. Дополнительные сведения об этом свойстве см. в разделе "Отключить масштабирование".

Настройка поведения карты

Поведение объекта Map можно настроить, задав некоторые его свойства и обрабатывая MapClicked событие.

Примечание.

Можно добиться дополнительной настройки поведения карты, создав пользовательский отрисовщик карты. Дополнительные сведения см. в разделе " Xamarin.Forms Настройка карты".

Отображение данных о движении транспорта

Класс Map определяет TrafficEnabled свойство типа bool. По умолчанию это свойство означает false, что данные трафика не будут наложены на карту. Если для этого свойства задано trueзначение, данные трафика накладываются на карту. В следующем примере показано задание этого свойства:

<maps:Map TrafficEnabled="true" />

Эквивалентный код на C# выглядит так:

Map map = new Map
{
    TrafficEnabled = true
};

Отключение прокрутки

Класс Map определяет HasScrollEnabled свойство типа bool. По умолчанию это свойство имеет значение true, указывающее, что карта разрешена прокрутке. Если для этого свойства задано falseзначение, карта не будет прокручиваться. В следующем примере показано задание этого свойства:

<maps:Map HasScrollEnabled="false" />

Эквивалентный код на C# выглядит так:

Map map = new Map
{
    HasScrollEnabled = false
};

Отключение масштабирования

Класс Map определяет HasZoomEnabled свойство типа bool. По умолчанию это свойство указывает true, что масштабирование можно выполнить на карте. Если для этого свойства задано falseзначение, карта не может быть увеличена. В следующем примере показано задание этого свойства:

<maps:Map HasZoomEnabled="false" />

Эквивалентный код на C# выглядит так:

Map map = new Map
{
    HasZoomEnabled = false
};

Отображение расположения пользователя

Класс Map определяет IsShowingUser свойство типа bool. По умолчанию это свойство указывает false, что карта не отображает текущее расположение пользователя. Если для этого свойства задано trueзначение, карта отображает текущее расположение пользователя. В следующем примере показано задание этого свойства:

<maps:Map IsShowingUser="true" />

Эквивалентный код на C# выглядит так:

Map map = new Map
{
    IsShowingUser = true
};

Внимание

В iOS, Android и универсальная платформа Windows доступ к расположению пользователя требует предоставления приложению разрешений на расположение. Дополнительные сведения см. в разделе "Конфигурация платформы".

Обслуживание области карты при изменении макета

Класс Map определяет MoveToLastRegionOnLayoutChange свойство типа bool. По умолчанию это свойство означает true, что отображаемая область карты перемещается из текущего региона в его ранее заданный регион при изменении макета, например при смене устройства. Если для этого свойства задано falseзначение, отображаемая область карты останется в центре при изменении макета. В следующем примере показано задание этого свойства:

<maps:Map MoveToLastRegionOnLayoutChange="false" />

Эквивалентный код на C# выглядит так:

Map map = new Map
{
    MoveToLastRegionOnLayoutChange = false
};

Щелчки карты

Класс Map определяет MapClicked событие, которое запускается при нажатии карты. Объект MapClickedEventArgs , который сопровождает событие, имеет одно свойство с именем Positionтипа Position. Когда событие запускается, Position свойство задается в расположении карты, которое было касалось. Сведения о структуре см. в Position разделе "Положение карты" и "Расстояние".

В следующем примере кода показан обработчик событий для MapClicked события:

void OnMapClicked(object sender, MapClickedEventArgs e)
{
    System.Diagnostics.Debug.WriteLine($"MapClick: {e.Position.Latitude}, {e.Position.Longitude}");
}

В этом примере OnMapClicked обработчик событий выводит широту и долготу, представляющую расположение сопоставленной карты. Обработчик событий можно зарегистрировать в MapClicked событии следующим образом:

<maps:Map MapClicked="OnMapClicked" />

Эквивалентный код на C# выглядит так:

Map map = new Map();
map.MapClicked += OnMapClicked;