How do I set the style of a child based on AlternateIndex of parent?

Question

I'm using a HeaderedItemsControl. Each item is a 3 column Grid with a Border and TextBlock in each column. I would like the background color of the Borders in each item to alternate. (Basic alternating row background effect.) I have attempted to create a style at the UserControl level for the Grid that applies a background color to all borders within it, based on the AlternationIndex of the containing control:

<Style TargetType="Grid" x:Key="myItemsGrid">
  <Style.Resources>
    <Style TargetType="Border">
      <Setter Property="Background" Value="Azure" />
      <Style.Triggers>
        <DataTrigger Binding="{Binding Path=AlternationIndex, RelativeSource={RelativeSource AncestorType=ItemsControl}}" Value="2">
          <Setter Property="Background" Value="{StaticResource color_LogoLight}" />
        </DataTrigger>
      </Style.Triggers>
    </Style>
  </Style.Resources>
</Style>

The Setter bit is working, as the borders are all "Azure". But how do I properly reference the AlternationIndex so that the border background color changes for every other row. I tried pointing the RelativeSource to HeaderedItemsControl and ItemsControl, but neither seems to be the proper target. I have browsed the live visual tree, but I can't find anything to reference, there.

Any help is appreciated.

Rekshino Rekshino · Accepted Answer · 2017-05-19T07:46:34

You have to look for AlternationIndex on the Item of ItemsControl, not on ItemsControl itself! But which type you have to search in binding for? For example in ListBox it's a ListBoxItem and in ItemsControl it's a ContentPresenter.
Don't forget Path=(ItemsControl.AlternationIndex) and for your case (AlternationIndex==2) you have to set AlternationCount in ItemsControl at least to 3! So this code should work:

<DataTrigger Binding="{Binding Path=(ItemsControl.AlternationIndex), RelativeSource={RelativeSource AncestorType=ContentPresenter}}" Value="2">
    <Setter Property="Background" Value="{StaticResource color_LogoLight}" />
</DataTrigger>

How do I set the style of a child based on AlternateIndex of parent?

1 Answers