Xamarin.Forms Špendlíky mapy

Článek
10/23/2019

Ovládací Xamarin.FormsMap prvek umožňuje, aby umístění byla označena Pin objekty. A Pin je značka mapy, která po klepnutí otevře informační okno:

Pin Při přidání objektu Map.Pins do kolekce se špendlík vykreslí na mapě.

Třída Pin má následující vlastnosti:

Address, typu string, který obvykle představuje adresu pro umístění připnutí. Může to ale být jakýkoli string obsah, nejen adresa.
Label, typu string, který obvykle představuje název špendlíku.
Position, typu Position, který představuje zeměpisnou šířku a délku špendlíku.
Type, typu PinType, který představuje typ špendlíku.

Tyto vlastnosti jsou podporovány BindableProperty objekty, což znamená Pin , že může být cílem datových vazeb. Další informace o objektech datové vazby Pin naleznete v tématu Zobrazení kolekce připnutí.

Kromě toho Pin třída definuje MarkerClicked a InfoWindowClicked události. Událost MarkerClicked se aktivuje při klepnutí na špendlík a InfoWindowClicked událost se aktivuje, když se klepne na informační okno. Objekt PinClickedEventArgs , který doprovází obě události, má jednu HideInfoWindow vlastnost typu bool.

Zobrazení špendlíku

Do xaml je možné přidat Map APin:

<ContentPage ...
             xmlns:maps="clr-namespace:Xamarin.Forms.Maps;assembly=Xamarin.Forms.Maps">
     <maps:Map x:Name="map"
               IsShowingUser="True"
               MoveToLastRegionOnLayoutChange="False">
         <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.Pins>
             <maps:Pin Label="Santa Cruz"
                       Address="The city with a boardwalk"
                       Type="Place">
                 <maps:Pin.Position>
                     <maps:Position>
                         <x:Arguments>
                             <x:Double>36.9628066</x:Double>
                             <x:Double>-122.0194722</x:Double>
                         </x:Arguments>
                     </maps:Position>
                 </maps:Pin.Position>
             </maps:Pin>
         </maps:Map.Pins>
     </maps:Map>
</ContentPage>

Tento XAML vytvoří Map objekt, který zobrazuje oblast určenou objektem MapSpan . Objekt MapSpan je zacentrován na zeměpisnou šířku a délku Position reprezentovanou objektem, který rozšiřuje 0,01 stupňů zeměpisné šířky a délky. Objekt Pin se přidá do Map.Pins kolekce a nakreslený na Map místě určeném jeho Position vlastností. Informace o struktuře Position naleznete v tématu Umístění a vzdálenost mapy. Informace o předávání argumentů v XAML objektům, které nemají výchozí konstruktory, naleznete v tématu Předávání argumentů v XAML.

Ekvivalentní kód jazyka C# je:

using Xamarin.Forms.Maps;
// ...
Map map = new Map
{
  // ...
};
Pin pin = new Pin
{
  Label = "Santa Cruz",
  Address = "The city with a boardwalk",
  Type = PinType.Place,
  Position = new Position(36.9628066, -122.0194722)
};
map.Pins.Add(pin);

Upozorňující

Při nastavení Pin.Label vlastnosti dojde ArgumentException k vyvolání při Pin přidání do objektu Map.

Výsledkem tohoto ukázkového kódu je vykreslení jednoho špendlíku na mapě:

Interakce s špendlíkem

Ve výchozím nastavení se Pin při klepnutí na okno s informacemi zobrazí:

Klepnutím na jiné místo na mapě zavřete okno s informacemi.

Třída Pin definuje MarkerClicked událost, která se aktivuje při Pin klepnutí. K zobrazení informačního okna není nutné zpracovat tuto událost. Místo toho by se tato událost měla zpracovat, když je potřeba upozornit, že došlo k klepnutí na konkrétní špendlík.

Třída Pin také definuje InfoWindowClicked událost, která se aktivuje při klepnutí na informační okno. Tato událost by se měla zpracovat, když je potřeba upozornit, že došlo k klepnutí na konkrétní okno s informacemi.

Následující kód ukazuje příklad zpracování těchto událostí:

using Xamarin.Forms.Maps;
// ...
Pin boardwalkPin = new Pin
{
    Position = new Position(36.9641949, -122.0177232),
    Label = "Boardwalk",
    Address = "Santa Cruz",
    Type = PinType.Place
};
boardwalkPin.MarkerClicked += async (s, args) =>
{
    args.HideInfoWindow = true;
    string pinName = ((Pin)s).Label;
    await DisplayAlert("Pin Clicked", $"{pinName} was clicked.", "Ok");
};

Pin wharfPin = new Pin
{
    Position = new Position(36.9571571, -122.0173544),
    Label = "Wharf",
    Address = "Santa Cruz",
    Type = PinType.Place
};
wharfPin.InfoWindowClicked += async (s, args) =>
{
    string pinName = ((Pin)s).Label;
    await DisplayAlert("Info Window Clicked", $"The info window was clicked for {pinName}.", "Ok");
};

Objekt PinClickedEventArgs , který doprovází obě události, má jednu HideInfoWindow vlastnost typu bool. Pokud je tato vlastnost nastavena uvnitř true obslužné rutiny události, informační okno bude skryto.

Typy připnutí

Pin objekty zahrnují Type vlastnost typu PinType, která představuje typ špendlíku. Výčet PinType definuje následující členy:

Genericpředstavuje obecný špendlík.
Placepředstavuje špendlík pro místo.
SavedPinpředstavuje špendlík pro uložené umístění.
SearchResultpředstavuje špendlík pro výsledek hledání.

