UWP TabView ItemTemplateSelector不工作

Question

我有一个带有透视控件的UWP页面，其中ItemTemplateSelector绑定到一个DataTemplateSelector派生类。代码按预期工作，下面是XAML代码片段

<Pivot IsHeaderItemsCarouselEnabled="False" 
ItemsSource ="{x:Bind MainPageViewModel.EditViewModels}"  
ItemTemplateSelector="{StaticResource DetailViewTemplateSelector}"  >
<Pivot.HeaderTemplate>
<DataTemplate >
<TextBlock Text="New Item"/>
</DataTemplate>
</Pivot.HeaderTemplate>
</Pivot>

我有一个资源字典，其中的数据模板定义为：

<DataTemplate x:Key="Tabela_DetailViewModel" >
<detailView:Tabela_View />
</DataTemplate>   

代码按预期工作。当我向项目源添加对象时，将创建新的透视表项，并使用用户控件Tabela_View呈现其内容。

我将透视控件从Microsoft.Toolkit.Uwp.UI.Controls命名空间更改为TabView。更改控件后，当我打开一个新选项卡时，将呈现类型名称，而不是用户控件视图。下面是TabView的XAML：

<muxc:TabView x:Name="Tabs" Grid.Column="1" Grid.Row="0"   
ItemsSource ="{x:Bind MainPageViewModel.EditViewModels}"          
SelectedItem="{x:Bind MainPageViewModel.SelectedEntityViewModel,Mode=TwoWay}"
ItemTemplateSelector="{StaticResource DetailViewTemplateSelector}"    >
<muxc:TabView.ItemHeaderTemplate>
<DataTemplate >
<TextBlock Text="New Item"/>
</DataTemplate>
</muxc:TabView.ItemHeaderTemplate>
</muxc:TabView>

以下是模拟此错误的项目project link的链接。请注意，注释的透视表控件片段按预期工作。

任何帮助都将不胜感激。问候你，赛菲

Answer 1

UWP TabView ItemTemplateSelector不工作

我已经测试了ItemTemplateSelector，它在我这边运行得很好，请参考下面的代码来检查你是否错过了一些关键步骤。

创建数据模型

public class TabItem
{
    public ItemType Type { get; set; }
    public string Header { get; set; }
    public Microsoft.UI.Xaml.Controls.IconSource Icon { get; set; }
}
public enum ItemType { TypeA, TypeB };

创建继承DataTemplateSelector的TabViewItemTemplateSelector类。

public class TabViewItemTemplateSelector : DataTemplateSelector
{
    public DataTemplate TemplateOne { get; set; }
    public DataTemplate TemplateTwo { get; set; }

    protected override DataTemplate SelectTemplateCore(object item)
    {
        var tabItem = (TabItem)item;
        return tabItem.Type == ItemType.TypeA ? TemplateOne : TemplateTwo;
    }
}

Xaml代码

<Page.Resources>
    <local:TabViewItemTemplateSelector
        x:Key="TabViewItemTemplateselector"
        TemplateOne="{StaticResource Templateone}"
        TemplateTwo="{StaticResource Templatetwo}"
        />
    <DataTemplate x:Key="Templateone" x:DataType="local:TabItem">
        <muxc:TabViewItem Header="{x:Bind Header}" IconSource="{x:Bind Icon}" >
            <detailview:Tabela_View/>
        </muxc:TabViewItem>
    </DataTemplate>
    <DataTemplate x:Key="Templatetwo" x:DataType="local:TabItem" >
        <muxc:TabViewItem Header="{x:Bind Header}" IconSource="{x:Bind Icon}" >
            <detailview:NormalPage/>
        </muxc:TabViewItem>
    </DataTemplate>
</Page.Resources>

使用

<muxc:TabView
    x:Name="MyTabView"
    Grid.Row="0"
    Grid.Column="1"
    TabItemTemplateSelector="{StaticResource TabViewItemTemplateselector}"
    />


MyTabView.TabItemsSource = new List<TabItem>() {
    new TabItem(){ Header="One", Icon = new Microsoft.UI.Xaml.Controls.SymbolIconSource(){ Symbol= Symbol.DockBottom},Type=ItemType.TypeA },
     new TabItem(){ Header="Two",  Icon = new Microsoft.UI.Xaml.Controls.SymbolIconSource(){ Symbol= Symbol.Document},Type=ItemType.TypeB },
      new TabItem(){ Header="Three",  Icon = new Microsoft.UI.Xaml.Controls.SymbolIconSource(){ Symbol= Symbol.Accept},Type=ItemType.TypeA }
};