使用 UWP MapItemsControl 的多个数据模板

Question

我在 UWP 中有一个 MapControl：

<maps:MapControl x:Name="BikeMap" ZoomLevel="17" Center="{Binding CenterPoint, Mode=TwoWay}">
    <maps:MapItemsControl x:Name="MapItems" ItemsSource="{Binding BikePoints}"
                        ItemTemplate="{StaticResource BikePointTemplate}"/>
</maps:MapControl>

并且正在使用 XAML 数据模板添加 MapElements，我的 ItemsSource 是一个简单对象列表。

但是，UWP 似乎没有提供一种方法来指定 DataTemplate 的 DataType 并且 MapItemsControl 没有用于设置的属性 DataTemplateSelector.

有谁知道如何将多个数据模板与 MapItemsControl 一起使用，并根据 ItemsSource 中的对象类型选择相关数据模板？

Answer 1

MapItemsControl Class does not have a property for setting DataTemplateSelector. To achieve what you want, we can take advantage of ContentControl by setting it as the template content in DataTemplate and then using ContentControl.ContentTemplateSelector property to set DataTemplateSelector。

以下是一个简单示例：

XAML:

<Page x:Class="UWPApp.MainPage"
      xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
      xmlns:Maps="using:Windows.UI.Xaml.Controls.Maps"
      xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
      xmlns:local="using:UWPApp"
      xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
      mc:Ignorable="d">
    <Page.Resources>
        <DataTemplate x:Key="GreenDataTemplate">
            <StackPanel Background="Green">
                <TextBlock Margin="5"
                           Maps:MapControl.Location="{Binding Location}"
                           Maps:MapControl.NormalizedAnchorPoint="0.5,0.5"
                           FontSize="20"
                           Text="{Binding Name}" />
            </StackPanel>
        </DataTemplate>
        <DataTemplate x:Key="RedDataTemplate">
            <StackPanel Background="Red">
                <TextBlock Margin="5"
                           Maps:MapControl.Location="{Binding Location}"
                           Maps:MapControl.NormalizedAnchorPoint="0.5,0.5"
                           FontSize="20"
                           Text="{Binding Name}" />
            </StackPanel>
        </DataTemplate>

        <local:MyTemplateSelector x:Key="MyTemplateSelector" GreenTemplate="{StaticResource GreenDataTemplate}" RedTemplate="{StaticResource RedDataTemplate}" />
    </Page.Resources>
    <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
        <Maps:MapControl x:Name="MyMap" MapServiceToken="MapServiceToken">
            <Maps:MapItemsControl x:Name="MyMapItemsControl" ItemsSource="{Binding}">
                <Maps:MapItemsControl.ItemTemplate>
                    <DataTemplate>
                        <ContentControl Content="{Binding}" ContentTemplateSelector="{StaticResource MyTemplateSelector}" />
                    </DataTemplate>
                </Maps:MapItemsControl.ItemTemplate>
            </Maps:MapItemsControl>
        </Maps:MapControl>
    </Grid>
</Page>

代码隐藏：

public class MyTemplateSelector : DataTemplateSelector
{
    public DataTemplate GreenTemplate { get; set; }
    public DataTemplate RedTemplate { get; set; }

    protected override DataTemplate SelectTemplateCore(object item, DependencyObject container)
    {
        if (item != null)
        {
            if (item is GreenPOI)
            {
                return GreenTemplate;
            }

            return RedTemplate;
        }

        return null;
    }
}

public class POI
{
    public string Name { get; set; }

    public Geopoint Location { get; set; }
}

public class GreenPOI : POI { }

public class RedPOI : POI { }

这只是举例。在示例中，我使用了两个具有不同背景的数据模板，并创建了一个自定义 DataTemplateSelector，可以根据对象类型选择 DataTemplate。而如果你有几种对象类型，你也可以参考这个答案：

使用 UWP MapItemsControl 的多个数据模板

Multiple DataTemplates with UWP MapItemsControl

xaml

uwp

windows-10-universal

uwp-xaml

uwp-maps