Xamarin.Forms DataTemplateSelector 不适用于 CollectionView 中的 HeaderTemplate

Question

我已经为我的 Collectionviews Header 声明了一些 Datatemplates 以用作模板。

    <ResourceDictionary>
      <!--#region HeaderTemplates-->
      <DataTemplate x:Key="translationHeaderTemplate">
        <Frame x:Name="translationDropTarget" Margin="5">
          <Label Style="{x:StaticResource boldLabelStyle}" Text="{Binding SolutionDisplay}" FontSize="Medium" HorizontalOptions="Center" HeightRequest="50" VerticalOptions="Center" x:Name="FrameLabel"></Label>
          <Frame.GestureRecognizers>
            <DropGestureRecognizer AllowDrop="True" DropCommand="{Binding DropOverCommand}">
            </DropGestureRecognizer>
          </Frame.GestureRecognizers>
        </Frame>
      </DataTemplate>
      <DataTemplate x:Key="pictureHeaderTemplate">
        <Frame x:Name="pictureDropTarget" Margin="5">
          <Image Source="{Binding SolutionIconString}" HorizontalOptions="FillAndExpand" MinimumWidthRequest="50" HeightRequest="100" VerticalOptions="CenterAndExpand" x:Name="FrameImage"></Image>
          <Frame.GestureRecognizers>
            <DropGestureRecognizer AllowDrop="True" DropCommand="{Binding DropOverCommand}">
            </DropGestureRecognizer>
          </Frame.GestureRecognizers>
        </Frame>
      </DataTemplate>
      <DataTemplate x:Key="ttsHeaderTemplate">
        <Frame x:Name="ttsDropTarget" Margin="5">
          <forms:AnimationView x:Name="XAnim" AutoPlay="true" VerticalOptions="CenterAndExpand" RepeatMode="Infinite" HorizontalOptions="CenterAndExpand" Animation="soundIcon.json"
                               Clicked="XAnim_Clicked" ></forms:AnimationView>
          <Frame.GestureRecognizers>
            <DropGestureRecognizer AllowDrop="True" DropCommand="{Binding DropOverCommand}">
            </DropGestureRecognizer>
          </Frame.GestureRecognizers>
        </Frame>
      </DataTemplate>
      <!--#endregion-->
      <DataTemplate x:Key="translationTemplate">
        <Frame HasShadow="True" CornerRadius="15" VerticalOptions="Start" HeightRequest="70">
          <StackLayout>
            <Label
                  Text="{Binding DisplayString}"
                  Style="{x:StaticResource mediumlabelStyle}"
                  VerticalOptions="CenterAndExpand"
                    HorizontalOptions="Center"
                  FontSize="Small">
            </Label>
          </StackLayout>
          <Frame.GestureRecognizers>
            <DragGestureRecognizer
                    DragStartingCommand="{Binding Path=BindingContext.DragStartingCommand, Source={x:Reference ViewCollection}}"
                    DragStartingCommandParameter="{Binding .}"/>
          </Frame.GestureRecognizers>
        </Frame>
      </DataTemplate>
      <vokabelmodul:VocabularyViewTemplateSelector
        x:Key="vocViewTemplateSelector"
        TranslationTemplate="{StaticResource translationHeaderTemplate}"
        PictureTemplate="{StaticResource pictureHeaderTemplate}"
        TTSTemplate="{StaticResource ttsHeaderTemplate}"/>
    </ResourceDictionary>
  </ContentPage.Resources>

我正在尝试使用模板选择器在我的 CollectionView 中使用它：

      <ContentPage.Content>
    <AbsoluteLayout>
      <StackLayout
      AbsoluteLayout.LayoutBounds="0,0,1,1"
      AbsoluteLayout.LayoutFlags="All">
        <Frame>
          <StackLayout>
            <Label Style="{x:StaticResource labelStyle}" FontSize="Small" x:Name="TimerLabel" Text="{Binding Remaining}"></Label>
            <ProgressBar x:Name="Progress" Progress="{Binding Progress}" ProgressColor="Blue"></ProgressBar>
          </StackLayout>
        </Frame>
        <StackLayout x:Name="InnerStack">
          <CollectionView      
          x:Name="ViewCollection"
          ItemsSource="{Binding ViewObjects}"
          VerticalOptions="Center"
          Margin="5"
            ItemTemplate="{StaticResource translationTemplate}"
            HeaderTemplate="{StaticResource vocViewTemplateSelector}"
            Header="{Binding .}"
            >
            <CollectionView.EmptyView>
              <Label Text="No VocabularyItems!" Style="{x:StaticResource boldLabelStyle}"></Label>
            </CollectionView.EmptyView>
            <CollectionView.ItemsLayout>
              <GridItemsLayout
              Orientation="Vertical"
              HorizontalItemSpacing="5"
              VerticalItemSpacing="5"
              Span="2"/>
            </CollectionView.ItemsLayout>
          </CollectionView>
        </StackLayout>
      </StackLayout>
    </AbsoluteLayout>
  </ContentPage.Content>

但是当我运行程序时，我总是收到“System.InvalidOperationException: 'LoadTemplate should not be null'”。

当我像这样直接绑定我的 HeaderTemplate 时：

 HeaderTemplate="{StaticResource someHeaderTemplate}"

效果很好。

我在我的 TemplateSelector 类中添加了一个日志和断点，但 OnSelectTemplate 甚至没有被调用。 我还为我的 ItemTemplate 使用了另一个 Templateselector，它工作得很好。

任何帮助将不胜感激。

Answer 1

1. 在你的xaml页面中，你的DataTemplate标签没有添加任何数据或样式，你需要给每个DataTemplate标签添加样式。

2. 你还没有绑定CollectionView的Header数据。您需要将Header="{Binding ViewObjects}" 添加到您的 CollectionView 标记中。

这是我的xaml代码供你参考，希望能解决你的问题：

<ContentPage.Resources>
    <ResourceDictionary>
        <DataTemplate x:Key="someHeaderTemplate">
            <Label Text="aaa" BackgroundColor="LightPink"></Label>
        </DataTemplate>
        <DataTemplate x:Key="someOtherHeaderTemplate">
            <Label Text="bbb" BackgroundColor="Green"></Label>
        </DataTemplate>
        <DataTemplate x:Key="someThirdHeaderTemplate">
            <Label Text="ccc" BackgroundColor="Yellow"></Label>
        </DataTemplate>
        <nameSpace:templateSelector x:Key="templateSelector"
            first="{StaticResource someHeaderTemplate}"
            second="{StaticResource someOtherHeaderTemplate}"
            third="{StaticResource someThirdHeaderTemplate}"/>
    </ResourceDictionary>
</ContentPage.Resources>
<StackLayout>
    <CollectionView
      x:Name="ViewCollection"
      Header="{Binding ViewObjects}"
      ItemsSource="{Binding ViewObjects}"
      VerticalOptions="Center"
      Margin="5"
      HeaderTemplate="{StaticResource templateSelector}">
        <CollectionView.ItemTemplate>
            <DataTemplate>
                <Label></Label>
            </DataTemplate>
        </CollectionView.ItemTemplate>
    </CollectionView>
</StackLayout>