Question

Using the TabControl element for Silverlight in Blend I created the following markup:

<controls:TabControl>
    <controls:TabItem Header="TabItem" Style="{StaticResource TabItemStyle1}" />
    <controls:TabItem Style="{StaticResource TabItemStyle1}">
        <controls:TabItem.Header>
            <StackPanel Orientation="Horizontal">
                <Path Data="M0,14L0,6 5,0 10,6 10,14 0,6 10,6 0,14 10,14"
                    StrokeLineJoin="Round" Margin="0 0 6 0"
                    Stroke="Black"/>
                <TextBlock Text="TabItem"/>
            </StackPanel>
        </controls:TabItem.Header>
    </controls:TabItem>
</controls:TabControl>

TabItemStyle1 is a copy of the default style of a TabItem.
I altered TabItemStyle1 by adding a color animation in the MouseOver storyboard so that unselected tab items become red when the mouse hovers them:

<ColorAnimation BeginTime="0" Duration="00:00:00.001"
    Storyboard.TargetName="HeaderTopUnselected"
    Storyboard.TargetProperty="(UIElement.Foreground).(SolidColorBrush.Color)"
    To="Red" />

Now when I hover the second tab, the text becomes red but the Path remains black:

How should I define the Path Stroke color to make it follow the same rule?

Answer 1

I made it work by binding the header content brushes to {TemplateBinding TextElement.Foreground}.

In other cases I used standard property binding with converters, for example if I had to adapt element’s brushes to item state.