Nastavení Pin.Type vlastnosti na libovolný PinType člen však nezmění vzhled vykresleného špendlíku. Místo toho musíte vytvořit vlastní renderer pro přizpůsobení vzhledu připnutí. Další informace naleznete v tématu Přizpůsobení špendlíku mapy.

Zobrazení kolekce špendlíků

Třída Map definuje následující vlastnosti:

ItemsSource, typu IEnumerable, který určuje kolekci IEnumerable položek, které se mají zobrazit.
ItemTemplate, typu DataTemplate, který určuje DataTemplate , že se má použít pro každou položku v kolekci zobrazených položek.
ItemTemplateSelector, typu DataTemplateSelector, který určuje DataTemplateSelector , že se použije k výběru DataTemplate položky za běhu.

Důležité

Vlastnost ItemTemplate má přednost, když jsou nastaveny ItemTemplate obě vlastnosti ItemTemplateSelector .

Hodnotu A Map lze naplnit špendlíky pomocí datové vazby k vytvoření vazby jeho ItemsSource vlastnosti k kolekci IEnumerable :

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:maps="clr-namespace:Xamarin.Forms.Maps;assembly=Xamarin.Forms.Maps"
             x:Class="WorkingWithMaps.PinItemsSourcePage">
    <Grid>
        ...
        <maps:Map x:Name="map"
                  ItemsSource="{Binding Locations}">
            <maps:Map.ItemTemplate>
                <DataTemplate>
                    <maps:Pin Position="{Binding Position}"
                              Address="{Binding Address}"
                              Label="{Binding Description}" />
                </DataTemplate>
            </maps:Map.ItemTemplate>
        </maps:Map>
        ...
    </Grid>
</ContentPage>

ItemsSource Data vlastnosti se sváže s Locations vlastností propojeného modelu viewmodel, který vrací ObservableCollection objektyLocation, což je vlastní typ. Každý Location objekt definuje Address a Description vlastnosti typu stringa Position vlastnost typu Position.

Vzhled každé položky v kolekci IEnumerable je definován nastavením ItemTemplate vlastnosti na DataTemplate objekt, který obsahuje Pin objekt, který data svázají s příslušnými vlastnostmi.

Následující snímky obrazovky znázorňují Map Pin kolekci pomocí datové vazby:

Volba vzhledu položky za běhu

Vzhled každé položky v IEnumerable kolekci lze vybrat za běhu na základě hodnoty položky nastavením ItemTemplateSelector vlastnosti na DataTemplateSelector:

<ContentPage ...
             xmlns:local="clr-namespace:WorkingWithMaps"
             xmlns:maps="clr-namespace:Xamarin.Forms.Maps;assembly=Xamarin.Forms.Maps">
    <ContentPage.Resources>
        <local:MapItemTemplateSelector x:Key="MapItemTemplateSelector">
            <local:MapItemTemplateSelector.DefaultTemplate>
                <DataTemplate>
                    <maps:Pin Position="{Binding Position}"
                              Address="{Binding Address}"
                              Label="{Binding Description}" />
                </DataTemplate>
            </local:MapItemTemplateSelector.DefaultTemplate>
            <local:MapItemTemplateSelector.XamarinTemplate>
                <DataTemplate>
                    <!-- Change the property values, or the properties that are bound to. -->
                    <maps:Pin Position="{Binding Position}"
                              Address="{Binding Address}"
                              Label="Xamarin!" />
                </DataTemplate>
            </local:MapItemTemplateSelector.XamarinTemplate>    
        </local:MapItemTemplateSelector>
    </ContentPage.Resources>

    <Grid>
        ...
        <maps:Map x:Name="map"
                  ItemsSource="{Binding Locations}"
                  ItemTemplateSelector="{StaticResource MapItemTemplateSelector}" />
        ...
    </Grid>
</ContentPage>

Následující příklad ukazuje MapItemTemplateSelector třídu:

public class MapItemTemplateSelector : DataTemplateSelector
{
    public DataTemplate DefaultTemplate { get; set; }
    public DataTemplate XamarinTemplate { get; set; }

    protected override DataTemplate OnSelectTemplate(object item, BindableObject container)
    {
        return ((Location)item).Address.Contains("San Francisco") ? XamarinTemplate : DefaultTemplate;
    }
}

Třída MapItemTemplateSelector definuje a XamarinTemplate DataTemplate vlastnosti, které jsou nastaveny DefaultTemplate na různé šablony dat. Metoda OnSelectTemplate vrátí XamarinTemplate, který zobrazí "Xamarin" jako popisek při Pin klepnutí, když položka má adresu, která obsahuje "San Francisco". Pokud položka nemá adresu, která obsahuje "San Francisco", OnSelectTemplate metoda vrátí DefaultTemplatehodnotu .

Poznámka:

Případ použití pro tuto funkci je vazby vlastností podtříděných Pin objektů na různé vlastnosti založené na podtypu Pin .

Další informace o selektorech šablon dat naleznete v tématu Vytvoření objektu Xamarin.Forms DataTemplateSelector.

Sdílet prostřednictvím

Xamarin.Forms Špendlíky mapy

Zobrazení špendlíku

Interakce s špendlíkem

Typy připnutí

Zobrazení kolekce špendlíků

Volba vzhledu položky za běhu

Další materiály

Sdílet prostřednictvím

Xamarin.Forms Špendlíky mapy

Zobrazení špendlíku

Interakce s špendlíkem

Typy připnutí

Zobrazení kolekce špendlíků

Volba vzhledu položky za běhu

Související odkazy

Další materiály