Different styles for alternate rows in ListBox

Simple but important feature which really help us in real-time applications.Giving different look and feel or colors to alternate rows helps users to differentiate two consecutive rows in a ListBox or ListView.Basically controls which are derived from ItemsControl.

Below xaml code shows how alternate colors are applied into a ListBox

Xaml code to create ListBox with 6 items

<ListBox AlternationCount="2">

    <ListBoxItem Content="Item1" />

    <ListBoxItem Content="Item2" />

    <ListBoxItem Content="Item3" />

    <ListBoxItem Content="Item4" />

    <ListBoxItem Content="Item5" />

    <ListBoxItem Content="Item6" />

</ListBox>

Xaml code of the Style which has the alternate style support.Note the change is in the ItemContainerStyle.Here Style is applied to ListBoxItem

<Style  TargetType="{x:Type ListBoxItem}">

    <Style.Triggers>

        <Trigger Property="ItemsControl.AlternationIndex"

                 Value="0">

            <Setter Property="Background"

                    Value="LightBlue"></Setter>

        </Trigger>

        <Trigger Property="ItemsControl.AlternationIndex"

                 Value="1">

            <Setter Property="Background"

                    Value="LightGreen"></Setter>

        </Trigger>

    </Style.Triggers>

</Style>

When we run it shows as follows

Description

Here the ItemsControl has got most of the implementation part.It has some members which control the behavior of alternate style.The attached property ItemsControl.AlternationIndex tells the index and according to that we can change color or anything through style.

The Alternation count specifies the frequency.Below code uses 3 as ItemsControl.AlternationCount.See the difference.

Creating ListBox

<ListBox AlternationCount="3">

    <ListBoxItem Content="Item1" />

    <ListBoxItem Content="Item2" />

    <ListBoxItem Content="Item3" />

    <ListBoxItem Content="Item4" />

    <ListBoxItem Content="Item5" />

    <ListBoxItem Content="Item6" />

</ListBox>

Style supports AlternationCount=3

<Style  TargetType="{x:Type ListBoxItem}">

    <Style.Triggers>

        <Trigger Property="ItemsControl.AlternationIndex"

                 Value="0">

            <Setter Property="Background"

                    Value="LightBlue"></Setter>

        </Trigger>

        <Trigger Property="ItemsControl.AlternationIndex"

                 Value="1">

            <Setter Property="Background"

                    Value="LightGreen"></Setter>

        </Trigger>

        <Trigger Property="ItemsControl.AlternationIndex"

                 Value="2">

            <Setter Property="Background"

                    Value="LightYellow"></Setter>

        </Trigger>

    </Style.Triggers>

</Style>

I don't think a sample is needed.