WPF Collection Control Implementation delimiter (ItemsControl Separator)

This article is mainly for you in detail the WPF Collection Control implementation delimiter ItemsControl Separator, with a certain reference value, interested in small partners can refer to

In WPF collection controls, it is often necessary to insert a delimiter style between each collection item, but WPF's ItemsControl does not have a direct implementation of the related functions, so only consider the curve to salvation, after study, probably think of the following two ways to achieve.

First write the itemscontrol data template, as follows:

<ItemsControl ItemsSource="{Binding Source}" BorderThickness="1" BorderBrush="Blue" VerticalAlignment="Stretch">
 <ItemsControl.ItemTemplate>
  <DataTemplate>
   <Grid>
    <Grid.RowDefinitions>
     <RowDefinition Height="Auto" />
     <RowDefinition Height="*" />
    </Grid.RowDefinitions>
    <Border Name="Bd" Grid.Row="0" Height="1" Background="Red" />
    <TextBlock Grid.Row="1" Text="{Binding}" />
   </Grid>
  </DataTemplate>
 </ItemsControl.ItemTemplate>
</ItemsControl>

Where the border named BD is the delimiter, where the delimiter is visible at the head of each item, and now our goal is to hide the delimiter of the first item, which achieves the purpose of separating the item from the item.

The first implementation is the simplest, the use of the aggregate item forward binding previousdata, which is one of four binding methods, the estimate is usually used at least one, but this is useful, the code is as follows:

<DataTemplate.Triggers>
 <DataTrigger Binding="{Binding RelativeSource={RelativeSource PreviousData}}"
     Value="{x:Null}">
  <Setter TargetName="Bd" Property="Visibility" Value="Collapsed" />
 </DataTrigger>
</DataTemplate.Triggers>

When the preceding item is empty, the delimiter is hidden and a simple line of code is done. However, one drawback of this approach is that if you are using insert to add data to the front of the bound data source, there will be more than one item with no separators, and this will not occur if you add to the end of the queue or to the team.

The second implementation is to mark the index number for the collection item with the Alternationcount and alternationindex properties of the ItemsControl . Then hide the delimiter for the item with index number 0, with the following code:

Copy the Code code as follows:

<itemscontrol itemssource= "{Binding Source}" borderthickness= "1" borderbrush= "Blue"
Verticalalignment= "Stretch" alternationcount= "{Binding source.count}" >

The ItemsControl binding Alternationcount to the data source's Count property first, and then ItemsControl's Alternationindex property becomes the index number of the collection data source. Write the logic in the trigger:

<Border Name="Bd" Grid.Row="0" Height="1" Background="Red">
 <Border.Style>
  <Style TargetType="{x:Type Border}">
   <Style.Triggers>
    <DataTrigger
     Binding="{Binding Path=(ItemsControl.AlternationIndex), 
   RelativeSource={RelativeSource AncestorType={x:Type ContentPresenter}}}"
     Value="0">
     <Setter Property="Visibility" Value="Collapsed" />
    </DataTrigger>
   </Style.Triggers>
  </Style>
 </Border.Style>
</Border>

The trigger determines that when the index number is 0 o'clock hides the Border, this way the code amount is not small, the advantage is can absolutely realize this function, regardless of to the team first insert or the tail inserts, but Alternationcount and The Alternationindex property is meant to be used to implement features such as interlaced discoloration, where this function is occupied, so if your collection is capable of implementing both delimiters and interlaced styles, it may require an extra converter, but the converter content is also simple, You can restore the previous function by finding a remainder.