Aracılığıyla paylaş

Xamarin.Forms Harita Raptiyeleri

Denetim, Xamarin.FormsMap konumların nesnelerle Pin işaretlenmesine izin verir. A Pin , dokunulduğunda bir bilgi penceresi açan bir harita işaretçisidir:

iOS ve Android'de harita raptiyesinin ve bilgi penceresinin ekran görüntüsü

Koleksiyona Map.Pins bir Pin nesne eklendiğinde, raptiye haritada işlenir.

Pin sınıfı aşağıdaki özelliklere sahiptir:

  • Address, türündedir stringve genellikle pin konumunun adresini temsil eder. Ancak, yalnızca bir adres değil, herhangi string bir içerik olabilir.
  • Label, türündedir stringve genellikle raptiye başlığını temsil eder.
  • Position, türündedir Positionve pinin enlemini ve boylamını temsil eder.
  • Type, pin PinTypetürünü temsil eder.

Bu özellikler nesneler tarafından BindableProperty desteklenir; bu da veri Pin bağlamalarının hedefi olabileceği anlamına gelir. Veri bağlama Pin nesneleri hakkında daha fazla bilgi için bkz . Pin koleksiyonunu görüntüleme.

Ayrıca sınıfı Pin ve InfoWindowClicked olaylarını tanımlarMarkerClicked. Bir MarkerClicked raptiyeye dokunulduğunda InfoWindowClicked olay tetiklenir ve bilgi penceresine dokunulduğunda olay tetiklenir. Her PinClickedEventArgs iki olaya da eşlik eden nesnenin türünde booltek HideInfoWindow bir özelliği vardır.

Raptiye görüntüleme

A Pin , XAML'de öğesine Map eklenebilir:

<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>

Bu XAML, nesnesi tarafından MapSpan belirtilen bölgeyi gösteren bir Map nesne oluşturur. MapSpan Nesne, 0,01 enlem ve boylam derecesini genişleten bir Position nesne tarafından temsil edilen enlem ve boylam üzerinde ortalanır. Bir Pin nesne koleksiyona Map.Pins eklenir ve özelliği tarafından Position belirtilen konumda üzerine Map çizilir. Yapı hakkında Position bilgi için bkz . Harita Konumu ve Uzaklığı. XAML'deki bağımsız değişkenleri varsayılan oluşturucuları olmayan nesnelere geçirme hakkında bilgi için bkz . XAML'de Bağımsız Değişkenleri Geçirme.

Eşdeğer C# kodu:

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);

Uyarı

özelliği ayarlanamaması Pin.Label , öğesine eklendiğinde bir ArgumentException atılmasıyla Pin Mapsonuçlanır.

Bu örnek kod, haritada tek bir pinin işlenmesine neden olur:

iOS ve Android'de harita raptiyesinin ekran görüntüsü

Raptiye ile etkileşim kurma

Varsayılan olarak, bir Pin öğesine dokunulduğunda bilgi penceresi görüntülenir:

iOS ve Android'de harita raptiyesinin ve bilgi penceresinin ekran görüntüsü

Haritada başka bir yere dokunulduğunda bilgi penceresi kapatılabilir.

sınıfı Pin , bir öğesine dokunulduğunda tetiklenen bir MarkerClicked Pin olay tanımlar. Bilgi penceresini görüntülemek için bu olayı işlemek gerekli değildir. Bunun yerine, belirli bir raptiyeye dokunulduğuna dair bildirim alınması gereken bir gereksinim olduğunda bu olay işlenmelidir.

sınıfı, Pin bir InfoWindowClicked bilgi penceresine dokunulduğunda tetiklenen bir olayı da tanımlar. Belirli bir bilgi penceresine dokunulduğuna dair bildirim alınması gereken bir gereksinim olduğunda bu olay işlenmelidir.

Aşağıdaki kodda bu olayları işleme örneği gösterilmektedir:

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");
};

Her PinClickedEventArgs iki olaya da eşlik eden nesnenin türünde booltek HideInfoWindow bir özelliği vardır. Bu özellik bir olay işleyicisi içinde olarak ayarlandığında true , bilgi penceresi gizlenir.

Sabitleme türleri

Pinnesneleri, pin türünü PinTypetemsil eden türünde bir Type özellik içerir. Numaralandırma PinType aşağıdaki üyeleri tanımlar:

  • Generic, genel bir raptiyeyi temsil eder.
  • Place, bir yer için raptiyeyi temsil eder.
  • SavedPin, kaydedilmiş bir konumun raptiyesini temsil eder.
  • SearchResult, bir arama sonucu için raptiyeyi temsil eder.

Ancak, özelliğin herhangi bir PinType üyeye ayarlanmasıPin.Type, işlenen pinin görünümünü değiştirmez. Bunun yerine, pin görünümünü özelleştirmek için özel bir işleyici oluşturmanız gerekir. Daha fazla bilgi için bkz . Harita raptiyesini özelleştirme.

Raptiye koleksiyonunu görüntüleme

Map sınıfı aşağıdaki özellikleri tanımlar:

Önemli

ItemTemplate hem hem ItemTemplateSelector de ItemTemplate özellikleri ayarlandığında özelliği önceliklidir.

birMap, özelliğini bir IEnumerable koleksiyona bağlamak ItemsSource için veri bağlama kullanılarak pinlerle doldurulabilir:

<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>

Özellik ItemsSource verileri, özel bir tür olan nesnelerden birini ObservableCollection döndüren bağlı görünüm modelinin Location özelliğine bağlanırLocations. Her Location nesne, türü stringve türünde bir Position özellik Positionolan ve Description özelliklerini tanımlarAddress.

Koleksiyondaki IEnumerable her öğenin görünümü, özelliği, verilerin uygun özelliklere DataTemplate bağlandığı bir nesne içeren bir Pin olarak ayarlanarak ItemTemplate tanımlanır.

Aşağıdaki ekran görüntüleri, veri bağlama kullanarak bir Pin koleksiyonun görüntülendiğini gösterirMap:

iOS ve Android'de veri sınırı pinleri içeren haritanın ekran görüntüsü

Çalışma zamanında öğe görünümünü seçme

Özelliği olarak DataTemplateSelectorayarlanarakItemTemplateSelector, koleksiyondaki IEnumerable her öğenin görünümü çalışma zamanında öğe değerine göre seçilebilir:

<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>

Aşağıdaki örnekte sınıfı gösterilmektedir MapItemTemplateSelector :

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;
    }
}

MapItemTemplateSelector sınıfı, farklı veri şablonlarına ayarlanmış ve XamarinTemplate DataTemplate özelliklerini tanımlarDefaultTemplate. OnSelectTemplate yöntemi, öğenin "San Francisco" içeren bir adresi olduğunda, öğesine dokunulduğunda Pin etiket olarak "Xamarin" görüntüleyen değerini döndürürXamarinTemplate. Öğenin "San Francisco" içeren bir adresi olmadığında, OnSelectTemplate yöntemi döndürür DefaultTemplate.

Not

Bu işlevin kullanım örneği, alt sınıflandırılmış Pin nesnelerin özelliklerini alt türe göre farklı özelliklere Pin bağlamaktır.

Veri şablonu seçicileri hakkında daha fazla bilgi için bkz. DataTemplateSelector OluşturmaXamarin.Forms.

  • Last updated on