如何确保 WPF 中 ItemsControl 中的第一个项目仅显示标题？

Question

我正在使用 MVVM 将子项的 ObservableCollection 绑定到 ItemsControl。 ItemsControl 包含一个 UserControl，用于设置子级 UI 的样式。

<ItemsControl  ItemsSource="{Binding Documents}">
    <ItemsControl.ItemTemplate>
        <DataTemplate>      
            <View:DocumentView Margin="0, 10, 0, 0" />
        </DataTemplate>
    </ItemsControl.ItemTemplate>
</ItemsControl>

我想显示 ItemsControl 内容的标题行，但只想在顶部显示一次（不是每个子项）。如何在 DocumentView 用户控件中实现此行为？仅供参考，我正在使用 Grid 布局来为子行设置样式：

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="34"/>
        <ColumnDefinition Width="100"/>
        <ColumnDefinition Width="*" />
        <ColumnDefinition Width="60" />
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
        <RowDefinition />   
        <RowDefinition />
    </Grid.RowDefinitions>
    <TextBlock Grid.ColumnSpan="4" Grid.Row="0" Text="Should only show this at the top"></TextBlock>
    <Image Grid.Column="0" Grid.Row="1" Height="24" Width="24" Source="/Beazley.Documents.Presentation;component/Icons/error.png"></Image>        
    <ComboBox Grid.Column="1" Grid.Row="1" Name="ContentTypes" ItemsSource="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type View:MainView}}, Path=DataContext.ContentTypes}" SelectedValue="{Binding ContentType}"/>
    <TextBox Grid.Column="2" Grid.Row="1" Text="{Binding Path=FileName}"/>
    <Button Grid.Column="3" Grid.Row="1"
        Command="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type View:MainView}}, Path=DataContext.RemoveFile}"
        CommandParameter="{Binding}">Remove</Button>
</Grid> 

Answer 1

再想一想，你为什么要自己尝试这样做呢？

看起来您基本上只是想创建一个具有自定义列类型的表...您尝试过 ListView 或 DataGrid 控件吗？

Answer 2

您应该能够使用 AlternationCount 通过将 AlternationCount 设置为集合的大小来计算项目在 ItemsControl 中的位置。

然后将您的样式仅应用于 ItemsControl.AlternationIndex = 0 的项目。

假设您的集合大小为 5，ListBox（这是一个 ItemsControl）的示例：

<Grid>
  <Grid.Resources>
    <Style x:Key="alternatingWithTriggers" TargetType="{x:Type ListBoxItem}">
      <Setter Property="Background" Value="Blue"/>
      <Setter Property="Foreground" Value="White"/>
      <Style.Triggers>
        <Trigger Property="ListBox.AlternationIndex" Value="0">
          <Setter Property="Background" Value="CornflowerBlue"/>
          <Setter Property="Foreground" Value="Black"/>
        </Trigger>
      </Style.Triggers>
    </Style>

  </Grid.Resources>
  <ListBox AlternationCount="5" ItemsSource="{StaticResource data}" 
           ItemContainerStyle="{StaticResource alternatingWithTriggers}">
  </ListBox>
</Grid>

毫无疑问，也有一种无需触发器即可实现的方法...