使用UWP MapItemsControl的多个DataTemplates

时间:2016-10-11 00:53:26

标签: xaml uwp windows-10-universal uwp-xaml uwp-maps

我在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似乎没有提供指定DataType DataTemplate的方法,MapItemsControl没有设置{DataTemplateSelector的属性{1}}。

有没有人知道如何在MapItemsControl中使用多个数据模板,并根据ItemsSource中的对象类型选择相关的数据模板?

1 个答案:

答案 0 :(得分:5)

MapItemsControl Class没有设置DataTemplateSelector的属性。为了实现您的目标,我们可以通过在ContentControl中将其设置为模板内容,然后使用DataTemplate属性设置ContentControl.ContentTemplateSelector来利用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。如果您有多种对象类型,也可以参考以下答案:How to associate view with viewmodel or multiple DataTemplates for ViewModel?